pistolet-angular

Angular integration for Pistolet

Usage no npm install needed!

<script type="module">
  import pistoletAngular from 'https://cdn.skypack.dev/pistolet-angular';
</script>

README

Pistolet Angular Plugin

Build Status npm version lerna

This plugin will mock Angular's HttpClient during Angular unit tests.

Installation & Configuration

$ npm install pistolet-angular --save-dev

In src/test.ts, add the following lines:

import { setConfig } from 'pistolet';
import { AngularBackend } from 'pistolet-angular';

beforeAll(() => setConfig({
  backend: AngularBackend,
  dir: '',
}));

Unit tests

In addition to normal usage, you need to provide Pistolet's HttpClientModule:

TestBed.configureTestingModule({
  imports: [ 
    HttpClientModule,
  ],
});

A full example is available here.

(!) Known issue with JSON Scenarios

Unfortunately, there are compatibility issues between JSON files and the way Webpack works for Angular.
As such, JSON scenarios need to be manually loaded in order to work:

new Pistolet([ require('src/scenarios/sampleGet.json') ]);

Instead of the regular syntax:

new Pistolet([ 'src/scenarios/sampleGet.json' ]);

Protractor e2e tests

pistolet-express is required for Angular e2e tests.

Ensure the following options are present in protractor.conf.js:

exports.config = {
  restartBrowserBetweenTests: true,
  SELENIUM_PROMISE_MANAGER: false,
  onPrepare() {
    require('pistolet').setConfig({
      backend: require('pistolet-express').ExpressBackend,
      port: 8080,
      dir: require('path').resolve(__dirname, 'scenarios'),
    });
  },
};

(!) Known issue with Selenium's ControlFlow

As of now, Pistolet is not compatible with Selenium's ControlFlow, which is why it is disabled in the example above.

Alternatively, here is a workaround:

// Below require('pistolet').setConfig(/* ... */);
const { browser } = require('protractor');
const _requestMade = require('pistolet').Pistolet.prototype.requestsMade;
require('pistolet').Pistolet.prototype.requestsMade = function () {
  return browser.controlFlow().execute(() => _requestMade.apply(this));
};