diff --git a/addons/web/static/src/core/utils/hooks.js b/addons/web/static/src/core/utils/hooks.js index f2dd5c0a6f8..efe08f7ec4f 100644 --- a/addons/web/static/src/core/utils/hooks.js +++ b/addons/web/static/src/core/utils/hooks.js @@ -31,16 +31,16 @@ const { status, useComponent, useEffect, useRef } = owl; */ export function useAutofocus() { const comp = useComponent(); + let ref = useRef("autofocus"); // Prevent autofocus in mobile if (comp.env.isSmall) { - return () => {}; + return ref; } // LEGACY if (comp.env.device && comp.env.device.isMobileDevice) { - return () => {}; + return ref; } // LEGACY - let ref = useRef("autofocus"); useEffect( (el) => { if (el) { diff --git a/addons/web/static/tests/core/utils/hooks_tests.js b/addons/web/static/tests/core/utils/hooks_tests.js index 3ca312908c9..2e66246d1a3 100644 --- a/addons/web/static/tests/core/utils/hooks_tests.js +++ b/addons/web/static/tests/core/utils/hooks_tests.js @@ -6,7 +6,7 @@ import { registry } from "@web/core/registry"; import { makeTestEnv } from "@web/../tests/helpers/mock_env"; import { click, destroy, getFixture, mount, nextTick } from "@web/../tests/helpers/utils"; -const { Component, xml } = owl; +const { Component, onMounted, xml } = owl; const serviceRegistry = registry.category("services"); QUnit.module("utils", () => { @@ -72,6 +72,43 @@ QUnit.module("utils", () => { assert.strictEqual(document.activeElement, comp.inputRef.el); }); + QUnit.test("useAutofocus returns also a ref when isSmall is true", async function (assert) { + assert.expect(2); + class MyComponent extends Component { + setup() { + this.inputRef = useAutofocus(); + assert.ok(this.env.isSmall); + onMounted(() => { + assert.ok(this.inputRef.el); + }); + } + } + MyComponent.template = xml` + + + + `; + + const fakeUIService = { + start(env) { + let ui = {}; + Object.defineProperty(env, "isSmall", { + get() { + return true; + }, + }); + + return ui; + }, + }; + + registry.category("services").add("ui", fakeUIService); + + const env = await makeTestEnv(); + const target = getFixture(); + await mount(MyComponent, target, { env }); + }); + QUnit.module("useBus"); QUnit.test("useBus hook: simple usecase", async function (assert) {