Configuring Polymer 3.x tests for headless browser execution

Hey everyone! I’m trying to set up my Polymer 3.x tests to run in a headless browser so that the browser window doesn’t keep popping up. I’ve installed the wct-headless package and configured my wct.config.json, but I’m encountering an error when I run polymer test.

The error message I get is:

Could not find WCT plugin named "headless"

Below is my wct.config.json:

{
  "plugins": {
    "local": {
      "disabled": true
    },
    "headless": {
      "browsers": ["chromium", "firefox"],
      "browserOptions": {
        "chromium": ["--no-gui", "--disable-gpu"],
        "firefox": ["--headless"]
      }
    },
    "remote": false,
    "test-output": {
      "file": "results.xml"
    }
  }
}

And here are the relevant portions of my package.json:

{
  "dependencies": {
    "@polymer/polymer": "^3.0.0"
  },
  "devDependencies": {
    "@polymer/iron-demo-helpers": "^3.0.0-pre.19",
    "@webcomponents/webcomponentsjs": "^2.0.0",
    "wct-browser-legacy": "^1.0.0",
    "wct-headless": "^2.2.2",
    "web-component-tester": "^6.8.0",
    "wct-xunit-reporter": "1.0.2"
  }
}

Can anyone advise on how to adjust my wct.config.json to resolve this issue?

I encountered a similar issue when configuring Polymer 3.x tests for headless execution. The problem lies in the plugin configuration. The ‘headless’ plugin isn’t a separate entity; it’s part of the ‘local’ plugin.

To resolve this, modify your wct.config.json as follows:

{
  "plugins": {
    "local": {
      "browsers": ["chrome", "firefox"],
      "browserOptions": {
        "chrome": ["--headless", "--disable-gpu"],
        "firefox": ["--headless"]
      }
    },
    "remote": false,
    "test-output": {
      "file": "results.xml"
    }
  }
}

This configuration utilizes the local plugin with headless options. Ensure you have the latest versions of wct-browser-legacy and web-component-tester installed. After making these changes, run ‘polymer test’ again. It should execute your tests in headless mode without opening browser windows.

hey nova56, had similar issue. try updating wct.config.json to use ‘local’ instead of ‘headless’. like this:

"plugins": {
  "local": {
    "browsers": ["chrome", "firefox"],
    "browserOptions": {
      "chrome": ["--headless", "--disable-gpu"],
      "firefox": ["--headless"]
    }
  }
}

this worked for me. hope it helps!

I’ve dealt with this exact problem before, and it can be frustrating. The key is understanding that ‘headless’ isn’t a separate plugin, but a feature of the ‘local’ plugin. Here’s what worked for me:

First, update your wct.config.json file. Remove the ‘headless’ section entirely and modify the ‘local’ plugin like this:

{
  "plugins": {
    "local": {
      "browsers": ["chrome", "firefox"],
      "browserOptions": {
        "chrome": ["--headless", "--disable-gpu", "--no-sandbox"],
        "firefox": ["--headless"]
      }
    },
    "remote": false,
    "test-output": {
      "file": "results.xml"
    }
  }
}

Also, make sure your package.json has the latest versions of the necessary packages. You might want to run ‘npm update’ to ensure everything is up to date.

After making these changes, clear your npm cache with ‘npm cache clean --force’ and then run ‘npm install’ again. This should resolve the issue and allow you to run your tests headlessly.