0

I've got a pretty elaborate end-to-end test suite driven by Jest and Puppeteer.

Puppeteer can be started Chrome in headless or headful mode:

puppeteer.launch({ headless: false });

I've dockerized the app and the test suite. It's running perfectly in headless mode, but I've lost the ability to run it in headful mode: my headful Chrome is on the Windows host, and my Puppeteer is in Docker in WSL, where a headless Chrome is installed.

How do I use host OS Chrome in headful mode when running Puppeteer tests in Docker?

In a different project, I've had a test suite start a dev server, offer an URL. I could open that URL in the host OS Chrome, and tests would run there. But Puppeteer seems more elaborate than that.

PS Homework

  • This SO question links to this article that suggests starting a window manager inside the Docker container and connecting to it remotely in a VNC fashion. I don't like that, I want to use the actual Chrome app in my host OS (or any browser, for that matter).
  • Another SO question, answer suggests the same approach, and here are VNC instructions.
Andrey Mikhaylov - lolmaus
  • 23,107
  • 6
  • 84
  • 133

1 Answers1

0

The solution is really simple.

Remote debugging

  1. Add the "--remote-debugging-port=9222" to {args: []} that you pass into puppeteer.launch().
  2. Launch.
  3. Open chrome://inspect in Chrome on your host OS and wait for an entry to appear.
  4. Use the Inspect button/link.

You'll see a normal Chrome window with devtools and a page, except the page will be rendered in VNC style (remote desktop style): the viewport will be sized according to Puppeteer settings and scaled to fit your screen.

Andrey Mikhaylov - lolmaus
  • 23,107
  • 6
  • 84
  • 133
  • This solution is available [since 2011](https://blog.chromium.org/2011/05/remote-debugging-with-chrome-developer.html). I can't believe that some developers are still using VNC to access Chrome windows in Docker. – Andrey Mikhaylov - lolmaus Aug 26 '22 at 09:02