question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Error: Protocol error (Overlay.highlightNode): Could not find object with given id

See original GitHub issue

Sorry for re-post this issue cause the last one was closed and I can not reopen, I have the context:

  • Playwright
const browser = await chromium.launch();
const page = await browser.newPage();
await page.goto('https://amazon.com')
const context = (await page.context()) as ChromiumBrowserContext
const client = await context.newCDPSession(page)
const element = await page.$('h1,h2,h3,p');
const objectId = element['_objectId']
await client.send('Overlay.highlightNode', {
    highlightConfig: {
        showInfo: true,
        borderColor: {
            r: 76,
            g: 175,
            b: 80,
            a: 1
        },
        contentColor: {
            r: 76,
            g: 175,
            b: 80,
            a: 0.24
        },
        shapeColor: {
            r: 76,
            g: 175,
            b: 80,
            a: 0.24
        },
    },
    objectId,
})

the objectId has value {"injectedScriptId":3,"id":1} but I got the error: Error: Protocol error (Overlay.highlightNode): Could not find object with given id.

I can do this action on Puppeteer as the following:

  const browser = await puppeteer.launch({headless: false});
  const page = await browser.newPage();
  await page.goto('https://amazon.com')
  const element = await page.$('h1,h2,h3,p');
  const client = element['_client']
  const objectId = element['_remoteObject']['objectId']
  await client.send('Overlay.highlightNode', {
    highlightConfig: {
        showInfo: true,
        borderColor: {
            r: 76,
            g: 175,
            b: 80,
            a: 1
        },
        contentColor: {
            r: 76,
            g: 175,
            b: 80,
            a: 0.24
        },
        shapeColor: {
            r: 76,
            g: 175,
            b: 80,
            a: 0.24
        },
    },
    objectId,
})

So I’m not sure how to do this on playwright?

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Comments:5 (3 by maintainers)

github_iconTop GitHub Comments

1reaction
pavelfeldmancommented, Jun 28, 2020

In Puppeteer, you were reaching out to a private property to get a hold of the session that Puppeteer itself used. You can do the same in Playwright, it is just harder to find and abuse it here.

But I would encourage you to think in the browser-neutral way since that’s what we want for Playwright in the end of the day and request a feature where you can trigger inspector (or any other) highlight. Something like handle.inspect() that would highlight and reveal in devtools if those are opened. Would that work for you?

0reactions
aslushnikovcommented, Aug 21, 2020
Read more comments on GitHub >

github_iconTop Results From Across the Web

Protocol error (Overlay.highlightNode): Could not find object ...
I have the context: const browser = await chromium.launch(); const page = await browser.newPage(); await page.goto('https://amazon.com') ...
Read more >
Highlight current DOM element in Chrome Extension using ...
The command is likely DOM. highlightNode - to see the exact syntax try "Listening to the protocol" as described in the documentation.
Read more >
third_party/blink/public/devtools_protocol/browser_protocol.pdl
JavaScript object id of the node wrapper to get the partial accessibility ... is specified, or the DOM node does not exist, the...
Read more >
Overlay domain - Chrome DevTools Protocol - GitHub Pages
Overlay.highlightNode #. Highlights DOM node with given id or with the given JavaScript object wrapper. Either nodeId or objectId must be specified.
Read more >
cdp - Go Packages - The Go Programming Language
Package cdp provides type-safe bindings for the Chrome DevTools Protocol (CDP) and can be used with any debug target that implements it.
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found