fix: automatic Chrome dependency installation and Docker browser support for Codespaces

.devcontainer/README.md

@@ -0,0 +1,133 @@
+# Roo Code GitHub Codespaces Configuration
+
+This directory contains the configuration for running Roo Code in GitHub Codespaces, providing a fully configured development environment with automatic Chrome/Puppeteer dependency installation.
+
+## Features
+
+### Automatic Dependency Installation
+
+- **Chrome Browser**: Google Chrome Stable is automatically installed with all required dependencies
+- **Docker Support**: Docker-in-Docker feature enables containerized browser option
+- **Node.js Environment**: Pre-configured TypeScript/Node.js development container
+- **VS Code Extensions**: Essential extensions are pre-installed
+
+### Browser Tool Support
+
+The configuration ensures the browser tool works seamlessly in Codespaces by:
+
+1. **Automatic Chrome Installation**: Chrome and all its dependencies are installed during container creation
+2. **Dependency Detection**: The extension automatically detects and installs missing dependencies
+3. **Docker Fallback**: If Chrome fails, Docker browser container can be used as fallback
+4. **Environment Variables**: Proper configuration for Puppeteer to use system Chrome
+
+## Configuration Options
+
+### Docker Browser (Optional)
+
+You can enable Docker-based browser isolation in VS Code settings:
+
+```json
+{
+	"roo-cline.browserDocker.enabled": true,
+	"roo-cline.browserDocker.image": "browserless/chrome:latest",
+	"roo-cline.browserDocker.autoStart": true
+}
+```
+
+### Benefits of Docker Browser
+
+- **Isolation**: Browser runs in a separate container
+- **Consistency**: Same browser environment across all systems
+- **No Dependencies**: No need to install Chrome dependencies on host
+- **Security**: Enhanced security through containerization
+
+## Troubleshooting
+
+### Browser Tool Not Working?
+
+1. **Check Chrome Installation**:
+
+    ```bash
+    google-chrome --version
+    # or
+    google-chrome-stable --version
+    ```
+
+2. **Test Chrome Headless**:
+
+    ```bash
+    google-chrome --headless --no-sandbox --disable-gpu --dump-dom https://example.com
+    ```
+
+3. **Check Missing Dependencies**:
+
+    ```bash
+    ldd $(which google-chrome) | grep "not found"
+    ```
+
+4. **Install Missing Dependencies Manually**:
+
+    ```bash
+    sudo apt-get update
+    sudo apt-get install -y \
+      libatk1.0-0 libatk-bridge2.0-0 libcups2 libdrm2 \
+      libxkbcommon0 libxcomposite1 libxdamage1 libxfixes3 \
+      libxrandr2 libgbm1 libasound2
+    ```
+
+5. **Use Docker Browser as Fallback**:
+    - Enable Docker browser in settings (see Configuration Options above)
+    - Ensure Docker is running: `docker info`
+    - The extension will automatically use Docker if Chrome fails
+
+### Docker Issues?
+
+1. **Check Docker Status**:
+
+    ```bash
+    docker info
+    ```
+
+2. **Pull Browser Image Manually**:
+
+    ```bash
+    docker pull browserless/chrome:latest
+    ```
+
+3. **Test Docker Browser**:
+    ```bash
+    docker run -d --name test-browser -p 3000:3000 browserless/chrome:latest
+    # Visit http://localhost:3000 to verify
+    docker stop test-browser && docker rm test-browser
+    ```
+
+## Files in This Directory
+
+- **devcontainer.json**: Main configuration file for the dev container
+- **post-create.sh**: Script that runs after container creation (installs dependencies)
+- **post-start.sh**: Script that runs each time the container starts (verifies setup)
+- **README.md**: This documentation file
+
+## How It Works
+
+1. **Container Creation**: When you create a Codespace, it uses the TypeScript/Node.js base image
+2. **Feature Installation**: Docker-in-Docker and Chrome features are installed
+3. **Post-Create Script**: Installs Chrome dependencies and builds the project
+4. **Post-Start Script**: Verifies the environment on each container start
+5. **Automatic Detection**: The extension detects the Codespace environment and adapts accordingly
+
+## Environment Variables
+
+The following environment variables are set automatically:
+
+- `CODESPACES=true`: Indicates running in GitHub Codespaces
+- `PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=true`: Prevents Puppeteer from downloading Chromium
+- `PUPPETEER_EXECUTABLE_PATH=/usr/bin/google-chrome-stable`: Points Puppeteer to system Chrome
+
+## Support
+
+If you encounter issues with the browser tool in Codespaces:
+
+1. Check the troubleshooting section above
+2. Review the post-start script output for warnings
+3. Report issues at: https://github.com/RooCodeInc/Roo-Code/issues

.devcontainer/devcontainer.json

@@ -0,0 +1,70 @@
+{
+	"name": "Roo Code Development",
+	"image": "mcr.microsoft.com/devcontainers/typescript-node:20",
+
+	// Features to add to the dev container
+	"features": {
+		"ghcr.io/devcontainers/features/docker-in-docker:2": {},
+		"ghcr.io/devcontainers/features/github-cli:1": {},
+		"ghcr.io/devcontainers/features/chrome:1": {
+			"version": "stable"
+		}
+	},
+
+	// Configure tool-specific properties
+	"customizations": {
+		"vscode": {
+			"extensions": [
+				"dbaeumer.vscode-eslint",
+				"esbenp.prettier-vscode",
+				"ms-vscode.vscode-typescript-next",
+				"RooVeterinaryInc.roo-cline"
+			],
+			"settings": {
+				"terminal.integrated.defaultProfile.linux": "bash",
+				"typescript.tsdk": "node_modules/typescript/lib",
+				"eslint.validate": ["javascript", "javascriptreact", "typescript", "typescriptreact"],
+				"editor.formatOnSave": true,
+				"editor.defaultFormatter": "esbenp.prettier-vscode",
+				"[typescript]": {
+					"editor.defaultFormatter": "esbenp.prettier-vscode"
+				},
+				"[javascript]": {
+					"editor.defaultFormatter": "esbenp.prettier-vscode"
+				},
+				"[json]": {
+					"editor.defaultFormatter": "esbenp.prettier-vscode"
+				}
+			}
+		}
+	},
+
+	// Use 'forwardPorts' to make a list of ports inside the container available locally
+	"forwardPorts": [3000, 9222],
+
+	// Use 'postCreateCommand' to run commands after the container is created
+	"postCreateCommand": "bash .devcontainer/post-create.sh",
+
+	// Use 'postStartCommand' to run commands after the container starts
+	"postStartCommand": "bash .devcontainer/post-start.sh",
+
+	// Set environment variables
+	"containerEnv": {
+		"CODESPACES": "true",
+		"PUPPETEER_SKIP_CHROMIUM_DOWNLOAD": "true",
+		"PUPPETEER_EXECUTABLE_PATH": "/usr/bin/google-chrome-stable"
+	},
+
+	// Uncomment to connect as root instead. More info: https://aka.ms/dev-containers-non-root
+	// "remoteUser": "root",
+
+	// Features documentation: https://containers.dev/features
+	"mounts": ["source=/var/run/docker.sock,target=/var/run/docker.sock,type=bind"],
+
+	// Memory and CPU limits for better performance
+	"hostRequirements": {
+		"cpus": 2,
+		"memory": "4gb",
+		"storage": "32gb"
+	}
+}

.devcontainer/post-create.sh

@@ -0,0 +1,77 @@
+#!/bin/bash
+set -e
+
+echo "🚀 Setting up Roo Code development environment..."
+
+# Update package lists
+echo "📦 Updating package lists..."
+sudo apt-get update
+
+# Install Chrome dependencies that might be missing
+echo "🌐 Installing Chrome dependencies..."
+sudo apt-get install -y \
+    libatk1.0-0 \
+    libatk-bridge2.0-0 \
+    libcups2 \
+    libdrm2 \
+    libxkbcommon0 \
+    libxcomposite1 \
+    libxdamage1 \
+    libxfixes3 \
+    libxrandr2 \
+    libgbm1 \
+    libasound2 \
+    libatspi2.0-0 \
+    libgtk-3-0 \
+    libpango-1.0-0 \
+    libcairo2 \
+    libxshmfence1 \
+    libnss3 \
+    libnssutil3 \
+    libnspr4 \
+    libx11-xcb1 \
+    libxcb-dri3-0 \
+    fonts-liberation \
+    libappindicator3-1 \
+    libxss1 \
+    lsb-release \
+    xdg-utils \
+    wget
+
+# Verify Chrome installation
+if ! command -v google-chrome &> /dev/null && ! command -v google-chrome-stable &> /dev/null; then
+    echo "⚠️ Chrome not found, installing Google Chrome..."
+    wget -q -O - https://dl-ssl.google.com/linux/linux_signing_key.pub | sudo apt-key add -
+    sudo sh -c 'echo "deb [arch=amd64] http://dl.google.com/linux/chrome/deb/ stable main" >> /etc/apt/sources.list.d/google.list'
+    sudo apt-get update
+    sudo apt-get install -y google-chrome-stable
+fi
+
+# Install project dependencies
+echo "📚 Installing project dependencies..."
+npm install -g pnpm
+pnpm install
+
+# Build the project
+echo "🔨 Building the project..."
+pnpm run bundle
+
+# Create a symlink for Chrome if needed
+if [ -f "/usr/bin/google-chrome-stable" ] && [ ! -f "/usr/bin/google-chrome" ]; then
+    sudo ln -sf /usr/bin/google-chrome-stable /usr/bin/google-chrome
+fi
+
+# Set up Docker if available
+if command -v docker &> /dev/null; then
+    echo "🐳 Docker is available, pulling browserless/chrome image..."
+    docker pull browserless/chrome:latest || true
+fi
+
+echo "✅ Development environment setup complete!"
+echo ""
+echo "📝 Notes:"
+echo "  - Chrome is installed at: $(which google-chrome || which google-chrome-stable || echo 'Not found')"
+echo "  - Docker is available: $(command -v docker &> /dev/null && echo 'Yes' || echo 'No')"
+echo "  - The browser tool should now work correctly in this Codespace"
+echo ""
+echo "🎉 Happy coding with Roo Code!"

.devcontainer/post-start.sh

@@ -0,0 +1,66 @@
+#!/bin/bash
+set -e
+
+echo "🔄 Starting Roo Code development environment..."
+
+# Check if Chrome is accessible
+if command -v google-chrome &> /dev/null || command -v google-chrome-stable &> /dev/null; then
+    CHROME_PATH=$(which google-chrome || which google-chrome-stable)
+    echo "✅ Chrome found at: $CHROME_PATH"
+
+    # Test Chrome can run headless
+    echo "🧪 Testing Chrome headless mode..."
+    timeout 5 $CHROME_PATH --headless --no-sandbox --disable-gpu --dump-dom https://example.com > /dev/null 2>&1 && \
+        echo "✅ Chrome headless mode works!" || \
+        echo "⚠️ Chrome headless test failed, but this might be okay"
+else
+    echo "⚠️ Chrome not found. The browser tool may not work correctly."
+fi
+
+# Check Docker availability
+if command -v docker &> /dev/null; then
+    echo "🐳 Docker is available"
+
+    # Check if Docker daemon is running
+    if docker info > /dev/null 2>&1; then
+        echo "✅ Docker daemon is running"
+
+        # Optionally pre-pull the browserless image
+        if [ "${PRELOAD_DOCKER_IMAGES:-false}" = "true" ]; then
+            echo "📥 Pre-loading Docker browser image..."
+            docker pull browserless/chrome:latest || true
+        fi
+    else
+        echo "⚠️ Docker daemon is not running. Docker browser option won't be available."
+    fi
+else
+    echo "ℹ️ Docker is not available. Docker browser option won't be available."
+fi
+
+# Display environment info
+echo ""
+echo "📊 Environment Information:"
+echo "  - Node.js: $(node --version)"
+echo "  - npm: $(npm --version)"
+echo "  - pnpm: $(pnpm --version 2>/dev/null || echo 'Not installed')"
+echo "  - Chrome: $(google-chrome --version 2>/dev/null || google-chrome-stable --version 2>/dev/null || echo 'Not installed')"
+echo "  - Docker: $(docker --version 2>/dev/null || echo 'Not installed')"
+echo ""
+
+# Check for missing dependencies
+MISSING_DEPS=()
+for lib in libatk-1.0.so.0 libatk-bridge-2.0.so.0 libcups.so.2; do
+    if ! ldconfig -p | grep -q $lib; then
+        MISSING_DEPS+=($lib)
+    fi
+done
+
+if [ ${#MISSING_DEPS[@]} -gt 0 ]; then
+    echo "⚠️ Some Chrome dependencies might be missing: ${MISSING_DEPS[*]}"
+    echo "   Run: sudo apt-get update && sudo apt-get install -y libatk1.0-0 libatk-bridge2.0-0 libcups2"
+else
+    echo "✅ All critical Chrome dependencies are installed"
+fi
+
+echo ""
+echo "🚀 Roo Code development environment is ready!"

src/package.json

@@ -407,6 +407,21 @@
 					"minimum": 1,
 					"maximum": 200,
 					"description": "%settings.codeIndex.embeddingBatchSize.description%"
+				},
+				"roo-cline.browserDocker.enabled": {
+					"type": "boolean",
+					"default": false,
+					"description": "%settings.browserDocker.enabled.description%"
+				},
+				"roo-cline.browserDocker.image": {
+					"type": "string",
+					"default": "browserless/chrome:latest",
+					"description": "%settings.browserDocker.image.description%"
+				},
+				"roo-cline.browserDocker.autoStart": {
+					"type": "boolean",
+					"default": true,
+					"description": "%settings.browserDocker.autoStart.description%"
 				}
 			}
 		}

src/package.nls.json

@@ -41,5 +41,8 @@
 	"settings.useAgentRules.description": "Enable loading of AGENTS.md files for agent-specific rules (see https://agent-rules.org/)",
 	"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.",
 	"settings.newTaskRequireTodos.description": "Require todos parameter when creating new tasks with the new_task tool",
-	"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."
+	"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.",
+	"settings.browserDocker.enabled.description": "Enable Docker-based browser isolation for enhanced security and dependency management. Requires Docker to be installed.",
+	"settings.browserDocker.image.description": "Docker image to use for the browser container (default: browserless/chrome:latest)",
+	"settings.browserDocker.autoStart.description": "Automatically start the Docker browser container when needed"
 }