diff --git a/addons/web/static/src/core/hotkeys/hotkey_service.js b/addons/web/static/src/core/hotkeys/hotkey_service.js
index 79d7a87cb31..7411f4fc091 100644
--- a/addons/web/static/src/core/hotkeys/hotkey_service.js
+++ b/addons/web/static/src/core/hotkeys/hotkey_service.js
@@ -88,7 +88,7 @@ export const hotkeyService = {
                 _originalEvent: event,
             };
             dispatch(infos);
-            removeHotkeyOverlays();
+            removeHotkeyOverlays(event);
         }
 
         /**
diff --git a/addons/web/static/tests/core/hotkeys/hotkey_service_tests.js b/addons/web/static/tests/core/hotkeys/hotkey_service_tests.js
index 1dfbd7147a4..efedd7b8271 100644
--- a/addons/web/static/tests/core/hotkeys/hotkey_service_tests.js
+++ b/addons/web/static/tests/core/hotkeys/hotkey_service_tests.js
@@ -175,6 +175,92 @@ QUnit.test("non-MacOS usability", async (assert) => {
     removeHotkey();
 });
 
+QUnit.test("the overlay of hotkeys is correctly displayed", async (assert) => {
+    assert.expect(7);
+
+    const displayHotkeysOverlay = () =>
+        window.dispatchEvent(new KeyboardEvent("keydown", { key: "alt", altKey: true }));
+
+    class MyComponent extends Component {
+        onClick(ev) {
+            assert.step(`click ${ev.target.dataset.hotkey}`);
+        }
+    }
+    MyComponent.template = xml`
+        <div>
+        <button t-on-click="onClick" data-hotkey="b"/>
+        <button t-on-click="onClick" data-hotkey="c"/>
+        </div>
+    `;
+    const comp = await mount(MyComponent, { env, target });
+    const getOverlays = () =>
+        [...comp.el.querySelectorAll(".o_web_hotkey_overlay")].map((el) => el.innerText);
+
+    displayHotkeysOverlay();
+    assert.deepEqual(getOverlays(), ["B", "C"], "should display the overlay");
+
+    // apply an existent hotkey
+    triggerHotkey(`alt+b`);
+    await nextTick();
+    assert.verifySteps(["click b"]);
+    assert.deepEqual(getOverlays(), [], "shouldn't display the overlay");
+
+    displayHotkeysOverlay();
+    assert.deepEqual(getOverlays(), ["B", "C"], "should display the overlay");
+
+    // apply a non-existent hotkey
+    triggerHotkey(`alt+x`);
+    await nextTick();
+    assert.deepEqual(getOverlays(), [], "shouldn't display the overlay");
+    assert.verifySteps([]);
+});
+
+QUnit.test("the overlay of hotkeys is correctly displayed on MacOs", async (assert) => {
+    assert.expect(7);
+
+    patchWithCleanup(browser, {
+        navigator: {
+            userAgent: browser.navigator.userAgent.replace(/\([^)]*\)/, "(MacOs)"),
+        },
+    });
+
+    const displayHotkeysOverlay = () =>
+        window.dispatchEvent(new KeyboardEvent("keydown", { key: "control", ctrlKey: true }));
+
+    class MyComponent extends Component {
+        onClick(ev) {
+            assert.step(`click ${ev.target.dataset.hotkey}`);
+        }
+    }
+    MyComponent.template = xml`
+        <div>
+        <button t-on-click="onClick" data-hotkey="b"/>
+        <button t-on-click="onClick" data-hotkey="c"/>
+        </div>
+    `;
+    const comp = await mount(MyComponent, { env, target });
+    const getOverlays = () =>
+        [...comp.el.querySelectorAll(".o_web_hotkey_overlay")].map((el) => el.innerText);
+
+    displayHotkeysOverlay();
+    assert.deepEqual(getOverlays(), ["B", "C"], "should display the overlay");
+
+    // apply an existent hotkey
+    triggerHotkey(`alt+b`);
+    await nextTick();
+    assert.verifySteps(["click b"]);
+    assert.deepEqual(getOverlays(), [], "shouldn't display the overlay");
+
+    displayHotkeysOverlay();
+    assert.deepEqual(getOverlays(), ["B", "C"], "should display the overlay");
+
+    // apply a non-existent hotkey
+    triggerHotkey(`alt+x`);
+    await nextTick();
+    assert.deepEqual(getOverlays(), [], "shouldn't display the overlay");
+    assert.verifySteps([]);
+});
+
 QUnit.test("MacOS usability", async (assert) => {
     assert.expect(6);