Error: Query set to use "shadow", but no query handler of that name was found

[vipin705]

hi @Georgegriff ,

i am trying to use this selector but i am seeing the below error

Query set to use "shadow", but no query handler of that name was found

here is my code

import * as puppeteer from 'puppeteer';
import { Given, Then, When } from 'cucumber';
import { join } from 'path';

let browser: puppeteer.Browser, page: puppeteer.Page;

Given('I load time off component', { timeout: 2 * 5000 }, async () => {
browser = await puppeteer.launch({
headless: false,
defaultViewport: null,
args: ['--start-maximized']
});
page = await browser.newPage();
const response = await page.goto(http://localhost:5000/#/time_dashboard);
await page.addScriptTag({
path: join(
'node_modules/query-selector-shadow-dom/dist/querySelectorShadowDom.js'
)
});
page.waitForNavigation();
await page.waitForSelector('shadow/.size-sm.contained.standard.secondary');
const btn = await page.$('shadow/.size-sm.contained.standard.secondary');
await btn.click();
return response;
});

[Georgegriff]

Thanks for the separate issue, it looks like you arent using the library as epxected...

But!

I see you are using puppeteer which means you dont need this library at all anymore

I believe the selector is pierce not shadow for them so

await page.waitForSelector('pierce/.size-sm.contained.standard.secondary');
const btn = await page.$('pierce/.size-sm.contained.standard.secondary');

You dont need this bit at all

await page.addScriptTag({
path: join(
'node_modules/query-selector-shadow-dom/dist/querySelectorShadowDom.js'
)
});

[vipin705]

i tried using that but now i landed on this error.

Error: Node is either not visible or not an HTMLElement
at ElementHandle._clickablePoint (node_modules/puppeteer/lib/cjs/puppeteer/common/JSHandle.js:329:19)
at processTicksAndRejections (internal/process/task_queues.js:93:5)
at ElementHandle.click (node_modules/puppeteer/lib/cjs/puppeteer/common/JSHandle.js:390:26)

[Georgegriff]

In that case you can try the query handler but in the example you gave you're not using the puppeteer plugin

Please follow the example

https://github.com/Georgegriff/query-selector-shadow-dom/blob/main/examples/puppeteer/clicking-elements.js