A RetroSearch Logo

Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Search Query:

Showing content from https://nightwatchjs.org/guide/component-testing/testing-angular-components.html below:

Website Navigation


Angular component testing | Developer Guide

Overview

Angular component testing in Nightwatch is available using our official [@nightwatch/angular][1] plugin, It uses the Webpack DevServer under the hood. Requires Nightwatch 2.4+

Installation Step 1.

The @nightwatch/angular plugin can be installed from NPM with:

npm install @nightwatch/angular
Step 2.

Then update your Nightwatch configuration and add the plugin to the list:

nightwatch.conf.js
module.exports = {
  plugins: ['@nightwatch/angular']
}
Write tests

This plugin provides only the mountComponent command which can be used to mount a component in isolation.

.mountComponent(`componentPath`, `[callback]`) Parameters: Name Type Description `componentPath` `string` Location of the component file (`.component`) to be mounted `callback`
Optional `function` An optional callback function which will be called with the component element. Configuration

We’ve designed the @nightwatch/angular plugin to work with sensible configuration defaults, but in some more advanced scenarios you may need to change some of the config options.

- projectRoot

Specify the project root directory where tests are written. By default this is set as the current directory. This can be overridden using the projectRoot property

nightwatch.conf.js
module.exports = {
  '@nightwatch/angular': {
    projectRoot: 'path/to/angular/project' // defaults to current directory
  },
  // other nightwatch settings...
}
- port

The angular plugin uses webpack dev server to compile and render angular components. By default it uses port 5173 to serve the rendered pages. This can be overridden using Nightwatch config.

nightwatch.conf.js
module.exports = {
  'webpack_dev_server': {
    port: 10096 // defaults to 5173
  },
  // other nightwatch settings...
}
Example
const component = await browser.mountComponent('../../../src/components/Form.component')
test/sampleTest.js
it('Test Form Component', async function (browser) {
  const component = await browser.mountComponent('../../../src/components/Form.component');

expect(component).text.to.equal('form-component works!'); });

[1]: https://github.com/nightwatchjs/nightwatch-plugin-angular


RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4