I’ve run into a focus issue with the HTML5 builds generated by Solar2D on Android 16, and after a lot of testing I think I understand what’s going on.
As you know, Solar2D appends this at the end of index.html:
<script>
window.addEventListener('load', function(){ window.focus() });
window.addEventListener('mousedown', function () {
document.activeElement.blur();
window.focus();
}, true);
</script>
On modern mobile browsers (at least on Android 16), this can break input completely after the game loses focus.
What happens is this: if the platform where the game is running injects any UI outside the canvas (a status bar, overlay controls, exit button, etc.) and the user taps that element, the browser shifts focus away from the game. That part is normal.
The problem comes afterward. When the player taps the canvas again, the game should simply regain focus and continue. But because the template forces window.focus() (and blurs whatever is active), the browser ends up in an inconsistent focus state. From that moment on, the canvas no longer properly receives input events. It doesn’t matter how many times you tap the canvas or elements inside it — the game stays frozen.
This seems to be related to the fact that window.focus() is no longer reliable in modern mobile browsers. Focus changes are heavily restricted and tightly bound to trusted user gestures. Forcing focus at the window level — especially combined with document.activeElement.blur() — can interfere with the browser’s own focus lifecycle.
I’ve been testing this specifically in Youtube Playables on Android 16, where the game runs embedded and the platform adds its own UI elements around it. The freeze was 100% reproducible there after interacting with those external UI elements.
After replacing the default focus logic with canvas-based focus management, the problem completely disappeared.
What I did instead was this:
<script>
const canvas = document.getElementById('canvas');
// Allow canvas to receive focus
canvas.tabIndex = 0;
// Focus it on load
window.addEventListener('load', () => {
canvas.focus();
});
// Refocus only when the user interacts with the canvas
canvas.addEventListener('pointerdown', () => {
canvas.focus();
});
</script>
The key difference is that I’m no longer forcing window.focus(). I’m only focusing the canvas itself, and only in response to real user interaction. That aligns much better with how modern mobile browsers expect focus to be handled.
After making this change, I could tap external UI elements, then tap the canvas again, and the game would recover normally every time. No freeze, no lost input.
So it looks like the default window.focus() + blur() logic in the HTML5 template is too aggressive for current mobile browser behavior. Managing focus directly on the canvas seems to be the safer and more future-proof approach.
Just sharing this in case it helps others running into similar issues on Android 16 or embedded mobile platforms.