diff --git a/tests/library/role-utils.spec.ts b/tests/library/role-utils.spec.ts index 55c4a3d1ad..245b6f9e1a 100644 --- a/tests/library/role-utils.spec.ts +++ b/tests/library/role-utils.spec.ts @@ -19,66 +19,76 @@ import fs from 'fs'; test.skip(({ mode }) => mode !== 'default'); -test('wpt accname', async ({ page, asset, server, browserName }) => { - const skipped = [ - // Spec clearly says to only use control's value when embedded in a label (step 2C). - 'name_heading-combobox-focusable-alternative-manual.html', - // This test expects ::before + title + ::after, which is neither 2F nor 2I. - 'name_test_case_659-manual.html', - // This test expects ::before + title + ::after, which is neither 2F nor 2I. - 'name_test_case_660-manual.html', - ]; - if (browserName === 'firefox') { - // This test contains the following style: - // [data-after]:after { content: attr(data-after); } - // In firefox, content is returned as "attr(data-after)" - // instead of being resolved to the actual value. - skipped.push('name_test_case_553-manual.html'); - } +const ranges = [ + 'name_test_case_539-manual.html', + 'name_test_case_721-manual.html', +]; - await page.addInitScript(() => { - const self = window as any; - self.setup = () => {}; - self.ATTAcomm = class { - constructor(data) { - self.steps = []; - for (const step of data.steps) { - if (!step.test.ATK) - continue; - for (const atk of step.test.ATK) { - if (atk[0] !== 'property' || atk[1] !== 'name' || atk[2] !== 'is' || typeof atk[3] !== 'string') +for (let range = 0; range <= ranges.length; range++) { + test('wpt accname #' + range, async ({ page, asset, server, browserName }) => { + const skipped = [ + // Spec clearly says to only use control's value when embedded in a label (step 2C). + 'name_heading-combobox-focusable-alternative-manual.html', + // This test expects ::before + title + ::after, which is neither 2F nor 2I. + 'name_test_case_659-manual.html', + // This test expects ::before + title + ::after, which is neither 2F nor 2I. + 'name_test_case_660-manual.html', + ]; + if (browserName === 'firefox') { + // This test contains the following style: + // [data-after]:after { content: attr(data-after); } + // In firefox, content is returned as "attr(data-after)" + // instead of being resolved to the actual value. + skipped.push('name_test_case_553-manual.html'); + } + + await page.addInitScript(() => { + const self = window as any; + self.setup = () => {}; + self.ATTAcomm = class { + constructor(data) { + self.steps = []; + for (const step of data.steps) { + if (!step.test.ATK) continue; - self.steps.push({ selector: '#' + step.element, name: atk[3] }); + for (const atk of step.test.ATK) { + if (atk[0] !== 'property' || atk[1] !== 'name' || atk[2] !== 'is' || typeof atk[3] !== 'string') + continue; + self.steps.push({ selector: '#' + step.element, name: atk[3] }); + } } } - } - }; - }); - - const testDir = asset('wpt/accname'); - const testFiles = fs.readdirSync(testDir, { withFileTypes: true }).filter(e => e.isFile() && e.name.endsWith('.html')).map(e => e.name); - for (const testFile of testFiles) { - if (skipped.includes(testFile)) - continue; - await test.step(testFile, async () => { - await page.goto(server.PREFIX + `/wpt/accname/` + testFile); - // Use $eval to force injected script. - const result = await page.$eval('body', () => { - const result = []; - for (const step of (window as any).steps) { - const element = document.querySelector(step.selector); - if (!element) - throw new Error(`Unable to resolve "${step.selector}"`); - const received = (window as any).__injectedScript.getElementAccessibleName(element); - result.push({ selector: step.selector, expected: step.name, received }); - } - return result; - }); - for (const { selector, expected, received } of result) - expect(received, `checking "${selector}"`).toBe(expected); + }; }); - } -}); + + const testDir = asset('wpt/accname'); + const testFiles = fs.readdirSync(testDir, { withFileTypes: true }).filter(e => e.isFile() && e.name.endsWith('.html')).map(e => e.name); + for (const testFile of testFiles) { + if (skipped.includes(testFile)) + continue; + const included = (range === 0 || testFile >= ranges[range - 1]) && (range === ranges.length || testFile < ranges[range]); + if (!included) + continue; + await test.step(testFile, async () => { + await page.goto(server.PREFIX + `/wpt/accname/` + testFile); + // Use $eval to force injected script. + const result = await page.$eval('body', () => { + const result = []; + for (const step of (window as any).steps) { + const element = document.querySelector(step.selector); + if (!element) + throw new Error(`Unable to resolve "${step.selector}"`); + const received = (window as any).__injectedScript.getElementAccessibleName(element); + result.push({ selector: step.selector, expected: step.name, received }); + } + return result; + }); + for (const { selector, expected, received } of result) + expect(received, `checking "${selector}"`).toBe(expected); + }); + } + }); +} test('axe-core implicit-role', async ({ page, asset, server }) => { await page.goto(server.EMPTY_PAGE); diff --git a/tests/page/page-click.spec.ts b/tests/page/page-click.spec.ts index 6ab07bfc3c..edb7a223ba 100644 --- a/tests/page/page-click.spec.ts +++ b/tests/page/page-click.spec.ts @@ -582,7 +582,15 @@ it('should wait for input to be enabled', async ({ page }) => { }); it('should wait for select to be enabled', async ({ page }) => { - await page.setContent(''); + await page.setContent(` + + + `); let done = false; const clickPromise = page.click('select').then(() => done = true); await giveItAChanceToClick(page);