pressing ESC when mouse is in relative mode on HTML5 (SDL2)

[bottle2]

the problem is this: when the user clicks on the window, I call SDL_SetRelativeMouseMode(true). but when I press ESC on a Web browser, three things happen: 1) no key event is received, 2) a mouse motion event with big relative values is sent, and 3) the mouse remains in relative mode. then I have to press ESC again to finally leave relative mode: 1) key event is received, and 2) no mouse motion event is sent. on Windows, everything works fine. we have a word in portuguese for this weird big mouse motion: "tastaviada".

contextual information:

$ uname -a
MINGW64_NT-10.0-19045 DESKTOP-QIBT7ND 3.5.4-0bc1222b.x86_64 2024-12-05 09:27 UTC x86_64 Msys
$ emcc -v
emcc (Emscripten gcc/clang-like replacement + linker emulating GNU ld) 3.1.74-git (1092ec30a3fb1d46b178
2ff1b4db5094d3d06ae5)
clang version 20.0.0git
Target: wasm32-unknown-emscripten
Thread model: posix
InstalledDir: C:/msys64/clang64/opt/emscripten-llvm/bin
$ pacman -Qi mingw-w64-clang-x86_64-SDL2
Name            : mingw-w64-clang-x86_64-SDL2
Version         : 2.30.11-1
Description     : A library for portable low-level access to a video framebuffer, audio output, mouse, and keyboard (Version 2) (mingw-w64)
Architecture    : any
URL             : https://libsdl.org/
Licenses        : spdx:Zlib
Groups          : None
Provides        : None
Depends On      : mingw-w64-clang-x86_64-gcc-libs  mingw-w64-clang-x86_64-libiconv  mingw-w64-clang-x86_64-vulkan
Optional Deps   : None
Required By     : mingw-w64-clang-x86_64-SDL2_image  mingw-w64-clang-x86_64-SDL2_net  mingw-w64-clang-x86_64-SDL2_ttf  mingw-w64-clang-x86_64-ffmpeg
Optional For    : mingw-w64-clang-x86_64-libde265
Conflicts With  : None
Replaces        : None
Installed Size  : 7.73 MiB
Packager        : CI (msys2/msys2-autobuild/35ff0b71/12593557521)
Build Date      : Fri Jan 3 03:09:42 2025
Install Date    : Thu Jan 9 11:44:37 2025
Install Reason  : Explicitly installed
Install Script  : No
Validated By    : SHA-256 Sum  Signature

MRE:

#include <inttypes.h>
#include <stdbool.h>
#include <stdio.h>

#include <SDL.h>

#ifdef __EMSCRIPTEN__
#include <emscripten.h>
#define LOOP(ITER) emscripten_set_main_loop((ITER), 0, 1)
#define LOOP_END emscripten_cancel_main_loop(); return
#else
static bool is_playing = true;
#define LOOP(ITER) while (is_playing) (ITER)()
#define LOOP_END is_playing = false; return
#endif

#define TRY(IT) \
if ((IT)) { SDL_LogError(SDL_LOG_CATEGORY_ERROR, \
            __FILE__ ":%d: %s\n", __LINE__, SDL_GetError()); \
            exit(EXIT_FAILURE); } else (void)0

static SDL_Window *window;

void iter(void)
{
    for (SDL_Event event; SDL_PollEvent(&event); )
    {
        if (SDL_QUIT == event.type)
        {
            SDL_DestroyWindow(window);
            SDL_QuitSubSystem(SDL_INIT_VIDEO | SDL_INIT_EVENTS);
            LOOP_END;
        }
	else if (SDL_KEYDOWN == event.type && SDLK_ESCAPE == event.key.keysym.sym)
        {
            SDL_Log("%" PRIu32 " ESC pressed down\n", event.motion.timestamp);
            SDL_SetRelativeMouseMode(false);
        }
        else if (SDL_MOUSEBUTTONDOWN == event.type && 1 == event.button.button)
        {
            SDL_Log("%" PRIu32 " Left mouse button down\n", event.motion.timestamp);
            SDL_SetRelativeMouseMode(true);
        }
	else if (SDL_MOUSEMOTION == event.type)
            SDL_Log(
                "%" PRIu32 " x: %" PRId32 " y: %" PRId32 "\n",
                event.motion.timestamp, event.motion.xrel, event.motion.yrel
            );
    }
}

int main(int argc, char *argv[])
{
    (void)argc;
    (void)argv;

    atexit(SDL_Quit);

    TRY(SDL_InitSubSystem(SDL_INIT_VIDEO | SDL_INIT_EVENTS));

    TRY(!(window = SDL_CreateWindow(
        "Mouse relative mode test",
        SDL_WINDOWPOS_UNDEFINED,
        SDL_WINDOWPOS_UNDEFINED,
        800, 600,
        SDL_WINDOW_RESIZABLE
    )));

    LOOP(iter);

    return 0;
}

disclaimer: emcc --clear-cache was run before compiling to HTML5.

commands used to compile:

$ cc -std=c99 $(pkg-config --cflags SDL2) -o simple2 simple2.c $(pkg-config --libs SDL2)
$ emcc -std=c99 -Oz -flto simple2.c --use-port=sdl2 -o index.html --shell-file=shell.html

file shell.html comes from here: https://github.com/floooh/sokol-samples/blob/3e746d86cd87f634f4f7793c2e8d0ef71a2067ca/webpage/shell.html

steps to reproduce:

1. open HTML5 build on browser emrun index.html
2. open developer tools, keep shell open
3. watch as several relative mouse motions are reported, along their timestamp. OKAY
4. press left mouse button once. cursor becomes invisible. OKAY
5. several relative mouse motions are reported. OKAY
6. press ESC once.
7. notice no ESC event was received!
8. notice that a relative mouse motion event with big values is sent! to make sure you see this, move the mouse really away from where you clicked before pressing ESC
9. notice mouse is still in relative mode!
10. press ESC again
11. notice a ESC key event was indeed sent!
12. notice no relative mouse event with big values is sent!

things go even more wild if you set relative mouse mode to true and you change tabs, perhaps with Alt-Tab.

I tested on Firefox 134.0 (64-bits) and Edge 131.0.2903.146 (Compilação oficial) (64 bits).

---

further issue that is NOT related to SDL (not part of issue, so don't worry and don't try to fix): Firefox absolutely hating gamers

I think that inside an iframe in Firefox, when relative mouse mode is set, the mouse drifts!!!!!! super annoying. you can see here, open with Firefox: https://www.newgrounds.com/projects/games/5597757/preview (this preview will go away in a few months)

related: https://bugzilla.mozilla.org/show_bug.cgi?id=1417702

I think this is the same issue from years ago, they never did anything. it works fine in every other Web browser. when you go fullscreen on Firefox, the drift disappears. I think the bug is much older. back then Unity Web Player and Adobe Shockwave existed, so nobody cared about FPS in HTML5, but when the these plugins were killed and people ported their games to HTML5, it became apparent Firefox hates children and bored adults worldwide