From 4a3d79f291b65efdac22706bc228e93debcc740f Mon Sep 17 00:00:00 2001 From: Sander Date: Thu, 9 Feb 2023 17:58:15 +0100 Subject: [PATCH] chore(ct): improve internal hook types (#20722) --- packages/playwright-ct-react/registerSource.mjs | 4 ++-- packages/playwright-ct-solid/registerSource.mjs | 4 ++-- packages/playwright-ct-svelte/registerSource.mjs | 4 ++-- packages/playwright-ct-vue/registerSource.mjs | 4 ++-- packages/playwright-ct-vue2/registerSource.mjs | 6 +++--- packages/playwright-test/types/component.d.ts | 4 +++- 6 files changed, 14 insertions(+), 12 deletions(-) diff --git a/packages/playwright-ct-react/registerSource.mjs b/packages/playwright-ct-react/registerSource.mjs index a89f05b48c..5c8c97f4f7 100644 --- a/packages/playwright-ct-react/registerSource.mjs +++ b/packages/playwright-ct-react/registerSource.mjs @@ -71,7 +71,7 @@ function render(component) { window.playwrightMount = async (component, rootElement, hooksConfig) => { let App = () => render(component); - for (const hook of /** @type {any} */(window).__pw_hooks_before_mount || []) { + for (const hook of window.__pw_hooks_before_mount || []) { const wrapper = await hook({ App, hooksConfig }); if (wrapper) App = () => wrapper; @@ -79,7 +79,7 @@ window.playwrightMount = async (component, rootElement, hooksConfig) => { ReactDOM.render(App(), rootElement); - for (const hook of /** @type {any} */(window).__pw_hooks_after_mount || []) + for (const hook of window.__pw_hooks_after_mount || []) await hook({ hooksConfig }); }; diff --git a/packages/playwright-ct-solid/registerSource.mjs b/packages/playwright-ct-solid/registerSource.mjs index 7781807cd1..cb71f0061e 100644 --- a/packages/playwright-ct-solid/registerSource.mjs +++ b/packages/playwright-ct-solid/registerSource.mjs @@ -79,7 +79,7 @@ const unmountKey = Symbol('unmountKey'); window.playwrightMount = async (component, rootElement, hooksConfig) => { let App = () => createComponent(component); - for (const hook of /** @type {any} */(window).__pw_hooks_before_mount || []) { + for (const hook of window.__pw_hooks_before_mount || []) { const wrapper = await hook({ App, hooksConfig }); if (wrapper) App = () => wrapper; @@ -88,7 +88,7 @@ window.playwrightMount = async (component, rootElement, hooksConfig) => { const unmount = solidRender(App, rootElement); rootElement[unmountKey] = unmount; - for (const hook of /** @type {any} */(window).__pw_hooks_after_mount || []) + for (const hook of window.__pw_hooks_after_mount || []) await hook({ hooksConfig }); }; diff --git a/packages/playwright-ct-svelte/registerSource.mjs b/packages/playwright-ct-svelte/registerSource.mjs index 3d19a5f9f3..0ac4185ea2 100644 --- a/packages/playwright-ct-svelte/registerSource.mjs +++ b/packages/playwright-ct-svelte/registerSource.mjs @@ -87,7 +87,7 @@ window.playwrightMount = async (component, rootElement, hooksConfig) => { throw new Error('JSX mount notation is not supported'); - for (const hook of /** @type {any} */(window).__pw_hooks_before_mount || []) + for (const hook of window.__pw_hooks_before_mount || []) await hook({ hooksConfig }); const svelteComponent = /** @type {SvelteComponent} */ (new componentCtor({ @@ -103,7 +103,7 @@ window.playwrightMount = async (component, rootElement, hooksConfig) => { for (const [key, listener] of Object.entries(component.options?.on || {})) svelteComponent.$on(key, event => listener(event.detail)); - for (const hook of /** @type {any} */(window).__pw_hooks_after_mount || []) + for (const hook of window.__pw_hooks_after_mount || []) await hook({ hooksConfig, svelteComponent }); }; diff --git a/packages/playwright-ct-vue/registerSource.mjs b/packages/playwright-ct-vue/registerSource.mjs index a5955353db..b30e32ffd3 100644 --- a/packages/playwright-ct-vue/registerSource.mjs +++ b/packages/playwright-ct-vue/registerSource.mjs @@ -232,12 +232,12 @@ window.playwrightMount = async (component, rootElement, hooksConfig) => { }); setDevtoolsHook(createDevTools(), {}); - for (const hook of /** @type {any} */(window).__pw_hooks_before_mount || []) + for (const hook of window.__pw_hooks_before_mount || []) await hook({ app, hooksConfig }); const instance = app.mount(rootElement); rootElement[appKey] = app; - for (const hook of /** @type {any} */(window).__pw_hooks_after_mount || []) + for (const hook of window.__pw_hooks_after_mount || []) await hook({ app, hooksConfig, instance }); }; diff --git a/packages/playwright-ct-vue2/registerSource.mjs b/packages/playwright-ct-vue2/registerSource.mjs index 8db13ca24c..64b8ac5042 100644 --- a/packages/playwright-ct-vue2/registerSource.mjs +++ b/packages/playwright-ct-vue2/registerSource.mjs @@ -161,7 +161,7 @@ const wrapperKey = Symbol('wrapperKey'); window.playwrightMount = async (component, rootElement, hooksConfig) => { let options = {}; - for (const hook of /** @type {any} */(window).__pw_hooks_before_mount || []) + for (const hook of window.__pw_hooks_before_mount || []) options = await hook({ hooksConfig, Vue }); const instance = new Vue({ @@ -175,12 +175,12 @@ window.playwrightMount = async (component, rootElement, hooksConfig) => { rootElement.appendChild(instance.$el); /** @type {any} */ (rootElement)[instanceKey] = instance; - for (const hook of /** @type {any} */(window).__pw_hooks_after_mount || []) + for (const hook of window.__pw_hooks_after_mount || []) await hook({ hooksConfig, instance }); }; window.playwrightUnmount = async rootElement => { - const component = /** @type {any} */(rootElement)[instanceKey]; + const component = rootElement[instanceKey]; if (!component) throw new Error('Component was not mounted'); component.$destroy(); diff --git a/packages/playwright-test/types/component.d.ts b/packages/playwright-test/types/component.d.ts index 2c92a8e1ae..22f29cc2a8 100644 --- a/packages/playwright-test/types/component.d.ts +++ b/packages/playwright-test/types/component.d.ts @@ -24,7 +24,7 @@ export type JsxComponent = { export type MountOptions = { props?: Record, slots?: Record, - on?: { [key: string]: Function }, + on?: Record, hooksConfig?: any, }; @@ -41,5 +41,7 @@ declare global { playwrightMount(component: Component, rootElement: Element, hooksConfig: any): Promise; playwrightUnmount(rootElement: Element): Promise; playwrightUpdate(rootElement: Element, component: Component): Promise; + __pw_hooks_before_mount?: ((params: { hooksConfig: HooksConfig; } & any) => Promise)[]; + __pw_hooks_after_mount?: ((params: { hooksConfig: HooksConfig; } & any) => Promise)[]; } }