Vue-Cli+Electron+ChromeDriver+Selenium测试遇DevToolsActivePort错误求助

Let's break down and fix this issue step by step—this error usually stems from version mismatches, misconfigured Chrome options, or improper async handling in your test code.

1. Critical First Step: Match Electron and ChromeDriver Versions #

This is the most common root cause here. Electron bundles a specific Chrome version, and ChromeDriver must exactly match that Chrome version to work correctly.

Looking at your package.json, you're using Electron 4.0.0, which ships with Chrome 69. But your ChromeDriver is 73.0.0 (and you tried 74.x)—these versions are incompatible!

• Download ChromeDriver 69.x.x (e.g., ChromeDriver 69.0.3497.106) — this matches Electron 4.0.0's Chrome kernel.
• Replace your current ChromeDriver binary with this version, then restart ChromeDriver with:

  ./chromedriver --port=9515 --verbose
  

  The --verbose flag will help you debug any startup issues with ChromeDriver itself.

2. Fix Your Selenium Test Code (ff.js) #

Your original code has conflicting ChromeOptions configurations and incorrect browser targeting. Here's the corrected version with explanations:

const webdriver = require('selenium-webdriver')
const chrome = require('selenium-webdriver/chrome');

async function runAutomatedTest() {
  // Configure ChromeOptions in one place to avoid conflicts
  const chromeOptions = new chrome.Options();
  
  // Point directly to your Electron app binary
  chromeOptions.setBinary('./dist_electron/mac/myapp.app/Contents/MacOS/myapp');
  
  // Add critical arguments to resolve DevToolsPort issues
  chromeOptions.addArguments([
    '--headless',
    '--disable-gpu',
    '--no-sandbox',
    '--disable-extensions',
    '--disable-dev-shm-usage',
    '--remote-debugging-port=7070', // Ensure this port is free (check with `lsof -i :7070` on Mac/Linux)
    '--user-data-dir=/tmp/electron-test-profile', // Temp profile to avoid permission/lock issues
    '--no-first-run',
    '--no-default-browser-check'
  ]);

  const driver = await new webdriver.Builder()
    .usingServer('http://localhost:9515')
    .forBrowser('chrome') // Use 'chrome' (not 'electron')—we're driving Electron via ChromeDriver
    .setChromeOptions(chromeOptions)
    .build();

  try {
    // Add a test action to verify the driver works
    await driver.get('about:blank');
    const pageTitle = await driver.getTitle();
    console.log('Electron app title:', pageTitle);
  } catch (error) {
    console.error('Test failed:', error);
  } finally {
    // Ensure we quit the driver properly after the test
    await driver.quit();
  }
}

// Run the test
runAutomatedTest();

Key fixes here:

• Used async/await to handle Selenium's asynchronous operations (your original code called driver.quit() immediately after building the driver, before it could initialize)
• Removed conflicting withCapabilities and setChromeOptions calls—we configure everything in one chromeOptions instance
• Targeted 'chrome' instead of 'electron' in forBrowser() (ChromeDriver understands Chrome-compatible binaries like Electron)
• Added --user-data-dir to use a temporary profile, which avoids file lock or permission issues that often cause the DevToolsPort error

3. Fix RobotFramework Configuration #

If you're using RobotFramework, apply the same version matching and option fixes. Here's the updated setup:

vars.py #

binary_location = {
    "browserName": "chrome",
    "chromeOptions": {
        "binary": "./dist_electron/mac/myapp.app/Contents/MacOS/myapp",
        "args": [
            "--headless",
            "--disable-gpu",
            "--no-sandbox",
            "--disable-dev-shm-usage",
            "--remote-debugging-port=7070",
            "--user-data-dir=/tmp/electron-test-profile"
        ]
    }
}

mytest.robot #

*** Settings ***
Library    Selenium2Library
Variables    vars.py

*** Test Cases ***
Foohaha
    Create Webdriver    Remote    desired_capabilities=${binary_location}    command_executor=http://localhost:9515
    Go To    about:blank
    ${title}    Get Title
    Log To Console    Electron app title: ${title}
    [Teardown]    Close All Browsers

4. Additional Troubleshooting Tips #

• Check for port conflicts: Ensure ports 9515 (ChromeDriver) and 7070 (remote debugging) aren't being used by other apps. Use lsof -i :9515 (Mac/Linux) or netstat -ano | findstr :9515 (Windows) to verify.
• Verify Electron binary path: Double-check that the path to your Electron app binary is correct (relative paths can be tricky—try using an absolute path if you're still having issues).
• Run without headless mode temporarily: Comment out --headless and --disable-gpu to see if the Electron app launches visibly—this can help you spot UI-level issues that might be crashing the app before it initializes DevTools.

内容的提问来源于stack exchange，提问作者P. Api