All Projects → shellscape → Mocha Chrome

shellscape / Mocha Chrome

Licence: mit
☕️ Run Mocha tests using headless Google Chrome

Programming Languages

javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to Mocha Chrome

Html Pdf Chrome
HTML to PDF converter via Chrome/Chromium
Stars: ✭ 629 (+853.03%)
Mutual labels:  google, chrome, headless, headless-chrome
Theme.sh
A script which lets you set your $terminal theme.
Stars: ✭ 290 (+339.39%)
Mutual labels:  command-line-tool, terminal, command-line
Ed
A modern UNIX ed (line editor) clone written in Go
Stars: ✭ 44 (-33.33%)
Mutual labels:  command-line-tool, terminal, command-line
Google Images Download
Python Script to download hundreds of images from 'Google Images'. It is a ready-to-run code!
Stars: ✭ 7,815 (+11740.91%)
Mutual labels:  command-line-tool, terminal, command-line
Gowitness
🔍 gowitness - a golang, web screenshot utility using Chrome Headless
Stars: ✭ 996 (+1409.09%)
Mutual labels:  chrome, headless, headless-chrome
Zoxide
A smarter cd command. Supports all major shells.
Stars: ✭ 4,422 (+6600%)
Mutual labels:  command-line-tool, terminal, command-line
Jmxterm
Interactive command line JMX client
Stars: ✭ 389 (+489.39%)
Mutual labels:  command-line-tool, terminal, command-line
Sampler
Tool for shell commands execution, visualization and alerting. Configured with a simple YAML file.
Stars: ✭ 9,203 (+13843.94%)
Mutual labels:  command-line-tool, terminal, command-line
Googler
🔍 Google from the terminal
Stars: ✭ 5,594 (+8375.76%)
Mutual labels:  terminal, command-line, google
Sultan
Sultan: Command and Rule over your Shell
Stars: ✭ 625 (+846.97%)
Mutual labels:  command-line-tool, terminal, command-line
Desktoppr
Simple command line tool to set the desktop picture on macOS
Stars: ✭ 127 (+92.42%)
Mutual labels:  command-line-tool, terminal, command-line
Url To Pdf Api
Web page PDF/PNG rendering done right. Self-hosted service for rendering receipts, invoices, or any content.
Stars: ✭ 6,544 (+9815.15%)
Mutual labels:  chrome, headless, headless-chrome
Typin
Declarative framework for interactive CLI applications
Stars: ✭ 126 (+90.91%)
Mutual labels:  command-line-tool, terminal, command-line
Ferrum
Headless Chrome Ruby API
Stars: ✭ 1,009 (+1428.79%)
Mutual labels:  chrome, headless, headless-chrome
Tooling
Advancing Node.js as a framework for writing great tools
Stars: ✭ 98 (+48.48%)
Mutual labels:  command-line-tool, terminal, command-line
Tsukae
🧑‍💻📊 Show off your most used shell commands
Stars: ✭ 345 (+422.73%)
Mutual labels:  command-line-tool, terminal, command-line
Chromeless
🖥 Chrome automation made simple. Runs locally or headless on AWS Lambda.
Stars: ✭ 13,254 (+19981.82%)
Mutual labels:  chrome, headless, headless-chrome
Asciigraph
Go package to make lightweight ASCII line graph ╭┈╯ in command line apps with no other dependencies.
Stars: ✭ 1,805 (+2634.85%)
Mutual labels:  terminal, command-line, command-line-tool
Pychrome
A Python Package for the Google Chrome Dev Protocol [threading base]
Stars: ✭ 469 (+610.61%)
Mutual labels:  chrome, headless, headless-chrome
Cuprite
Headless Chrome/Chromium driver for Capybara
Stars: ✭ 743 (+1025.76%)
Mutual labels:  chrome, headless, headless-chrome

tests size libera manifesto

mocha-chrome

☕️ Run Mocha tests using headless Google Chrome

Requirements

mocha-chrome requires Node v8.0.0 or higher.

mocha-chrome is a development tool, which means you can use tools like NVM and nodenv to manage your installed versions, and temporarily switch to v8+ to run tests on your machine. Most modern CI environments also support specifying the version of Node to run.

Getting Started

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

$ npm install mocha-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;

      // 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-chrome --help

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

  Options
    --chrome-flags              A JSON string representing an array of flags to pass to Chrome
    --chrome-launcher           Chrome launcher options (see https://github.com/GoogleChrome/chrome-launcher#launchopts)
    --ignore-console            Suppress console logging
    --ignore-exceptions         Suppress exceptions logging
    --ignore-resource-errors    Suppress resource error logging
    --log-level                 Specify a log level; trace, debug, info, warn, error
    --mocha                     A JSON string representing a config object to pass to Mocha
    --no-colors                 Disable colors in Mocha's output
    --reporter                  Specify the Mocha reporter to use
    --timeout                   Specify the test startup timeout to use
    --version

  Examples
  $ mocha-chrome test.html --no-colors
  $ mocha-chrome test.html --reporter dot
  $ mocha-chrome test.html --mocha '\{"ui":"tdd"\}'
  $ mocha-chrome test.html --chrome-flags '["--some-flag", "--and-another-one"]'
  $ mocha-chrome test.html --chrome-launcher.maxConnectionRetries=10

Events

mocha-chrome is technically an event emitter. Due to the asynchronous nature of nearly every interaction with headless Chrome, a simple event bus is used to handle actions from the browser. You have access to those events if running mocha-chrome programatically.

Example usage can be found in both test.js and bin/mocha-chrome.

config

Fired to indicate that mocha-chrome should configure mocha.

ended

Fired when all tests have ended.

Parameters

stats : object - A Mocha stats object. eg:

{
  suites: 1,
  tests: 1,
  passes: 1,
  pending: 0,
  failures: 0,
  start: '2017-08-03T02:12:02.007Z',
  end: '2017-08-03T02:12:02.017Z',
  duration: 10
}

ready

Fired to indicate that the mocha script in the client has been loaded.

resourceFailed

Fired when a resource fails to load.

Parameters

data : object - An object containing information about the resource. eg:

{ url, method, reason }

started

Fired when a resource fails to load.

Parameters

tests : number - The number of tests being run.

width

Fired to indicate that mocha-chrome should inform mocha of the width of the current console/terminal.

Limitations

Reporters

Reporters are limited to those which don't use process.stdout.write to manipulate terminal output. eg. spec, xunit, etc. Examples of reporters which don't presently produce expected output formatting include dot and nyan. The cause of this limitation is the lack of a good means to pipe Mocha's built-in stdout.write through the Chrome Devtools Protocol to mocha-chrome.

Third-Party Reporters

Third party reporters are not currently supported, but support is planned. Contribution on that effort is of course welcome.

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('; ');
    }
  });

Continuous Integration

Circle CI

Running on Circle CI requires that Chrome is installed and running in the container your tests are running within. Please refer to this article for details: https://discuss.circleci.com/t/installing-chrome-inside-of-your-docker-container/9067. Alternatively, you can use a pre-built CircleCI image with browsers installed. You'll have to choose a tag with the -browsers suffix from the full tag list.

Travis CI

Please refer to the "Running it all on Travis CI" portion of the guide on Automated testing with Headless Chrome from Google. Though the article primarily addresses Karma, the setup for Travis CI is identical.

As of January 8th, 2018, Travis CI has upgraded from Trusty -> Xenial to address the Meltdown security vulnerability. There are issues with Chrome in Xenial that can currently be worked around with sudo: required. At some point this workaround may be removable. For the near term, please add sudo: required to Travis CI configuration files. See travis-ci/travis-ci#8836. Credit: @smalls.

Testing mocha-chrome

$ npm test

Yep, that's it.

Contributing

We welcome your contributions! Please have a read of CONTRIBUTING.

Attribution

I'd like to thank @nathanboktae for his work on mocha-phantomjs and mocha-phantomjs-core; two projects I've used extensively over the years, and from which the inspiration for this module originates. Many of the nuances of working with mocha in a hosted or connected browser environment were solved within mocha-phantomjs-core and I am personally grateful.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].