diff --git a/web_src/js/utils/dom.ts b/web_src/js/utils/dom.ts index 06c5e8b486..6e830b9817 100644 --- a/web_src/js/utils/dom.ts +++ b/web_src/js/utils/dom.ts @@ -1,6 +1,7 @@ import {debounce} from 'throttle-debounce'; import type {Promisable} from 'type-fest'; import type $ from 'jquery'; +import {isInFrontendUnitTest} from './testhelper.ts'; type ArrayLikeIterable<T> = ArrayLike<T> & Iterable<T>; // for NodeListOf and Array type ElementArg = Element | string | ArrayLikeIterable<Element> | ReturnType<typeof $>; @@ -76,8 +77,8 @@ export function queryElemSiblings<T extends Element>(el: Element, selector = '*' // it works like jQuery.children: only the direct children are selected export function queryElemChildren<T extends Element>(parent: Element | ParentNode, selector = '*', fn?: ElementsCallback<T>): ArrayLikeIterable<T> { - if (window.vitest) { - // bypass the vitest bug: it doesn't support ":scope >" + if (isInFrontendUnitTest()) { + // https://github.com/capricorn86/happy-dom/issues/1620 : ":scope" doesn't work const selected = Array.from<T>(parent.children as any).filter((child) => child.matches(selector)); return applyElemsCallback<T>(selected, fn); } @@ -357,6 +358,6 @@ export function addDelegatedEventListener<T extends HTMLElement, E extends Event parent.addEventListener(type, (e: Event) => { const elem = (e.target as HTMLElement).closest(selector); if (!elem) return; - listener(elem as T, e); + listener(elem as T, e as E); }, options); } diff --git a/web_src/js/utils/testhelper.ts b/web_src/js/utils/testhelper.ts new file mode 100644 index 0000000000..e91cf85e86 --- /dev/null +++ b/web_src/js/utils/testhelper.ts @@ -0,0 +1,6 @@ +// there could be different "testing" concepts, for example: backend's "setting.IsInTesting" +// even if backend is in testing mode, frontend could be complied in production mode +// so this function only checks if the frontend is in unit testing mode (usually from *.test.ts files) +export function isInFrontendUnitTest() { + return process.env.TEST === 'true'; +}