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

test: update regression tests to align with logic changes

Browse source
This commit is contained in:
Pengoose 2024-12-18 10:34:11 +09:00
parent 6e7aebee53
commit cab504b96d
1 changed files with 34 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

34
tests/page/expect-misc.spec.ts
View file

@ -568,9 +568,22 @@ test.describe('toHaveAccessibleErrorMessage should handle aria-invalid attribute
}); });
}); });
test.describe('toHaveAccessibleErrorMessage should handle validity state', () => { test.describe('toHaveAccessibleErrorMessage should handle validity state with aria-invalid', () => {
const errorMessageText = 'Error message'; const errorMessageText = 'Error message';
test('should ignore aria-invalid="true" when HTMLElement.validity.valid is true', async ({ page }) => {
test('should show error message when validity is false and aria-invalid is true', async ({ page }) => {
await page.setContent(`
<form>
<input id="node" role="textbox" type="number" min="1" max="100" aria-invalid="true" aria-errormessage="error-msg" />
<div id="error-msg">${errorMessageText}</div>
</form>
`);
const locator = page.locator('#node');
await locator.fill('101');
await expect(locator).toHaveAccessibleErrorMessage(errorMessageText);
});
test('should show error message when validity is true and aria-invalid is true', async ({ page }) => {
await page.setContent(` await page.setContent(`
<form> <form>
<input id="node" role="textbox" type="number" min="1" max="100" aria-invalid="true" aria-errormessage="error-msg" /> <input id="node" role="textbox" type="number" min="1" max="100" aria-invalid="true" aria-errormessage="error-msg" />
@ -579,12 +592,22 @@ test.describe('toHaveAccessibleErrorMessage should handle validity state', () =>
`); `);
const locator = page.locator('#node'); const locator = page.locator('#node');
await locator.fill('99'); await locator.fill('99');
await expect(locator).not.toHaveAccessibleErrorMessage(errorMessageText); await expect(locator).toHaveAccessibleErrorMessage(errorMessageText);
});
test('should show error message when validity is false and aria-invalid is false', async ({ page }) => {
await page.setContent(`
<form>
<input id="node" role="textbox" type="number" min="1" max="100" aria-invalid="false" aria-errormessage="error-msg" />
<div id="error-msg">${errorMessageText}</div>
</form>
`);
const locator = page.locator('#node');
await locator.fill('101'); await locator.fill('101');
await expect(locator).toHaveAccessibleErrorMessage(errorMessageText); await expect(locator).toHaveAccessibleErrorMessage(errorMessageText);
}); });
test('should ignore aria-invalid="false" when HTMLElement.validity.valid is false', async ({ page }) => { test('should not show error message when validity is true and aria-invalid is false', async ({ page }) => {
await page.setContent(` await page.setContent(`
<form> <form>
<input id="node" role="textbox" type="number" min="1" max="100" aria-invalid="false" aria-errormessage="error-msg" /> <input id="node" role="textbox" type="number" min="1" max="100" aria-invalid="false" aria-errormessage="error-msg" />
@ -594,11 +617,10 @@ test.describe('toHaveAccessibleErrorMessage should handle validity state', () =>
const locator = page.locator('#node'); const locator = page.locator('#node');
await locator.fill('99'); await locator.fill('99');
await expect(locator).not.toHaveAccessibleErrorMessage(errorMessageText); await expect(locator).not.toHaveAccessibleErrorMessage(errorMessageText);
await locator.fill('101');
await expect(locator).toHaveAccessibleErrorMessage(errorMessageText);
}); });
}); });
test('toHaveRole', async ({ page }) => { test('toHaveRole', async ({ page }) => {
await page.setContent(`<div role="button">Button!</div>`); await page.setContent(`<div role="button">Button!</div>`);
await expect(page.locator('div')).toHaveRole('button'); await expect(page.locator('div')).toHaveRole('button');