test: update regression tests to align with logic changes
This commit is contained in:
parent
6e7aebee53
commit
cab504b96d
|
|
@ -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';
|
||||
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(`
|
||||
<form>
|
||||
<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');
|
||||
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 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(`
|
||||
<form>
|
||||
<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');
|
||||
await locator.fill('99');
|
||||
await expect(locator).not.toHaveAccessibleErrorMessage(errorMessageText);
|
||||
await locator.fill('101');
|
||||
await expect(locator).toHaveAccessibleErrorMessage(errorMessageText);
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
test('toHaveRole', async ({ page }) => {
|
||||
await page.setContent(`<div role="button">Button!</div>`);
|
||||
await expect(page.locator('div')).toHaveRole('button');
|
||||
|
|
|
|||
Loading…
Reference in a new issue