microsoft/playwright
1
1
Fork 0
mirror of https://github.com/microsoft/playwright.git synced 2024-12-01 08:34:02 +03:00
Code Issues Projects Releases Wiki Activity

fix(strict): escape css class names when generating selectors (#14810)

Browse Source
This commit is contained in:
Pavel Feldman 2022-06-12 08:39:30 -08:00 committed by GitHub
parent 76abb3a5be
commit c7b3f4646f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 23 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/playwright-core/src/server/injected/selectorGenerator.ts
View File

@ -260,7 +260,7 @@ function cssFallback(injectedScript: InjectedScript, targetElement: Element, str
// Combine class names until unique.
const classes = [...element.classList];
for (let i = 0; i < classes.length; ++i) {
const token = '.' + classes.slice(0, i + 1).join('.');
const token = '.' + cssEscape(classes.slice(0, i + 1).join('.'));
const selector = uniqueCSSSelector(token);
if (selector)
return makeStrict(selector);

22
tests/page/page-strict.spec.ts
View File

@ -83,3 +83,25 @@ it('should properly format :nth-child() in strict mode message', async ({ page }
// if '>' were ' '.
expect(error.message).toContain('body > div:nth-child(2) > div:nth-child(2)');
});
it('should escape class names', async ({ page }) => {
await page.setContent(`
<div>
<div></div>
<div>
<div></div>
<div></div>
</div>
</div>
<div>
<div class='foo bar:0'>
</div>
<div class='foo bar:1'>
</div>
</div>
`);
const error = await page.locator('.foo').hover().catch(e => e);
expect(error.message).toContain('strict mode violation');
expect(error.message).toContain('<div class=\"foo bar:0');
expect(error.message).toContain('<div class=\"foo bar:1');
});