Filip/playwright
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

add aria-label to copy button, improve tests

Browse source
This commit is contained in:
Anthony Roberts 2024-09-04 17:39:26 +10:00
parent 2b33c35527
commit 3e99f9678f
3 changed files with 10 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
packages/html-reporter/src/copyToClipboard.tsx
View file

@ -39,7 +39,7 @@ export const CopyToClipboard: React.FunctionComponent<CopyToClipboardProps> = ({
}); });
}, [value]); }, [value]);
const iconElement = icon === 'check' ? icons.check() : icon === 'cross' ? icons.cross() : icons.copy(); const iconElement = icon === 'check' ? icons.check() : icon === 'cross' ? icons.cross() : icons.copy();
return <button className='copy-icon' onClick={handleCopy}>{iconElement}</button>; return <button className='copy-icon' aria-label='Copy to clipboard' onClick={handleCopy}>{iconElement}</button>;
}; };
type CopyToClipboardContainerProps = CopyToClipboardProps & { type CopyToClipboardContainerProps = CopyToClipboardProps & {

3
packages/html-reporter/src/testCaseView.css
View file

@ -73,5 +73,4 @@
display: flex; display: flex;
flex-direction: row; flex-direction: row;
flex-wrap: wrap; flex-wrap: wrap;
} }

10
packages/html-reporter/src/testCaseView.spec.tsx
View file

@ -76,11 +76,17 @@ test('should render test case', async ({ mount }) => {
await expect(component.getByText('My test')).toBeVisible(); await expect(component.getByText('My test')).toBeVisible();
}); });
test('should render copy buttons for annotations', async ({ mount }) => { test('should render copy buttons for annotations', async ({ mount, page, context }) => {
await context.grantPermissions(['clipboard-read', 'clipboard-write']);
const component = await mount(<TestCaseView projectNames={['chromium', 'webkit']} test={testCase} run={0} anchor=''></TestCaseView>); const component = await mount(<TestCaseView projectNames={['chromium', 'webkit']} test={testCase} run={0} anchor=''></TestCaseView>);
await expect(component.getByText('Annotation text', { exact: false }).first()).toBeVisible(); await expect(component.getByText('Annotation text', { exact: false }).first()).toBeVisible();
component.getByText('Annotation text', { exact: false }).first().hover(); component.getByText('Annotation text', { exact: false }).first().hover();
await expect(component.getByRole('button').first()).toBeVisible(); await expect(component.getByLabel('Copy to clipboard').first()).toBeVisible();
await component.getByLabel('Copy to clipboard').first().click();
const handle = await page.evaluateHandle(() => navigator.clipboard.readText());
const clipboardContent = await handle.jsonValue();
expect(clipboardContent).toBe('Annotation text');
}); });
const annotationLinkRenderingTestCase: TestCase = { const annotationLinkRenderingTestCase: TestCase = {