From a3237e53e7d3d2ca3ac24e6dbe791384f83d3d78 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= Date: Tue, 30 Jul 2024 14:07:38 +0200 Subject: [PATCH] comments and clearing --- .../core/lit-element/directives/focus.lit-directive.ts | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/lit-element/directives/focus.lit-directive.ts b/src/Umbraco.Web.UI.Client/src/packages/core/lit-element/directives/focus.lit-directive.ts index 51337f192f..e806e4d11b 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/core/lit-element/directives/focus.lit-directive.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/core/lit-element/directives/focus.lit-directive.ts @@ -16,6 +16,7 @@ function hasFocus(current: any) { class UmbFocusDirective extends AsyncDirective { static #next?: HTMLElement; #el?: HTMLElement; + #timeout?: number; override render() { return nothing; @@ -39,10 +40,16 @@ class UmbFocusDirective extends AsyncDirective { * cause Lit does not re-render the element but also notice reconnect callback on the directive is not triggered either. [NL] */ #setFocus = () => { + // Make sure we clear the timeout, so we don't get multiple timeouts running. + if (this.#timeout) { + clearTimeout(this.#timeout); + this.#timeout = undefined; + } + // If this is the next element to focus, then try to focus it. if (this.#el && this.#el === UmbFocusDirective.#next) { this.#el.focus(); if (hasFocus(document.activeElement) !== this.#el) { - setTimeout(this.#setFocus, 100); + this.#timeout = setTimeout(this.#setFocus, 100) as unknown as number; } else { UmbFocusDirective.#next = undefined; }