diff --git a/src/common/QueryHandler.ts b/src/common/QueryHandler.ts index 3009b60b66c59..9f077881d7cbb 100644 --- a/src/common/QueryHandler.ts +++ b/src/common/QueryHandler.ts @@ -125,7 +125,7 @@ const pierceHandler = makeQueryHandler({ if (currentNode instanceof ShadowRoot) { continue; } - if (!found && currentNode.matches(selector)) { + if (currentNode !== root && !found && currentNode.matches(selector)) { found = currentNode; } } while (!found && iter.nextNode()); @@ -149,7 +149,7 @@ const pierceHandler = makeQueryHandler({ if (currentNode instanceof ShadowRoot) { continue; } - if (currentNode.matches(selector)) { + if (currentNode !== root && currentNode.matches(selector)) { result.push(currentNode); } } while (iter.nextNode()); diff --git a/test/queryselector.spec.ts b/test/queryselector.spec.ts index 7a147ddd01792..be05fb3bd6da6 100644 --- a/test/queryselector.spec.ts +++ b/test/queryselector.spec.ts @@ -105,6 +105,26 @@ describe('querySelector', function () { ); expect(text.join(' ')).toBe('Hello World'); }); + it('should find first child element', async () => { + const { page } = getTestState(); + const parentElement = await page.$('html > div'); + const childElement = await parentElement.$('pierce/div'); + const text = await childElement.evaluate( + (element: Element) => element.textContent + ); + expect(text).toBe('Hello'); + }); + it('should find all child elements', async () => { + const { page } = getTestState(); + const parentElement = await page.$('html > div'); + const childElements = await parentElement.$$('pierce/div'); + const text = await Promise.all( + childElements.map((div) => + div.evaluate((element: Element) => element.textContent) + ) + ); + expect(text.join(' ')).toBe('Hello World'); + }); }); // The tests for $$eval are repeated later in this file in the test group 'QueryAll'.