How to use codegen inside docker container?

[hoangthienan95]

I'm trying to run python -m playwright codegen <webpage> inside the container. My docker file is here. The goal is for the container to open my chrome browser so I can start writing a script.

First I tried the naive way

(/home/ahoang/app/env) ahoang@cb13d93bdb1a:~/app$ python -m playwright codegen https://github.com/
(node:1336) UnhandledPromiseRejectionWarning: browserType.launch: Protocol error (Browser.getVersion): Target closed.
=========================== logs ===========================
<launching> /home/ahoang/.cache/ms-playwright/chromium-815036/chrome-linux/chrome --disable-background-networking --enable-features=NetworkService,NetworkServiceInProcess --disable-background-timer-throttling --disable-backgrounding-occluded-windows --disable-breakpad --disable-client-side-phishing-detection --disable-component-extensions-with-background-pages --disable-default-apps --disable-dev-shm-usage --disable-extensions --disable-features=TranslateUI,BlinkGenPropertyTrees,ImprovedCookieControls,SameSiteByDefaultCookies,LazyFrameLoading --disable-hang-monitor --disable-ipc-flooding-protection --disable-popup-blocking --disable-prompt-on-repost --disable-renderer-backgrounding --disable-sync --force-color-profile=srgb --metrics-recording-only --no-first-run --enable-automation --password-store=basic --use-mock-keychain --user-data-dir=/tmp/playwright_chromiumdev_profile-NREkAj --remote-debugging-pipe --no-sandbox --no-startup-window
<launched> pid=1412
[err] [1412:1412:1103/025657.380007:ERROR:browser_main_loop.cc(1434)] Unable to open X display.
============================================================
Note: use DEBUG=pw:api environment variable and rerun to capture Playwright logs.
    at Connection.sendMessageToServer (/snapshot/playwright-cli/node_modules/playwright/lib/client/connection.js:69:15)
    at Proxy.<anonymous> (/snapshot/playwright-cli/node_modules/playwright/lib/client/channelOwner.js:54:53)
    at /snapshot/playwright-cli/node_modules/playwright/lib/client/browserType.js:62:73
    at BrowserType._wrapApiCall (/snapshot/playwright-cli/node_modules/playwright/lib/client/channelOwner.js:80:34)
    at BrowserType.launch (/snapshot/playwright-cli/node_modules/playwright/lib/client/browserType.js:53:21)
    at launchContext (/snapshot/playwright-cli/lib/cli.js:178:39)
    at open (/snapshot/playwright-cli/lib/cli.js:248:75)
    at codegen (/snapshot/playwright-cli/lib/cli.js:308:12)
    at Command.<anonymous> (/snapshot/playwright-cli/lib/cli.js:78:5)
    at Command.listener [as _actionHandler] (/snapshot/playwright-cli/node_modules/commander/index.js:426:31)
(node:1336) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 2)
(node:1336) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

Then, after reading this article, I tried the following:

(/home/ahoang/app/env) ahoang@cb13d93bdb1a:~/app$ xvfb-run -a --server-args="-screen 0 1280x800x24 -ac -nolisten tcp -dpi 96 +extension RANDR" python -m playwright codegen https://github.com/
from playwright import sync_playwright

def run(playwright):
    browser = playwright.chromium.launch(headless=False)
    context = browser.newContext()

    # Open new page
    page = context.newPage()

    # Go to https://github.com/
    page.goto("https://github.com/")

    # ---------------------
    context.close()
    browser.close()

with sync_playwright() as playwright:
    run(playwright)

I feel like I'm getting very close but still cannot x-forward/connect my macbook machine to the container to open the webpage that was started in the container. Is this even possible?

Sorry I'm new to docker/devops and playwright so might need alot of explanations. Didn't really understand what the xvfb command does and why it's not working...

[mxschmitt]

Hi,
the codegen needs a graphical user interface like on Windows or macOS available. On Linux with xfce, kde e.g. something like that. Also the browser which gets opened, need to be controlled by the user in the end, since it gets recorded what the user is doing.
TL;DR: Codegen needs to be executed on your host system, so you can use it. The other commands like pdf you can run in Docker too.

Let me know if there are more follow-up questions, thanks.

[hoangthienan95]

So no one has been able to open a browser in a docker container and connect/forward that browser opening action to the host system? I'd think this is similar to opening a browser on an ssh server without a GUI and have it forwarded to your local machine.

[dfberry]

I found this but it is for a windows computer (I use.a mac). How to run Playwright codegen in a devcontainer - Solution to 'Unable to open X display' by @jongio - this might be interesting to try SO

[sfwn]

Use Xvfb inside container.
You can use xvfb-run to start playwright codegen, then use x11vnc to start a vnc server, so you can use vnc viewer on your host machine to control it.

[Knight-H]

For anyone with Windows, these are the steps that I did that worked. Somehow it's pretty hard to come across clear instructions how to use everything with minimal effort.

1. Add the environment DISPLAY to use the host computer, but we would need to install the X server (how Linux does GUI) on Windows first.

If you use docker-compose it would look something like this:

services:
  playwright:
    image: mcr.microsoft.com/playwright:v1.52.0-noble
    # existing configuration...
    environment:
      - DISPLAY=host.docker.internal:0

Installing Windows X Server

1. Install VcXsrv
2. Run XLaunch with "Multiple Windows", and "Disable access control" checked
3. Run the playwright command as normal

i.e. docker compose run --rm playwright npx playwright codegen

And the windows should open and be visible.