🚀 Big News: Socket Acquires Coana to Bring Reachability Analysis to Every Appsec Team.Learn more

@cucumber/electron

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install
c

@cucumber/electron

Runs cucumber.js in electron

4.1.3
latest
75

Supply Chain Security

100

Vulnerability

94

Quality

78

Maintenance

100

License

Version published
Weekly downloads
583
-39.14%
Maintainers
2
Weekly downloads
 
Created
Issues
9

cucumber-electron

Runs Cucumber.js in an Electron renderer process. Scenarios have direct access to both a browser DOM and node.js libraries, so they are fast and easy to debug interactively.

Build Status

Install

Both Electron and Cucumber.js need to be installed, they are peer dependencies. This gives you the option to choose the version you want to use:

npm install --save-dev electron @cucumber/cucumber @cucumber/electron

Usage

Cucumber-electron is a wrapper around Cucumber.js, supporting the same features and command-line options. You should be able to use it on your project without any changes.

Run cucumber-electron like it was Cucumber.js, for example:

npx cucumber-electron ./features/your.feature:123

API

Cucumber Electron provides an API that you can use in your step definitions or hooks.

App Elements

An app element is a DOM element where you can mount the application or component under test.

const { AppElements } = require('@cucumber/cucumber-electron')

Before(function () {
  this.appElements = new AppElements()
})

Given('{word} has an app element', function (name) {
  const appElement = this.appElements.create(document, name)
  
  // Mount a React Component
  ReactDOM.render(<MyComponent />, appElement)
  
  // Mount a Vue component
  new Vue({ el: appElement })
  
  // Vanilla DOM
  appElement.innerHTML = '<h1>Hello World</h1>'
})

After(function () {
  if (!process.env.CUCUMBER_ELECTRON_KEEP_APP_ELEMENTS) {
    // Destroy all app elements after each scenario
    this.appElements.destroyAll()
  }
})

In interactive debugging mode this will look something like this:

App Elements

See the app-elements example for more details.

You can run it like this:

CUCUMBER_ELECTRON_KEEP_APP_ELEMENTS=1 ./bin/cucumber-electron.js examples/app-elements --interactive

Interactive Debugging

The --interactive (or -i) command line switch shows a browser window with chrome dev tools and keeps the window open after all features have finished running.

The interactive debugger will halt execution on any debugger statements, or breakpoints you have set in chrome dev tools.

In interactive mode you can re-run all your scenarios by pressing CMD-R (MacOS) or CTRL-R (Windows/Linux) while the browser window has focus.

Custom Stylesheet

You can add a custom stylesheet to the DOM with the --stylesheet [PATH] option.

FAQs

Package last updated on 28 Jun 2021

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