feat(ct): react explicit hooks config generic type

This commit is contained in:
sand4rt 2024-06-06 19:22:00 +02:00
parent cd57031c19
commit a43d5d6f42
12 changed files with 32 additions and 32 deletions

View file

@ -14,11 +14,9 @@
* limitations under the License. * limitations under the License.
*/ */
export interface RegisterHooksConfig {} export declare function beforeMount<HooksConfig>(
export declare function beforeMount<HooksConfig = RegisterHooksConfig>(
callback: (params: { hooksConfig?: HooksConfig; App: () => JSX.Element }) => Promise<void | JSX.Element> callback: (params: { hooksConfig?: HooksConfig; App: () => JSX.Element }) => Promise<void | JSX.Element>
): void; ): void;
export declare function afterMount<HooksConfig = RegisterHooksConfig>( export declare function afterMount<HooksConfig>(
callback: (params: { hooksConfig?: HooksConfig }) => Promise<void> callback: (params: { hooksConfig?: HooksConfig }) => Promise<void>
): void; ): void;

View file

@ -15,10 +15,9 @@
*/ */
import type { Locator } from 'playwright/test'; import type { Locator } from 'playwright/test';
import type { TestType } from '@playwright/experimental-ct-core'; import type { TestType as BaseTestType } from '@playwright/experimental-ct-core';
import type { RegisterHooksConfig } from './hooks';
export interface MountOptions<HooksConfig extends RegisterHooksConfig> { export interface MountOptions<HooksConfig> {
hooksConfig?: HooksConfig; hooksConfig?: HooksConfig;
} }
@ -27,12 +26,14 @@ export interface MountResult extends Locator {
update(component: JSX.Element): Promise<void>; update(component: JSX.Element): Promise<void>;
} }
export const test: TestType<{ export type TestType<TestHooksConfig = Record<string, any>> = BaseTestType<{
mount<HooksConfig extends RegisterHooksConfig = RegisterHooksConfig>( mount<HooksConfig extends TestHooksConfig>(
component: JSX.Element, component: JSX.Element,
options?: MountOptions<HooksConfig> options?: MountOptions<HooksConfig>
): Promise<MountResult>; ): Promise<MountResult>;
}>; }>;
export const test: TestType;
export { defineConfig, type PlaywrightTestConfig } from '@playwright/experimental-ct-core'; export { defineConfig, type PlaywrightTestConfig } from '@playwright/experimental-ct-core';
export { expect, devices } from 'playwright/test'; export { expect, devices } from 'playwright/test';

View file

@ -14,11 +14,9 @@
* limitations under the License. * limitations under the License.
*/ */
export interface RegisterHooksConfig {} export declare function beforeMount<HooksConfig>(
export declare function beforeMount<HooksConfig = RegisterHooksConfig>(
callback: (params: { hooksConfig?: HooksConfig; App: () => JSX.Element }) => Promise<void | JSX.Element> callback: (params: { hooksConfig?: HooksConfig; App: () => JSX.Element }) => Promise<void | JSX.Element>
): void; ): void;
export declare function afterMount<HooksConfig = RegisterHooksConfig>( export declare function afterMount<HooksConfig>(
callback: (params: { hooksConfig?: HooksConfig }) => Promise<void> callback: (params: { hooksConfig?: HooksConfig }) => Promise<void>
): void; ): void;

View file

@ -15,10 +15,9 @@
*/ */
import type { Locator } from 'playwright/test'; import type { Locator } from 'playwright/test';
import type { TestType } from '@playwright/experimental-ct-core'; import type { TestType as BaseTestType } from '@playwright/experimental-ct-core';
import type { RegisterHooksConfig } from './hooks';
export interface MountOptions<HooksConfig extends RegisterHooksConfig> { export interface MountOptions<HooksConfig> {
hooksConfig?: HooksConfig; hooksConfig?: HooksConfig;
} }
@ -27,12 +26,14 @@ export interface MountResult extends Locator {
update(component: JSX.Element): Promise<void>; update(component: JSX.Element): Promise<void>;
} }
export const test: TestType<{ export type TestType<TestHooksConfig = Record<string, any>> = BaseTestType<{
mount<HooksConfig extends RegisterHooksConfig = RegisterHooksConfig>( mount<HooksConfig extends TestHooksConfig>(
component: JSX.Element, component: JSX.Element,
options?: MountOptions<HooksConfig> options?: MountOptions<HooksConfig>
): Promise<MountResult>; ): Promise<MountResult>;
}>; }>;
export const test: TestType;
export { defineConfig, type PlaywrightTestConfig } from '@playwright/experimental-ct-core'; export { defineConfig, type PlaywrightTestConfig } from '@playwright/experimental-ct-core';
export { expect, devices } from 'playwright/test'; export { expect, devices } from 'playwright/test';

View file

@ -1,20 +1,22 @@
import { test as baseTest, type TestType } from '@playwright/experimental-ct-react';
import { beforeMount, afterMount } from '@playwright/experimental-ct-react/hooks'; import { beforeMount, afterMount } from '@playwright/experimental-ct-react/hooks';
import { BrowserRouter } from 'react-router-dom'; import { BrowserRouter } from 'react-router-dom';
import '../src/assets/index.css'; import '../src/assets/index.css';
declare module '@playwright/experimental-ct-react/hooks' { type HooksConfig = {
interface RegisterHooksConfig {
routing?: boolean; routing?: boolean;
}
} }
beforeMount(async ({ hooksConfig, App }) => { export * from '@playwright/experimental-ct-react';
export const test = baseTest as TestType<HooksConfig>;
beforeMount<HooksConfig>(async ({ hooksConfig, App }) => {
console.log(`Before mount: ${JSON.stringify(hooksConfig)}`); console.log(`Before mount: ${JSON.stringify(hooksConfig)}`);
if (hooksConfig?.routing) if (hooksConfig?.routing)
return <BrowserRouter><App /></BrowserRouter>; return <BrowserRouter><App /></BrowserRouter>;
}); });
afterMount(async () => { afterMount<HooksConfig>(async () => {
console.log(`After mount`); console.log(`After mount`);
}); });

View file

@ -1,4 +1,4 @@
import { test, expect } from '@playwright/experimental-ct-react'; import { test, expect } from '../playwright';
import Button from '@/components/Button'; import Button from '@/components/Button';
import DefaultChildren from '@/components/DefaultChildren'; import DefaultChildren from '@/components/DefaultChildren';

View file

@ -1,4 +1,4 @@
import { test, expect } from '@playwright/experimental-ct-react'; import { test, expect } from '../playwright';
import Button from '@/components/Button'; import Button from '@/components/Button';
import CheckChildrenProp from '@/components/CheckChildrenProp'; import CheckChildrenProp from '@/components/CheckChildrenProp';
import DefaultChildren from '@/components/DefaultChildren'; import DefaultChildren from '@/components/DefaultChildren';

View file

@ -1,4 +1,4 @@
import { test, expect } from '@playwright/experimental-ct-react'; import { test, expect } from '../playwright';
import App from '@/App'; import App from '@/App';
test('navigate to a page by clicking a link', async ({ page, mount }) => { test('navigate to a page by clicking a link', async ({ page, mount }) => {
@ -12,7 +12,7 @@ test('navigate to a page by clicking a link', async ({ page, mount }) => {
await expect(page).toHaveURL('/dashboard'); await expect(page).toHaveURL('/dashboard');
}); });
test('update should not reset mount hooks', async ({ page, mount }) => { test('update should not reset mount hooks', async ({ mount }) => {
const component = await mount(<App title='before'/>, { const component = await mount(<App title='before'/>, {
hooksConfig: { routing: true }, hooksConfig: { routing: true },
}); });

View file

@ -1,4 +1,4 @@
import { test, expect } from '@playwright/experimental-ct-react'; import { test, expect } from '../playwright';
import Button from '@/components/Button'; import Button from '@/components/Button';
import EmptyFragment from '@/components/EmptyFragment'; import EmptyFragment from '@/components/EmptyFragment';
import { ComponentAsProp } from '@/components/ComponentAsProp'; import { ComponentAsProp } from '@/components/ComponentAsProp';

View file

@ -1,4 +1,4 @@
import { test, expect } from '@playwright/experimental-ct-react'; import { test, expect } from '../playwright';
import TitleWithFont from '@/components/TitleWithFont'; import TitleWithFont from '@/components/TitleWithFont';
test('should load font without routes', async ({ mount, page }) => { test('should load font without routes', async ({ mount, page }) => {

View file

@ -1,4 +1,4 @@
import { test, expect } from '@playwright/experimental-ct-react'; import { test, expect } from '../playwright';
import Button from '@/components/Button'; import Button from '@/components/Button';
import MultiRoot from '@/components/MultiRoot'; import MultiRoot from '@/components/MultiRoot';

View file

@ -1,4 +1,4 @@
import { test, expect } from '@playwright/experimental-ct-react'; import { test, expect } from '../playwright';
import Counter from '@/components/Counter'; import Counter from '@/components/Counter';
import DefaultChildren from '@/components/DefaultChildren'; import DefaultChildren from '@/components/DefaultChildren';