🚀 DAY 2 OF LAUNCH WEEK: Announcing Socket Certified Patches: One-Click Fixes for Vulnerable Dependencies.Learn more →
Socket
Book a DemoInstallSign in
Socket

@zambezi/mocha-headless-chrome

Package Overview
Dependencies
Maintainers
5
Versions
2
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@zambezi/mocha-headless-chrome

Run Mocha tests using headless Google Chrome

latest
Source
npmnpm
Version
1.0.0
Version published
Maintainers
5
Created
Source

mocha-headless-chrome

Run Mocha tests using headless Google Chrome.

This tool is a fork of https://github.com/shellscape/mocha-chrome. It adds support of Node.JS 6.x as well as fixing few quirks.

Getting Started

To begin, you'll need to install mocha-chrome:

$ npm install @zambezi/mocha-headless-chrome --save-dev

Then you'll need a local npm install of mocha:

$ npm install mocha --save-dev

To run the tests, you'll need an HTML file with some basics:

<!doctype>
<html>
  <head>
    <title>Test</title>
    <meta charset="utf-8">
    <link rel="stylesheet" href="../node_modules/mocha/mocha.css" />
    <script src="../node_modules/mocha/mocha.js"></script>
    <script src="../node_modules/chai/chai.js"></script>
  </head>
  <body>
    <div id="mocha"></div>
    <script>
      expect = chai.expect;
      mocha.setup('bdd')
      
      // add tests here

      mocha.run();
    </script>
  </body>
</html>

You can then add your tests either through an external script file or inline within a <script> tag. Running the tests is easy, either with the CLI binary, or programmatically.

CLI

$ mocha-headless-chrome --help

  Usage
    $ mocha-headless-chrome <file.html> [options]

  Options
    --mocha      A JSON string representing a config object to pass to Mocha
    --log-level  Specify a log level; trace, debug, info, warn, error
    --no-colors  Disable colors in Mocha's output
    --reporter   Specify the Mocha reporter to use
    --timeout    Specify the test startup timeout to use

  Examples
    $ mocha-headless-chrome test.html --no-colors
    $ mocha-headless-chrome test.html --reporter dot
    $ mocha-headless-chrome test.html --mocha '{"ui":"tdd"}'

Reporters

Third party reporter have to be loaded within the page to be used. For instance to use mocha-teamcity-reporter ;

  • Install the reporter npm install mocha-teamcity-reporter --save-dev.
  • Modify the HTML page to add a script tag:
<!doctype>
<html>
  <head>
    <title>Test</title>
    <meta charset="utf-8">
    <link rel="stylesheet" href="../node_modules/mocha/mocha.css" />
    <script src="../node_modules/mocha/mocha.js"></script>
    <script src="../node_modules/chai/chai.js"></script>
    <script src="../node_modules/mocha-teamcity-reporter/lib/teamcity.js"></script>
  </head>
  <body>
    <div id="mocha"></div>
    <script>
      expect = chai.expect;
      mocha.setup('bdd')
      
      // add tests here

      mocha.run();
    </script>
  </body>
</html>

The custom reporter can be used with the --reporter CLI argument

mocha-headless-chrome test.html --reporter teamcity

Cookies and the file:// Protocol

Chrome has long-since disabled cookies for files loaded via the file:// protocol. The once-available --enable-file-cookies has been removed and we're left with few options. If you're in need of cookie support for your local-file test, you may use the following snippet, which will shim document.cookie with very basic support:

  Object.defineProperty(document, 'cookie', {
    get: function () {
      return this.value || '';
    },
    set: function (cookie) {
      cookie = cookie || '';

      const cutoff = cookie.indexOf(';');
      const pair = cookie.substring(0, cutoff >= 0 ? cutoff : cookie.length);
      const cookies = this.value ? this.value.split('; ') : [];

      cookies.push(pair);

      return this.value = cookies.join('; ');
    }
  });

Testing mocha-headless-chrome

$ npm test

FAQs

Package last updated on 24 Oct 2017

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts