chrome-devtools-frontend

Self-hosted Chrome DevTools frontend as a Docker image. Lets you open a CDP (Chrome DevTools Protocol) session in your browser without using the devtools:// protocol — useful for remote or private browser sessions.

Usage

Pull and run

docker pull ghcr.io/v1k45/chrome-devtools-frontend:latest
docker run -p 8080:80 ghcr.io/v1k45/chrome-devtools-frontend:latest

Then open:

http://localhost:8080/inspector.html?wss=<your-cdp-host>

Get the CDP WebSocket URL

curl http://localhost:9222/json | grep devtoolsFrontendUrl

Take the ws=... part and use it as the wss= param:

http://localhost:8080/inspector.html?wss=localhost:9222/devtools/page/ABC123

---

Using the built frontend in your own Docker image

If you don't want to run a separate nginx container, you can copy the pre-built frontend files directly into your own image using a multi-stage build:

FROM ghcr.io/v1k45/chrome-devtools-frontend:latest AS devtools

FROM your-app-image

# Copy the static frontend files into your app
COPY --from=devtools /usr/share/nginx/html /app/public/devtools

# Then serve /app/public/devtools statically from your own server

Or serve it with a minimal nginx alongside your app:

FROM ghcr.io/v1k45/chrome-devtools-frontend:latest AS devtools

FROM nginx:alpine

# Your app's static files
COPY ./dist /usr/share/nginx/html

# DevTools frontend under /devtools path
COPY --from=devtools /usr/share/nginx/html /usr/share/nginx/html/devtools

Then access via http://localhost/devtools/inspector.html?wss=...

---

Build locally

# Latest (chromium/7701)
docker build --platform linux/amd64 -t chrome-devtools-frontend .

# Specific version
docker build --platform linux/amd64 \
  --build-arg DEVTOOLS_VERSION=chromium/7701 \
  -t chrome-devtools-frontend:7701 .

To find available versions:

git ls-remote --heads https://chromium.googlesource.com/devtools/devtools-frontend.git | grep chromium/

Match the version to your Chrome install via chrome://version.

---

Push to GitHub Container Registry

echo $GITHUB_TOKEN | docker login ghcr.io -u <your-username> --password-stdin
docker tag chrome-devtools-frontend ghcr.io/<your-username>/chrome-devtools-frontend:latest
docker push ghcr.io/<your-username>/chrome-devtools-frontend:latest

---

GitHub Actions

The included workflow at .github/workflows/docker.yml automatically builds and publishes the image to GHCR on every push to main, tagged as both 7701 and latest.

You can also trigger a manual build for a different version via Actions → Run workflow and entering a branch like chromium/7801.

Make sure your repo has packages: write permission enabled under Settings → Actions → General → Workflow permissions.