Skip to content

Commit b6ee1fd

Browse files
oleshoolesho
authored
Local setup containing Chromium (Neko) + Custom Devtools (#3)
## Pull Request Overview This PR establishes a local development setup for kernel-browser combining Chromium (Neko) with custom DevTools integration. The setup extends the existing kernel-images infrastructure to include a custom DevTools frontend served via nginx. - Adds local development workflow with Docker Compose and direct script execution options - Integrates custom DevTools frontend built from browser-operator-core fork - Provides comprehensive build and deployment automation through Makefile
1 parent 8ce9395 commit b6ee1fd

File tree

5 files changed

+590
-0
lines changed

5 files changed

+590
-0
lines changed

‎Dockerfile.local‎

Lines changed: 267 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,267 @@
1+
# Extended Dockerfile combining kernel-images with DevTools frontend
2+
# This extends the kernel-images base with Browser Operator DevTools static files
3+
4+
# DevTools Frontend build stage using browser-operator-core
5+
FROM --platform=linux/amd64 ubuntu:22.04 AS devtools-builder
6+
7+
# Install required packages for DevTools frontend build
8+
RUN apt-get update && apt-get install -y \
9+
curl \
10+
git \
11+
python3 \
12+
python3-pip \
13+
python-is-python3 \
14+
wget \
15+
unzip \
16+
sudo \
17+
ca-certificates \
18+
build-essential \
19+
&& rm -rf /var/lib/apt/lists/*
20+
21+
# Install Node.js 18.x
22+
RUN curl -fsSL https://deb.nodesource.com/setup_18.x | bash - && \
23+
apt-get install -y nodejs && \
24+
rm -rf /var/lib/apt/lists/*
25+
26+
WORKDIR /workspace
27+
28+
# Clone depot_tools
29+
RUN git clone https://chromium.googlesource.com/chromium/tools/depot_tools.git
30+
ENV PATH="/workspace/depot_tools:${PATH}"
31+
ENV DEPOT_TOOLS_UPDATE=0
32+
33+
# Follow README instructions exactly - fetching code
34+
RUN mkdir devtools
35+
WORKDIR /workspace/devtools
36+
RUN fetch devtools-frontend
37+
38+
# Build steps
39+
WORKDIR /workspace/devtools/devtools-frontend
40+
41+
RUN gclient sync
42+
RUN /workspace/depot_tools/ensure_bootstrap
43+
44+
# Build standard DevTools first
45+
RUN npm run build
46+
47+
# Add Browser Operator fork and switch to it
48+
RUN git remote add upstream https://github.com/BrowserOperator/browser-operator-core.git
49+
RUN git fetch upstream
50+
RUN git checkout upstream/main
51+
52+
# Build Browser Operator version
53+
RUN npm run build
54+
55+
# ============================================================================
56+
# Use kernel-images base with DevTools integration
57+
# ============================================================================
58+
FROM docker.io/golang:1.25.0 AS server-builder
59+
WORKDIR /workspace/server
60+
61+
ARG TARGETOS
62+
ARG TARGETARCH
63+
ENV CGO_ENABLED=0
64+
65+
COPY kernel-images/server/go.mod ./
66+
COPY kernel-images/server/go.sum ./
67+
RUN go mod download
68+
69+
COPY kernel-images/server/ .
70+
RUN GOOS=${TARGETOS:-linux} GOARCH=${TARGETARCH:-amd64} \
71+
go build -ldflags="-s -w" -o /out/kernel-images-api ./cmd/api
72+
73+
# webrtc client
74+
FROM node:22-bullseye-slim AS client
75+
WORKDIR /src
76+
COPY kernel-images/images/chromium-headful/client/package*.json ./
77+
RUN npm install
78+
COPY kernel-images/images/chromium-headful/client/ .
79+
RUN npm run build
80+
81+
# xorg dependencies
82+
FROM docker.io/ubuntu:22.04 AS xorg-deps
83+
WORKDIR /xorg
84+
ENV DEBIAN_FRONTEND=noninteractive
85+
RUN set -eux; \
86+
apt-get update; \
87+
apt-get install -y \
88+
git gcc pkgconf autoconf automake libtool make xorg-dev xutils-dev \
89+
&& rm -rf /var/lib/apt/lists/*;
90+
COPY kernel-images/images/chromium-headful/xorg-deps/ /xorg/
91+
# build xf86-video-dummy v0.3.8 with RandR support
92+
RUN set -eux; \
93+
cd xf86-video-dummy/v0.3.8; \
94+
patch -p1 < ../01_v0.3.8_xdummy-randr.patch; \
95+
autoreconf -v --install; \
96+
./configure; \
97+
make -j$(nproc); \
98+
make install;
99+
# build custom input driver
100+
RUN set -eux; \
101+
cd xf86-input-neko; \
102+
./autogen.sh --prefix=/usr; \
103+
./configure; \
104+
make -j$(nproc); \
105+
make install;
106+
107+
FROM ghcr.io/onkernel/neko/base:3.0.6-v1.0.1 AS neko
108+
# ^--- now has event.SYSTEM_PONG with legacy support to keepalive
109+
110+
# Final stage: kernel-images base + DevTools static files
111+
FROM docker.io/ubuntu:22.04
112+
113+
ENV DEBIAN_FRONTEND=noninteractive
114+
ENV DEBIAN_PRIORITY=high
115+
116+
RUN apt-get update && \
117+
apt-get -y upgrade && \
118+
apt-get -y install \
119+
# UI Requirements
120+
xvfb \
121+
xterm \
122+
xdotool \
123+
scrot \
124+
imagemagick \
125+
sudo \
126+
mutter \
127+
# Python/pyenv reqs
128+
build-essential \
129+
libssl-dev \
130+
zlib1g-dev \
131+
libbz2-dev \
132+
libreadline-dev \
133+
libsqlite3-dev \
134+
curl \
135+
git \
136+
libncursesw5-dev \
137+
xz-utils \
138+
tk-dev \
139+
libxml2-dev \
140+
libxmlsec1-dev \
141+
libffi-dev \
142+
liblzma-dev \
143+
# Network tools
144+
net-tools \
145+
netcat \
146+
# PPA req
147+
software-properties-common \
148+
# Add nginx for DevTools serving
149+
nginx \
150+
# Userland apps
151+
&& apt-get install -y --no-install-recommends \
152+
libreoffice \
153+
x11-apps \
154+
xpdf \
155+
gedit \
156+
xpaint \
157+
tint2 \
158+
galculator \
159+
pcmanfm \
160+
wget \
161+
xdg-utils \
162+
libvulkan1 \
163+
fonts-liberation \
164+
unzip && \
165+
apt-get clean
166+
167+
# install ffmpeg manually since the version available in apt is from the 4.x branch due to #drama.
168+
# as of writing these static builds will be the latest 7.0.x release.
169+
RUN set -eux; \
170+
URL="https://johnvansickle.com/ffmpeg/releases/ffmpeg-release-amd64-static.tar.xz"; \
171+
echo "Downloading FFmpeg static build from $URL"; \
172+
curl -fsSL "$URL" -o /tmp/ffmpeg.tar.xz; \
173+
tar -xJf /tmp/ffmpeg.tar.xz -C /tmp; \
174+
install -m755 /tmp/ffmpeg-*/ffmpeg /usr/local/bin/ffmpeg; \
175+
install -m755 /tmp/ffmpeg-*/ffprobe /usr/local/bin/ffprobe; \
176+
rm -rf /tmp/ffmpeg*
177+
178+
# runtime
179+
ENV USERNAME=root
180+
RUN set -eux; \
181+
apt-get update; \
182+
apt-get install -y --no-install-recommends \
183+
wget ca-certificates python2 supervisor xclip xdotool \
184+
pulseaudio dbus-x11 xserver-xorg-video-dummy \
185+
libcairo2 libxcb1 libxrandr2 libxv1 libopus0 libvpx7 \
186+
gstreamer1.0-plugins-base gstreamer1.0-plugins-good \
187+
gstreamer1.0-plugins-bad gstreamer1.0-plugins-ugly \
188+
gstreamer1.0-pulseaudio gstreamer1.0-omx; \
189+
#
190+
# install libxcvt0 (not available in debian:bullseye)
191+
ARCH=$(dpkg --print-architecture); \
192+
wget http://ftp.de.debian.org/debian/pool/main/libx/libxcvt/libxcvt0_0.1.2-1_${ARCH}.deb; \
193+
apt-get install --no-install-recommends ./libxcvt0_0.1.2-1_${ARCH}.deb; \
194+
rm ./libxcvt0_0.1.2-1_${ARCH}.deb; \
195+
#
196+
# workaround for an X11 problem: http://blog.tigerteufel.de/?p=476
197+
mkdir /tmp/.X11-unix; \
198+
chmod 1777 /tmp/.X11-unix; \
199+
chown $USERNAME /tmp/.X11-unix/; \
200+
#
201+
# make directories for neko
202+
mkdir -p /etc/neko /var/www /var/log/neko \
203+
/tmp/runtime-$USERNAME \
204+
/home/$USERNAME/.config/pulse \
205+
/home/$USERNAME/.local/share/xorg; \
206+
chmod 1777 /var/log/neko; \
207+
chown $USERNAME /var/log/neko/ /tmp/runtime-$USERNAME; \
208+
chown -R $USERNAME:$USERNAME /home/$USERNAME; \
209+
# clean up
210+
apt-get clean -y; \
211+
rm -rf /var/lib/apt/lists/* /var/cache/apt/
212+
213+
# install chromium and sqlite3 for debugging the cookies file
214+
RUN add-apt-repository -y ppa:xtradeb/apps
215+
RUN apt update -y && apt install -y chromium sqlite3
216+
217+
# setup desktop env & app
218+
ENV DISPLAY_NUM=1
219+
ENV HEIGHT=768
220+
ENV WIDTH=1024
221+
ENV WITHDOCKER=true
222+
223+
# Copy kernel-images configuration and binaries
224+
COPY kernel-images/images/chromium-headful/xorg.conf /etc/neko/xorg.conf
225+
COPY kernel-images/images/chromium-headful/neko.yaml /etc/neko/neko.yaml
226+
COPY --from=neko /usr/bin/neko /usr/bin/neko
227+
COPY --from=client /src/dist/ /var/www
228+
COPY --from=xorg-deps /usr/local/lib/xorg/modules/drivers/dummy_drv.so /usr/lib/xorg/modules/drivers/dummy_drv.so
229+
COPY --from=xorg-deps /usr/local/lib/xorg/modules/input/neko_drv.so /usr/lib/xorg/modules/input/neko_drv.so
230+
231+
COPY kernel-images/images/chromium-headful/image-chromium/ /
232+
COPY kernel-images/images/chromium-headful/start-chromium.sh /images/chromium-headful/start-chromium.sh
233+
RUN chmod +x /images/chromium-headful/start-chromium.sh
234+
COPY kernel-images/images/chromium-headful/wrapper.sh /wrapper.sh
235+
COPY kernel-images/images/chromium-headful/supervisord.conf /etc/supervisor/supervisord.conf
236+
COPY kernel-images/images/chromium-headful/supervisor/services/ /etc/supervisor/conf.d/services/
237+
238+
# copy the kernel-images API binary built in the builder stage
239+
COPY --from=server-builder /out/kernel-images-api /usr/local/bin/kernel-images-api
240+
241+
# ============================================================================
242+
# DevTools Integration
243+
# ============================================================================
244+
245+
# Copy DevTools static files from builder
246+
COPY --from=devtools-builder /workspace/devtools/devtools-frontend/out/Default/gen/front_end /usr/share/nginx/devtools
247+
248+
# Create DevTools nginx configuration
249+
COPY nginx-devtools.conf /etc/nginx/sites-available/devtools
250+
RUN ln -s /etc/nginx/sites-available/devtools /etc/nginx/sites-enabled/devtools && \
251+
rm /etc/nginx/sites-enabled/default
252+
253+
# Add DevTools nginx service to supervisor
254+
COPY supervisor/services/nginx-devtools.conf /etc/supervisor/conf.d/services/nginx-devtools.conf
255+
256+
# Create nginx temp directories and set permissions
257+
RUN mkdir -p /var/lib/nginx/body \
258+
/var/lib/nginx/proxy \
259+
/var/lib/nginx/fastcgi \
260+
/var/lib/nginx/uwsgi \
261+
/var/lib/nginx/scgi && \
262+
chown -R www-data:www-data /var/lib/nginx && \
263+
chown -R www-data:www-data /usr/share/nginx/devtools
264+
265+
RUN useradd -m -s /bin/bash kernel
266+
267+
ENTRYPOINT [ "/wrapper.sh" ]

‎Makefile‎

Lines changed: 115 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,115 @@
1+
# Makefile for kernel-browser local development
2+
# Using kernel-images native build system
3+
4+
.PHONY: help build run stop logs clean dev status shell test
5+
6+
# Default target
7+
help: ## Show this help message
8+
@echo "Kernel Browser - Local Development (using kernel-images build system)"
9+
@echo "=================================================================="
10+
@echo ""
11+
@echo "Available commands:"
12+
@grep -E '^[a-zA-Z_-]+:.*?## .*$$' $(MAKEFILE_LIST) | awk 'BEGIN {FS = ":.*?## "}; {printf " %-15s %s\n", $$1, $$2}'
13+
14+
init: ## Initialize submodules (run this first)
15+
git submodule update --init --recursive
16+
@echo "✅ Submodules initialized"
17+
18+
build: init ## Build extended image with DevTools frontend
19+
@echo "🔨 Building extended kernel-browser with DevTools frontend..."
20+
docker build -f Dockerfile.local -t kernel-browser:extended .
21+
@echo "✅ Extended build complete"
22+
23+
run: ## Run extended container with DevTools (interactive)
24+
@echo "🚀 Starting extended kernel-browser with DevTools..."
25+
./run-local.sh
26+
27+
compose-up: build ## Start with docker-compose (background)
28+
@echo "🚀 Starting with docker-compose..."
29+
docker-compose up -d
30+
@$(MAKE) --no-print-directory info
31+
@echo ""
32+
@echo "📊 View logs with: make logs"
33+
34+
compose-dev: build ## Start with docker-compose (foreground with logs)
35+
@echo "🚀 Starting with docker-compose in development mode..."
36+
docker-compose up
37+
38+
dev: compose-dev ## Alias for compose-dev
39+
40+
stop: ## Stop all containers
41+
@echo "🛑 Stopping containers..."
42+
docker-compose down
43+
docker stop kernel-browser-extended 2>/dev/null || true
44+
docker rm kernel-browser-extended 2>/dev/null || true
45+
@echo "✅ Containers stopped"
46+
47+
restart: ## Restart containers
48+
@$(MAKE) --no-print-directory stop
49+
@$(MAKE) --no-print-directory compose-up
50+
51+
logs: ## Show container logs
52+
docker-compose logs -f kernel-browser || docker logs -f kernel-browser-extended
53+
54+
status: ## Show container status
55+
@echo "Docker Compose Status:"
56+
@docker-compose ps || true
57+
@echo ""
58+
@echo "Direct Container Status:"
59+
@docker ps --filter name=kernel-browser
60+
61+
shell: ## Get shell access to running container
62+
docker exec -it kernel-browser-extended bash || docker-compose exec kernel-browser bash
63+
64+
info: ## Show connection information
65+
@echo ""
66+
@echo "🌐 Service Access Points:"
67+
@echo " WebRTC Client: http://localhost:8080"
68+
@echo " Chrome DevTools: http://localhost:9222/json"
69+
@echo " Recording API: http://localhost:444/api"
70+
@echo " Enhanced DevTools UI: http://localhost:8001"
71+
@echo " DevTools Health: http://localhost:8001/health"
72+
73+
test: ## Test service endpoints
74+
@echo "🧪 Testing service endpoints..."
75+
@echo -n "WebRTC Client (8080): "
76+
@curl -s -o /dev/null -w "%{http_code}" http://localhost:8080/ || echo "Failed to connect"
77+
@echo ""
78+
@echo -n "Chrome DevTools (9222): "
79+
@curl -s -o /dev/null -w "%{http_code}" http://localhost:9222/json/version || echo "Failed to connect"
80+
@echo ""
81+
@echo -n "Recording API (444): "
82+
@curl -s -o /dev/null -w "%{http_code}" http://localhost:444/ && echo " (404 is normal - API is running)" || echo "Failed to connect"
83+
@echo ""
84+
@echo -n "DevTools UI (8001): "
85+
@curl -s -o /dev/null -w "%{http_code}" http://localhost:8001/ || echo "Failed to connect"
86+
@echo ""
87+
@echo -n "DevTools Health (8001): "
88+
@curl -s -o /dev/null -w "%{http_code}" http://localhost:8001/health || echo "Failed to connect"
89+
@echo ""
90+
@echo "🎯 All services are ready! Access points:"
91+
@echo " WebRTC Client: http://localhost:8080"
92+
@echo " Chrome DevTools: http://localhost:9222/json"
93+
@echo " Enhanced DevTools UI: http://localhost:8001"
94+
95+
clean: stop ## Clean up everything
96+
@echo "🧹 Cleaning up..."
97+
docker-compose down -v 2>/dev/null || true
98+
docker rmi kernel-browser:extended 2>/dev/null || true
99+
docker system prune -f
100+
rm -rf recordings/* 2>/dev/null || true
101+
rm -rf kernel-images/images/chromium-headful/.tmp 2>/dev/null || true
102+
@echo "✅ Cleanup complete"
103+
104+
# Alternative commands for different approaches
105+
native-build: init ## Build using kernel-images native script directly
106+
cd kernel-images/images/chromium-headful && \
107+
UKC_TOKEN=dummy-token UKC_METRO=dummy-metro IMAGE=kernel-browser:local ./build-docker.sh
108+
109+
native-run: ## Run using kernel-images native script directly
110+
cd kernel-images/images/chromium-headful && \
111+
UKC_TOKEN=dummy-token UKC_METRO=dummy-metro IMAGE=kernel-browser:local NAME=kernel-browser-local ENABLE_WEBRTC=true ./run-docker.sh
112+
113+
# Quick development workflow
114+
quick: init build compose-up test ## Quick setup: init + build + run + test
115+

0 commit comments

Comments
 (0)