diff --git a/tests/page/expect-misc.spec.ts b/tests/page/expect-misc.spec.ts index 0ab5707a62..edb97cbc85 100644 --- a/tests/page/expect-misc.spec.ts +++ b/tests/page/expect-misc.spec.ts @@ -491,15 +491,33 @@ test('toHaveAccessibleDescription', async ({ page }) => { await expect(page.locator('div')).toHaveAccessibleDescription('foo bar baz'); }); -test('toHaveRole', async ({ page }) => { - await page.setContent(`
Button!
`); - await expect(page.locator('div')).toHaveRole('button'); - await expect(page.locator('div')).not.toHaveRole('checkbox'); - try { - // @ts-expect-error - await expect(page.locator('div')).toHaveRole(/button|checkbox/); - expect(1, 'Must throw when given a regular expression').toBe(2); - } catch (error) { - expect(error.message).toBe(`"role" argument in toHaveRole must be a string`); - } +test('toHaveAccessibleErrorMessage', async ({ page }) => { + await page.setContent(` +
+
+
Hello
+
This should not be considered.
+
+ `); + + const locator = page.locator('div[role="button"]'); + await expect(locator).toHaveAccessibleErrorMessage('Hello'); + await expect(locator).not.toHaveAccessibleErrorMessage('hello'); + await expect(locator).toHaveAccessibleErrorMessage('hello', { ignoreCase: true }); + await expect(locator).toHaveAccessibleErrorMessage(/ell\w/); + await expect(locator).not.toHaveAccessibleErrorMessage(/hello/); + await expect(locator).toHaveAccessibleErrorMessage(/hello/, { ignoreCase: true }); + await expect(locator).not.toHaveAccessibleErrorMessage('This should not be considered.'); +}); + +test('toHaveAccessibleErrorMessage fails when aria-invalid is not true', async ({ page }) => { + await page.setContent(` +
+ +
Username is required.
+
+ `); + + const input = page.locator('#username'); + await expect(input).not.toHaveAccessibleErrorMessage('Username is required.'); });