yujunjun/playwright
1
0
Fork 0
mirror of https://github.com/microsoft/playwright.git synced 2025-06-26 21:40:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(ct): solid unmount (#16838)

Browse Source
This commit is contained in:
sand4rt 2022-08-26 20:51:36 +02:00 committed by GitHub
parent 6319b14069
commit 0972f1469a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 39 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
packages/playwright-ct-solid/index.d.ts vendored
View File

@ -38,7 +38,9 @@ export interface MountOptions {
hooksConfig?: any;
}
interface MountResult extends Locator {}
interface MountResult extends Locator {
unmount(): Promise<void>;
}
export interface ComponentFixtures {
mount(component: JSX.Element, options?: MountOptions): Promise<MountResult>;

13
packages/playwright-ct-solid/registerSource.mjs
View File

@ -57,12 +57,23 @@ function render(component) {
return createComponent(componentFunc, component.props);
}
const unmountKey = Symbol('disposeKey');
window.playwrightMount = async (component, rootElement, hooksConfig) => {
for (const hook of /** @type {any} */(window).__pw_hooks_before_mount || [])
await hook({ hooksConfig });
solidRender(() => render(component), rootElement);
const unmount = solidRender(() => render(component), rootElement);
rootElement[unmountKey] = unmount;
for (const hook of /** @type {any} */(window).__pw_hooks_after_mount || [])
await hook({ hooksConfig });
};
window.playwrightUnmount = async rootElement => {
const unmount = rootElement[unmountKey];
if (!unmount)
throw new Error('Component was not mounted');
unmount();
};

6
tests/components/ct-solid/src/components/MultiRoot.tsx Normal file
View File

@ -0,0 +1,6 @@
export default function MultiRoot() {
return <>
<div>root 1</div>
<div>root 2</div>
</>
}

19
tests/components/ct-solid/src/tests.spec.tsx
View File

@ -1,5 +1,6 @@
import { test, expect } from '@playwright/experimental-ct-solid'
import Button from './components/Button';
import MultiRoot from './components/MultiRoot';
test.use({ viewport: { width: 500, height: 500 } });
@ -15,4 +16,20 @@ test('callback should work', async ({ mount }) => {
}}></Button>)
await component.click()
expect(messages).toEqual(['hello'])
})
});
test('should unmount', async ({ page, mount }) => {
const component = await mount(<Button title="Submit" />)
await expect(page.locator('#root')).toContainText('Submit')
await component.unmount();
await expect(page.locator('#root')).not.toContainText('Submit');
});
test('unmount a multi root component should work', async ({ mount, page }) => {
const component = await mount(<MultiRoot />)
await expect(page.locator('#root')).toContainText('root 1')
await expect(page.locator('#root')).toContainText('root 2')
await component.unmount()
await expect(page.locator('#root')).not.toContainText('root 1')
await expect(page.locator('#root')).not.toContainText('root 2')
});