Skip to content

Commit dbe8a5f

Browse files
roomoteroomote
committed
feat: add automatic Chrome dependency installation and Docker browser support for Codespaces
- Implement automatic detection and installation of Chrome dependencies - Add optional Docker-based browser isolation with configurable settings - Create comprehensive devcontainer configuration for GitHub Codespaces - Add environment detection for Codespaces, containers, and Linux systems - Implement fallback mechanisms: system Chrome -> Docker -> downloaded Chrome - Add new VS Code settings for Docker browser configuration - Include post-create and post-start scripts for Codespaces setup - Add comprehensive tests for browser environment functionality Fixes #7990
1 parent 9d33c10 commit dbe8a5f

File tree

11 files changed

+1263
-12
lines changed

11 files changed

+1263
-12
lines changed

‎.devcontainer/README.md‎

Lines changed: 133 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,133 @@
1+
# Roo Code GitHub Codespaces Configuration
2+
3+
This directory contains the configuration for running Roo Code in GitHub Codespaces, providing a fully configured development environment with automatic Chrome/Puppeteer dependency installation.
4+
5+
## Features
6+
7+
### Automatic Dependency Installation
8+
9+
- **Chrome Browser**: Google Chrome Stable is automatically installed with all required dependencies
10+
- **Docker Support**: Docker-in-Docker feature enables containerized browser option
11+
- **Node.js Environment**: Pre-configured TypeScript/Node.js development container
12+
- **VS Code Extensions**: Essential extensions are pre-installed
13+
14+
### Browser Tool Support
15+
16+
The configuration ensures the browser tool works seamlessly in Codespaces by:
17+
18+
1. **Automatic Chrome Installation**: Chrome and all its dependencies are installed during container creation
19+
2. **Dependency Detection**: The extension automatically detects and installs missing dependencies
20+
3. **Docker Fallback**: If Chrome fails, Docker browser container can be used as fallback
21+
4. **Environment Variables**: Proper configuration for Puppeteer to use system Chrome
22+
23+
## Configuration Options
24+
25+
### Docker Browser (Optional)
26+
27+
You can enable Docker-based browser isolation in VS Code settings:
28+
29+
```json
30+
{
31+
"roo-cline.browserDocker.enabled": true,
32+
"roo-cline.browserDocker.image": "browserless/chrome:latest",
33+
"roo-cline.browserDocker.autoStart": true
34+
}
35+
```
36+
37+
### Benefits of Docker Browser
38+
39+
- **Isolation**: Browser runs in a separate container
40+
- **Consistency**: Same browser environment across all systems
41+
- **No Dependencies**: No need to install Chrome dependencies on host
42+
- **Security**: Enhanced security through containerization
43+
44+
## Troubleshooting
45+
46+
### Browser Tool Not Working?
47+
48+
1. **Check Chrome Installation**:
49+
50+
```bash
51+
google-chrome --version
52+
# or
53+
google-chrome-stable --version
54+
```
55+
56+
2. **Test Chrome Headless**:
57+
58+
```bash
59+
google-chrome --headless --no-sandbox --disable-gpu --dump-dom https://example.com
60+
```
61+
62+
3. **Check Missing Dependencies**:
63+
64+
```bash
65+
ldd $(which google-chrome) | grep "not found"
66+
```
67+
68+
4. **Install Missing Dependencies Manually**:
69+
70+
```bash
71+
sudo apt-get update
72+
sudo apt-get install -y \
73+
libatk1.0-0 libatk-bridge2.0-0 libcups2 libdrm2 \
74+
libxkbcommon0 libxcomposite1 libxdamage1 libxfixes3 \
75+
libxrandr2 libgbm1 libasound2
76+
```
77+
78+
5. **Use Docker Browser as Fallback**:
79+
- Enable Docker browser in settings (see Configuration Options above)
80+
- Ensure Docker is running: `docker info`
81+
- The extension will automatically use Docker if Chrome fails
82+
83+
### Docker Issues?
84+
85+
1. **Check Docker Status**:
86+
87+
```bash
88+
docker info
89+
```
90+
91+
2. **Pull Browser Image Manually**:
92+
93+
```bash
94+
docker pull browserless/chrome:latest
95+
```
96+
97+
3. **Test Docker Browser**:
98+
```bash
99+
docker run -d --name test-browser -p 3000:3000 browserless/chrome:latest
100+
# Visit http://localhost:3000 to verify
101+
docker stop test-browser && docker rm test-browser
102+
```
103+
104+
## Files in This Directory
105+
106+
- **devcontainer.json**: Main configuration file for the dev container
107+
- **post-create.sh**: Script that runs after container creation (installs dependencies)
108+
- **post-start.sh**: Script that runs each time the container starts (verifies setup)
109+
- **README.md**: This documentation file
110+
111+
## How It Works
112+
113+
1. **Container Creation**: When you create a Codespace, it uses the TypeScript/Node.js base image
114+
2. **Feature Installation**: Docker-in-Docker and Chrome features are installed
115+
3. **Post-Create Script**: Installs Chrome dependencies and builds the project
116+
4. **Post-Start Script**: Verifies the environment on each container start
117+
5. **Automatic Detection**: The extension detects the Codespace environment and adapts accordingly
118+
119+
## Environment Variables
120+
121+
The following environment variables are set automatically:
122+
123+
- `CODESPACES=true`: Indicates running in GitHub Codespaces
124+
- `PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=true`: Prevents Puppeteer from downloading Chromium
125+
- `PUPPETEER_EXECUTABLE_PATH=/usr/bin/google-chrome-stable`: Points Puppeteer to system Chrome
126+
127+
## Support
128+
129+
If you encounter issues with the browser tool in Codespaces:
130+
131+
1. Check the troubleshooting section above
132+
2. Review the post-start script output for warnings
133+
3. Report issues at: https://github.com/RooCodeInc/Roo-Code/issues

‎.devcontainer/devcontainer.json‎

Lines changed: 70 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,70 @@
1+
{
2+
"name": "Roo Code Development",
3+
"image": "mcr.microsoft.com/devcontainers/typescript-node:20",
4+
5+
// Features to add to the dev container
6+
"features": {
7+
"ghcr.io/devcontainers/features/docker-in-docker:2": {},
8+
"ghcr.io/devcontainers/features/github-cli:1": {},
9+
"ghcr.io/devcontainers/features/chrome:1": {
10+
"version": "stable"
11+
}
12+
},
13+
14+
// Configure tool-specific properties
15+
"customizations": {
16+
"vscode": {
17+
"extensions": [
18+
"dbaeumer.vscode-eslint",
19+
"esbenp.prettier-vscode",
20+
"ms-vscode.vscode-typescript-next",
21+
"RooVeterinaryInc.roo-cline"
22+
],
23+
"settings": {
24+
"terminal.integrated.defaultProfile.linux": "bash",
25+
"typescript.tsdk": "node_modules/typescript/lib",
26+
"eslint.validate": ["javascript", "javascriptreact", "typescript", "typescriptreact"],
27+
"editor.formatOnSave": true,
28+
"editor.defaultFormatter": "esbenp.prettier-vscode",
29+
"[typescript]": {
30+
"editor.defaultFormatter": "esbenp.prettier-vscode"
31+
},
32+
"[javascript]": {
33+
"editor.defaultFormatter": "esbenp.prettier-vscode"
34+
},
35+
"[json]": {
36+
"editor.defaultFormatter": "esbenp.prettier-vscode"
37+
}
38+
}
39+
}
40+
},
41+
42+
// Use 'forwardPorts' to make a list of ports inside the container available locally
43+
"forwardPorts": [3000, 9222],
44+
45+
// Use 'postCreateCommand' to run commands after the container is created
46+
"postCreateCommand": "bash .devcontainer/post-create.sh",
47+
48+
// Use 'postStartCommand' to run commands after the container starts
49+
"postStartCommand": "bash .devcontainer/post-start.sh",
50+
51+
// Set environment variables
52+
"containerEnv": {
53+
"CODESPACES": "true",
54+
"PUPPETEER_SKIP_CHROMIUM_DOWNLOAD": "true",
55+
"PUPPETEER_EXECUTABLE_PATH": "/usr/bin/google-chrome-stable"
56+
},
57+
58+
// Uncomment to connect as root instead. More info: https://aka.ms/dev-containers-non-root
59+
// "remoteUser": "root",
60+
61+
// Features documentation: https://containers.dev/features
62+
"mounts": ["source=/var/run/docker.sock,target=/var/run/docker.sock,type=bind"],
63+
64+
// Memory and CPU limits for better performance
65+
"hostRequirements": {
66+
"cpus": 2,
67+
"memory": "4gb",
68+
"storage": "32gb"
69+
}
70+
}

‎.devcontainer/post-create.sh‎

Lines changed: 77 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,77 @@
1+
#!/bin/bash
2+
set -e
3+
4+
echo "🚀 Setting up Roo Code development environment..."
5+
6+
# Update package lists
7+
echo "📦 Updating package lists..."
8+
sudo apt-get update
9+
10+
# Install Chrome dependencies that might be missing
11+
echo "🌐 Installing Chrome dependencies..."
12+
sudo apt-get install -y \
13+
libatk1.0-0 \
14+
libatk-bridge2.0-0 \
15+
libcups2 \
16+
libdrm2 \
17+
libxkbcommon0 \
18+
libxcomposite1 \
19+
libxdamage1 \
20+
libxfixes3 \
21+
libxrandr2 \
22+
libgbm1 \
23+
libasound2 \
24+
libatspi2.0-0 \
25+
libgtk-3-0 \
26+
libpango-1.0-0 \
27+
libcairo2 \
28+
libxshmfence1 \
29+
libnss3 \
30+
libnssutil3 \
31+
libnspr4 \
32+
libx11-xcb1 \
33+
libxcb-dri3-0 \
34+
fonts-liberation \
35+
libappindicator3-1 \
36+
libxss1 \
37+
lsb-release \
38+
xdg-utils \
39+
wget
40+
41+
# Verify Chrome installation
42+
if ! command -v google-chrome &> /dev/null && ! command -v google-chrome-stable &> /dev/null; then
43+
echo "⚠️ Chrome not found, installing Google Chrome..."
44+
wget -q -O - https://dl-ssl.google.com/linux/linux_signing_key.pub | sudo apt-key add -
45+
sudo sh -c 'echo "deb [arch=amd64] http://dl.google.com/linux/chrome/deb/ stable main" >> /etc/apt/sources.list.d/google.list'
46+
sudo apt-get update
47+
sudo apt-get install -y google-chrome-stable
48+
fi
49+
50+
# Install project dependencies
51+
echo "📚 Installing project dependencies..."
52+
npm install -g pnpm
53+
pnpm install
54+
55+
# Build the project
56+
echo "🔨 Building the project..."
57+
pnpm run bundle
58+
59+
# Create a symlink for Chrome if needed
60+
if [ -f "/usr/bin/google-chrome-stable" ] && [ ! -f "/usr/bin/google-chrome" ]; then
61+
sudo ln -sf /usr/bin/google-chrome-stable /usr/bin/google-chrome
62+
fi
63+
64+
# Set up Docker if available
65+
if command -v docker &> /dev/null; then
66+
echo "🐳 Docker is available, pulling browserless/chrome image..."
67+
docker pull browserless/chrome:latest || true
68+
fi
69+
70+
echo "✅ Development environment setup complete!"
71+
echo ""
72+
echo "📝 Notes:"
73+
echo " - Chrome is installed at: $(which google-chrome || which google-chrome-stable || echo 'Not found')"
74+
echo " - Docker is available: $(command -v docker &> /dev/null && echo 'Yes' || echo 'No')"
75+
echo " - The browser tool should now work correctly in this Codespace"
76+
echo ""
77+
echo "🎉 Happy coding with Roo Code!"

‎.devcontainer/post-start.sh‎

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
#!/bin/bash
2+
set -e
3+
4+
echo "🔄 Starting Roo Code development environment..."
5+
6+
# Check if Chrome is accessible
7+
if command -v google-chrome &> /dev/null || command -v google-chrome-stable &> /dev/null; then
8+
CHROME_PATH=$(which google-chrome || which google-chrome-stable)
9+
echo "✅ Chrome found at: $CHROME_PATH"
10+
11+
# Test Chrome can run headless
12+
echo "🧪 Testing Chrome headless mode..."
13+
timeout 5 $CHROME_PATH --headless --no-sandbox --disable-gpu --dump-dom https://example.com > /dev/null 2>&1 && \
14+
echo "✅ Chrome headless mode works!" || \
15+
echo "⚠️ Chrome headless test failed, but this might be okay"
16+
else
17+
echo "⚠️ Chrome not found. The browser tool may not work correctly."
18+
fi
19+
20+
# Check Docker availability
21+
if command -v docker &> /dev/null; then
22+
echo "🐳 Docker is available"
23+
24+
# Check if Docker daemon is running
25+
if docker info > /dev/null 2>&1; then
26+
echo "✅ Docker daemon is running"
27+
28+
# Optionally pre-pull the browserless image
29+
if [ "${PRELOAD_DOCKER_IMAGES:-false}" = "true" ]; then
30+
echo "📥 Pre-loading Docker browser image..."
31+
docker pull browserless/chrome:latest || true
32+
fi
33+
else
34+
echo "⚠️ Docker daemon is not running. Docker browser option won't be available."
35+
fi
36+
else
37+
echo "ℹ️ Docker is not available. Docker browser option won't be available."
38+
fi
39+
40+
# Display environment info
41+
echo ""
42+
echo "📊 Environment Information:"
43+
echo " - Node.js: $(node --version)"
44+
echo " - npm: $(npm --version)"
45+
echo " - pnpm: $(pnpm --version 2>/dev/null || echo 'Not installed')"
46+
echo " - Chrome: $(google-chrome --version 2>/dev/null || google-chrome-stable --version 2>/dev/null || echo 'Not installed')"
47+
echo " - Docker: $(docker --version 2>/dev/null || echo 'Not installed')"
48+
echo ""
49+
50+
# Check for missing dependencies
51+
MISSING_DEPS=()
52+
for lib in libatk-1.0.so.0 libatk-bridge-2.0.so.0 libcups.so.2; do
53+
if ! ldconfig -p | grep -q $lib; then
54+
MISSING_DEPS+=($lib)
55+
fi
56+
done
57+
58+
if [ ${#MISSING_DEPS[@]} -gt 0 ]; then
59+
echo "⚠️ Some Chrome dependencies might be missing: ${MISSING_DEPS[*]}"
60+
echo " Run: sudo apt-get update && sudo apt-get install -y libatk1.0-0 libatk-bridge2.0-0 libcups2"
61+
else
62+
echo "✅ All critical Chrome dependencies are installed"
63+
fi
64+
65+
echo ""
66+
echo "🚀 Roo Code development environment is ready!"

‎src/package.json‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -407,6 +407,21 @@
407407
"minimum": 1,
408408
"maximum": 200,
409409
"description": "%settings.codeIndex.embeddingBatchSize.description%"
410+
},
411+
"roo-cline.browserDocker.enabled": {
412+
"type": "boolean",
413+
"default": false,
414+
"description": "%settings.browserDocker.enabled.description%"
415+
},
416+
"roo-cline.browserDocker.image": {
417+
"type": "string",
418+
"default": "browserless/chrome:latest",
419+
"description": "%settings.browserDocker.image.description%"
420+
},
421+
"roo-cline.browserDocker.autoStart": {
422+
"type": "boolean",
423+
"default": true,
424+
"description": "%settings.browserDocker.autoStart.description%"
410425
}
411426
}
412427
}

‎src/package.nls.json‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -41,5 +41,8 @@
4141
"settings.useAgentRules.description": "Enable loading of AGENTS.md files for agent-specific rules (see https://agent-rules.org/)",
4242
"settings.apiRequestTimeout.description": "Maximum time in seconds to wait for API responses (0 = no timeout, 1-3600s, default: 600s). Higher values are recommended for local providers like LM Studio and Ollama that may need more processing time.",
4343
"settings.newTaskRequireTodos.description": "Require todos parameter when creating new tasks with the new_task tool",
44-
"settings.codeIndex.embeddingBatchSize.description": "The batch size for embedding operations during code indexing. Adjust this based on your API provider's limits. Default is 60."
44+
"settings.codeIndex.embeddingBatchSize.description": "The batch size for embedding operations during code indexing. Adjust this based on your API provider's limits. Default is 60.",
45+
"settings.browserDocker.enabled.description": "Enable Docker-based browser isolation for enhanced security and dependency management. Requires Docker to be installed.",
46+
"settings.browserDocker.image.description": "Docker image to use for the browser container (default: browserless/chrome:latest)",
47+
"settings.browserDocker.autoStart.description": "Automatically start the Docker browser container when needed"
4548
}

0 commit comments

Comments
 (0)