@ricardodeazambuja/browser-mcp-server 1.0.3 → 1.4.0

package/src/utils.js

@@ -0,0 +1,131 @@
+/**
+ * Utility functions for Browser MCP Server
+ */
+
+const fs = require('fs');
+const os = require('os');
+const path = require('path');
+
+// Get version from package.json
+let version = 'unknown';
+try {
+    const pkg = JSON.parse(fs.readFileSync(path.join(__dirname, '..', 'package.json'), 'utf8'));
+    version = pkg.version;
+} catch (error) {
+    // Fallback if package.json cannot be read
+}
+
+// Log file location
+const logFile = `${os.tmpdir()}/mcp-browser-server.log`;
+
+/**
+ * Log debug messages to file
+ * @param {string} msg - Message to log
+ */
+function debugLog(msg) {
+    const timestamp = new Date().toISOString();
+    fs.appendFileSync(logFile, `${timestamp} - ${msg}\n`);
+}
+
+// Playwright loading state
+let playwright = null;
+let playwrightError = null;
+let playwrightPath = null;
+
+/**
+ * Load Playwright from multiple possible sources
+ * @returns {Object} Playwright module
+ * @throws {Error} If Playwright cannot be loaded
+ */
+function loadPlaywright() {
+    if (playwright) return playwright;
+    if (playwrightError) throw playwrightError;
+
+    const sources = [
+        { path: 'playwright', name: 'npm Playwright (local)' },
+        { path: `${process.env.HOME}/.cache/ms-playwright-go/1.50.1/package`, name: 'Antigravity Go Playwright' },
+        { path: `${process.env.HOME}/.npm-global/lib/node_modules/playwright`, name: 'npm Playwright (global)' }
+    ];
+
+    for (const source of sources) {
+        try {
+            debugLog(`Trying to load Playwright from: ${source.path}`);
+            playwright = require(source.path);
+            playwrightPath = source.path;
+            debugLog(`✅ Playwright loaded successfully: ${source.name}`);
+            return playwright;
+        } catch (error) {
+            debugLog(`❌ Could not load from ${source.path}: ${error.message}`);
+        }
+    }
+
+    playwrightError = new Error(
+        '❌ Playwright is not installed.\n\n' +
+        'To install Playwright:\n' +
+        '1. In Antigravity: Click the Chrome logo (top right) to "Open Browser" - this installs Playwright automatically\n' +
+        '2. Standalone mode: Run:\n' +
+        '   npm install playwright\n' +
+        '   npx playwright install chromium\n\n' +
+        `Tried locations:\n${sources.map(s => `  - ${s.path}`).join('\n')}`
+    );
+    throw playwrightError;
+}
+
+/**
+ * Get the path where Playwright was loaded from
+ * @returns {string|null} Playwright path or null
+ */
+function getPlaywrightPath() {
+    return playwrightPath;
+}
+
+/**
+ * Find Chrome executable in common locations
+ * @returns {string|null} Path to Chrome executable or null
+ */
+function findChromeExecutable() {
+    const { execSync } = require('child_process');
+
+    const commonPaths = [
+        '/usr/bin/google-chrome',
+        '/usr/bin/google-chrome-stable',
+        '/usr/bin/chromium',
+        '/usr/bin/chromium-browser',
+        '/snap/bin/chromium',
+        '/Applications/Google Chrome.app/Contents/MacOS/Google Chrome',
+        '/Applications/Chromium.app/Contents/MacOS/Chromium',
+        'C:\\Program Files\\Google\\Chrome\\Application\\chrome.exe',
+        'C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe'
+    ];
+
+    for (const path of commonPaths) {
+        if (fs.existsSync(path)) {
+            debugLog(`Found Chrome at: ${path}`);
+            return path;
+        }
+    }
+
+    if (process.platform !== 'win32') {
+        try {
+            const result = execSync('which google-chrome || which chromium || which chromium-browser', { encoding: 'utf8' }).trim();
+            if (result && fs.existsSync(result)) {
+                debugLog(`Found Chrome via 'which': ${result}`);
+                return result;
+            }
+        } catch (e) {
+            debugLog(`'which' command failed: ${e.message}`);
+        }
+    }
+
+    debugLog('No system Chrome found');
+    return null;
+}
+
+module.exports = {
+    debugLog,
+    loadPlaywright,
+    getPlaywrightPath,
+    findChromeExecutable,
+    logFile,
+    version
+};

package/tests/fixtures/test-media.html

@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <title>MCP Media Test Page</title>
+</head>
+
+<body>
+    <h1>Media Test Page</h1>
+    <p>This page is used for testing browser media tools.</p>
+
+    <h2>Audio Element</h2>
+    <audio id="test-audio" controls loop>
+        <source src="https://interactive-examples.mdn.mozilla.net/media/cc0-audio/t-rex-roar.mp3" type="audio/mp3">
+        Your browser does not support the audio element.
+    </audio>
+
+    <h2>Video Element</h2>
+    <video id="test-video" width="320" height="240" controls loop muted>
+        <source src="http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/ForBiggerBlazes.mp4"
+            type="video/mp4">
+        Your browser does not support the video element.
+    </video>
+
+    <script>
+        // Fallback: create Web Audio oscillator if audio tag fails to load data URI
+        const audio = document.getElementById('test-audio');
+        if (audio.error) {
+            console.error('Audio tag error:', audio.error);
+        }
+    </script>
+</body>
+
+</html>

package/tests/fixtures/test-network.html

@@ -0,0 +1,48 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Network Test Page</title>
+</head>
+<body>
+    <h1>Network Test Page</h1>
+    <p>This page makes multiple network requests for testing.</p>
+    <div id="status"></div>
+
+    <script>
+        async function makeNetworkRequests() {
+            const status = document.getElementById('status');
+            status.innerHTML = 'Making network requests...<br>';
+
+            try {
+                // Make multiple fetch requests
+                const urls = [
+                    'https://jsonplaceholder.typicode.com/posts/1',
+                    'https://jsonplaceholder.typicode.com/posts/2',
+                    'https://jsonplaceholder.typicode.com/users/1'
+                ];
+
+                for (const url of urls) {
+                    try {
+                        const response = await fetch(url);
+                        const data = await response.json();
+                        status.innerHTML += `✓ Fetched: ${url}<br>`;
+                    } catch (e) {
+                        status.innerHTML += `✗ Failed: ${url} - ${e.message}<br>`;
+                    }
+                }
+
+                status.innerHTML += 'Network requests completed!';
+            } catch (error) {
+                status.innerHTML += `Error: ${error.message}`;
+            }
+        }
+
+        // Auto-run after page load
+        window.addEventListener('load', () => {
+            setTimeout(makeNetworkRequests, 500);
+        });
+    </script>
+</body>
+</html>

package/tests/fixtures/test-performance.html

@@ -0,0 +1,61 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Performance Test Page</title>
+    <style>
+        body {
+            font-family: Arial, sans-serif;
+            padding: 20px;
+        }
+        .container {
+            max-width: 800px;
+            margin: 0 auto;
+        }
+    </style>
+</head>
+<body>
+    <div class="container">
+        <h1>Performance Test Page</h1>
+        <p>This page is used for testing CPU profiling and performance metrics.</p>
+        <button id="heavy-compute">Run Heavy Computation</button>
+        <div id="output"></div>
+    </div>
+
+    <script>
+        // Heavy computation for CPU profiling test
+        function fibonacci(n) {
+            if (n <= 1) return n;
+            return fibonacci(n - 1) + fibonacci(n - 2);
+        }
+
+        function performHeavyComputation() {
+            const start = Date.now();
+            const result = fibonacci(35);
+            const duration = Date.now() - start;
+            document.getElementById('output').innerHTML =
+                `Computed fibonacci(35) = ${result} in ${duration}ms`;
+        }
+
+        // Auto-run computation for testing
+        document.getElementById('heavy-compute').addEventListener('click', performHeavyComputation);
+
+        // Run automatically after a short delay
+        setTimeout(performHeavyComputation, 100);
+
+        // Create some DOM nodes for metrics testing
+        for (let i = 0; i < 100; i++) {
+            const div = document.createElement('div');
+            div.textContent = `Node ${i}`;
+            div.style.display = 'none';
+            document.body.appendChild(div);
+        }
+
+        // Add event listeners for metrics testing
+        for (let i = 0; i < 50; i++) {
+            document.body.addEventListener('click', () => {});
+        }
+    </script>
+</body>
+</html>

package/tests/fixtures/test-security.html

@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta http-equiv="Content-Security-Policy" content="default-src 'self' 'unsafe-inline'">
+    <title>Security Test Page</title>
+</head>
+<body>
+    <h1>Security Test Page</h1>
+    <p>This page is used for testing security features.</p>
+    <div id="status"></div>
+
+    <script>
+        // This inline script is allowed by CSP
+        document.getElementById('status').innerHTML = 'Page loaded successfully';
+
+        // Attempt to trigger CSP violation by trying to load external script
+        // (This will be blocked and create a CSP violation)
+        try {
+            const script = document.createElement('script');
+            script.src = 'https://example.com/external.js';
+            document.head.appendChild(script);
+        } catch (e) {
+            console.log('CSP blocked external script');
+        }
+
+        // Log security info
+        console.log('Page protocol:', window.location.protocol);
+        console.log('Page origin:', window.location.origin);
+    </script>
+</body>
+</html>

package/tests/fixtures/test-storage.html

@@ -0,0 +1,76 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Storage Test Page</title>
+</head>
+<body>
+    <h1>Storage Test Page</h1>
+    <p>This page creates IndexedDB and Cache Storage for testing.</p>
+    <div id="status"></div>
+
+    <script>
+        async function setupStorage() {
+            const status = document.getElementById('status');
+            status.innerHTML = 'Setting up storage...<br>';
+
+            try {
+                // Create IndexedDB
+                const dbRequest = indexedDB.open('testDB', 1);
+
+                dbRequest.onupgradeneeded = (event) => {
+                    const db = event.target.result;
+                    if (!db.objectStoreNames.contains('users')) {
+                        const objectStore = db.createObjectStore('users', { keyPath: 'id' });
+                        objectStore.createIndex('name', 'name', { unique: false });
+                    }
+                };
+
+                dbRequest.onsuccess = async (event) => {
+                    const db = event.target.result;
+                    const transaction = db.transaction(['users'], 'readwrite');
+                    const objectStore = transaction.objectStore('users');
+
+                    // Add some data
+                    objectStore.add({ id: 1, name: 'Alice', email: 'alice@example.com' });
+                    objectStore.add({ id: 2, name: 'Bob', email: 'bob@example.com' });
+
+                    status.innerHTML += '✓ IndexedDB created and populated<br>';
+
+                    // Create Cache Storage
+                    if ('caches' in window) {
+                        const cache = await caches.open('test-cache-v1');
+                        await cache.put('/test', new Response('Test data'));
+                        status.innerHTML += '✓ Cache Storage created<br>';
+                    }
+
+                    // Register Service Worker (if supported)
+                    if ('serviceWorker' in navigator) {
+                        try {
+                            // Note: Service worker registration requires HTTPS or localhost
+                            status.innerHTML += 'Service Worker registration skipped (requires HTTPS)<br>';
+                        } catch (e) {
+                            status.innerHTML += `Service Worker: ${e.message}<br>`;
+                        }
+                    }
+
+                    status.innerHTML += 'Storage setup complete!';
+                };
+
+                dbRequest.onerror = (event) => {
+                    status.innerHTML += `✗ IndexedDB error: ${event.target.error}<br>`;
+                };
+
+            } catch (error) {
+                status.innerHTML += `Error: ${error.message}`;
+            }
+        }
+
+        // Auto-run after page load
+        window.addEventListener('load', () => {
+            setTimeout(setupStorage, 500);
+        });
+    </script>
+</body>
+</html>

package/tests/run-all.js

@@ -0,0 +1,50 @@
+#!/usr/bin/env node
+
+/**
+ * Main Test Runner
+ * Runs all test files in the tests directory
+ */
+
+const { spawnSync } = require('child_process');
+const fs = require('fs');
+const path = require('path');
+
+const testsDir = __dirname;
+const testFiles = fs.readdirSync(testsDir)
+    .filter(f => f.startsWith('test-') && f.endsWith('.js'))
+    .sort();
+
+console.log('🚀 Running all Browser MCP Server tests...\n');
+
+let passed = 0;
+let failed = 0;
+
+testFiles.forEach(file => {
+    console.log(`\n------------------------------------------------------------`);
+    console.log(`📄 Testing: ${file}`);
+    console.log(`------------------------------------------------------------\n`);
+
+    const result = spawnSync('node', [path.join(testsDir, file)], {
+        stdio: 'inherit'
+    });
+
+    if (result.status === 0) {
+        passed++;
+    } else {
+        failed++;
+        console.error(`\n❌ ${file} failed with exit code ${result.status}`);
+    }
+});
+
+console.log(`\n\n${'='.repeat(60)}`);
+console.log(`📊 Final Test Summary:`);
+console.log(`   ✅ Passed: ${passed}`);
+console.log(`   ❌ Failed: ${failed}`);
+console.log(`${'='.repeat(60)}\n`);
+
+if (failed > 0) {
+    process.exit(1);
+} else {
+    console.log('🎉 All test suites passed successfully!\n');
+    process.exit(0);
+}

package/{test-browser-automation.js → tests/test-browser-automation.js}

@@ -8,6 +8,7 @@
 const { spawn } = require('child_process');
 const readline = require('readline');
 const fs = require('fs');
+const path = require('path');
 
 let requestId = 0;
 let proc;
@@ -28,9 +29,10 @@ function sendRequest(method, params = {}) {
 
 async function runTests() {
   console.log('🌐 Browser Automation Test Suite\n');
-  console.log('=' .repeat(60));
+  console.log('='.repeat(60));
 
-  proc = spawn('node', ['browser-mcp-server-playwright.js'], {
+  const serverPath = path.join(__dirname, '..', 'src', 'index.js');
+  proc = spawn('node', [serverPath], {
     stdio: ['pipe', 'pipe', 'pipe']
   });
 
@@ -47,6 +49,9 @@ async function runTests() {
     'Navigate to Example.com',
     'Evaluate JavaScript',
     'Take Screenshot',
+    'Open New Page',
+    'List Pages',
+    'Wait',
     'Cleanup'
   ];
 
@@ -123,9 +128,41 @@ async function runTests() {
           break;
 
         case 6: // Screenshot
-          const imgData = response.result.content[0].data;
-          const imgSize = Buffer.from(imgData, 'base64').length;
-          console.log(`   ✅ ${currentTest} (${(imgSize / 1024).toFixed(1)} KB)`);
+          console.log(`   ✅ ${currentTest}`);
+          testStep++;
+
+          // Open new page
+          setTimeout(() => sendRequest('tools/call', {
+            name: 'browser_new_page',
+            arguments: { url: 'https://google.com' }
+          }), 100);
+          break;
+
+        case 7: // New Page
+          console.log(`   ✅ ${currentTest}`);
+          testStep++;
+
+          // List pages
+          setTimeout(() => sendRequest('tools/call', {
+            name: 'browser_list_pages',
+            arguments: {}
+          }), 100);
+
+          break;
+
+        case 8: // List Pages
+          console.log(`   ✅ ${currentTest}`);
+          testStep++;
+
+          // Wait
+          setTimeout(() => sendRequest('tools/call', {
+            name: 'browser_wait',
+            arguments: { ms: 500 }
+          }), 100);
+          break;
+
+        case 9: // Wait
+          console.log(`   ✅ ${currentTest}`);
           testStep++;
 
           // All tests complete
@@ -138,6 +175,8 @@ async function runTests() {
             console.log('   • Page navigation (example.com)');
             console.log('   • JavaScript evaluation');
             console.log('   • Screenshot capture');
+            console.log('   • Multi-page management');
+            console.log('   • Wait utility');
             console.log('\n✨ The MCP server is fully functional!\n');
 
             proc.kill();

package/{test-mcp.js → tests/test-mcp.js}

@@ -6,6 +6,7 @@
 
 const { spawn } = require('child_process');
 const readline = require('readline');
+const path = require('path');
 
 let requestId = 0;
 
@@ -36,9 +37,10 @@ function sendNotification(proc, method, params = {}) {
 
 async function runTests() {
   console.log('🧪 Starting MCP Server Tests\n');
-  console.log('=' .repeat(50));
+  console.log('='.repeat(50));
 
-  const proc = spawn('node', ['browser-mcp-server-playwright.js'], {
+  const serverPath = path.join(__dirname, '..', 'src', 'index.js');
+  const proc = spawn('node', [serverPath], {
     stdio: ['pipe', 'pipe', 'pipe']
   });
 
@@ -49,6 +51,7 @@ async function runTests() {
 
   const responses = new Map();
   let testsCompleted = 0;
+  let toolCount = 0;
   const totalTests = 3;
 
   rl.on('line', (line) => {
@@ -73,7 +76,7 @@ async function runTests() {
 
         } else if (response.id === 2) {
           // Tools list response
-          const toolCount = response.result.tools.length;
+          toolCount = response.result.tools.length;
           console.log(`   ✅ Received ${toolCount} tools:`);
           response.result.tools.forEach(tool => {
             console.log(`      - ${tool.name}`);
@@ -100,7 +103,9 @@ async function runTests() {
             console.log(`\n✅ All tests passed! (${testsCompleted}/${totalTests})`);
             console.log('\n📊 Test Summary:');
             console.log('   ✅ MCP Protocol initialization');
-            console.log('   ✅ Tools listing (16 tools)');
+            console.log(`   ✅ Tools listing (${toolCount} tools)`);
+
+
             console.log('   ✅ Browser automation (health check)');
             console.log('\n🎉 MCP Server is fully functional!\n');
             proc.kill();