fix(selectors): :scope combined with other css should work (#18324)

Previously, we considered root when selector has `:scope` modifier, but
did not actually match it with other css specifiers, like in
`:scope.selected`.

Fixes #17824.
This commit is contained in:
Dmitry Gozman 2022-10-25 14:31:39 -07:00 committed by GitHub
parent 721ae2b3ed
commit 0653692a5b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 1 additions and 2 deletions

View File

@ -206,7 +206,7 @@ export class SelectorEvaluatorImpl implements SelectorEvaluator {
if (css !== undefined) {
elements = this._queryCSS(context, css);
const hasScopeClause = funcs.some(f => f.name === 'scope');
if (hasScopeClause && context.scope.nodeType === 1 /* Node.ELEMENT_NODE */)
if (hasScopeClause && context.scope.nodeType === 1 /* Node.ELEMENT_NODE */ && this._matchesCSS(context.scope as Element, css))
elements.unshift(context.scope as Element);
} else {
firstIndex = funcs.findIndex(func => this._getEngine(func.name).query !== undefined);

View File

@ -394,7 +394,6 @@ it('should work with :scope', async ({ page, server }) => {
it('should work with :scope and class', async ({ page }) => {
it.info().annotations.push({ type: 'issue', description: 'https://github.com/microsoft/playwright/issues/17824' });
it.fixme();
await page.setContent(`<div class="apple"></div>
<div class="apple selected"></div>`);
const apples = page.locator('.apple');