npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

erik

v3.1.0

Published

Start running your client `Jasmine` tests headlessly with Headless Chrome and `gulp` today.

Downloads

69

Readme

Erik

Start running your client Jasmine tests headlessly with Headless Chrome and gulp today.

When should I use Erik?

You should use Erik when you have a suite of client Jasmine tests that you currently run by opening a SpecRunner.html file but would prefer to run headlessly via a gulp task.

Erik utilizes Karma to run your Jasmine tests with Headless Chrome.

It abstracts away Karma's details and configuration so that you can begin running your tests with Headless Chrome quickly and easily.

Simply adapt the below example configuration for your use.

Installation

$ npm install -D erik

or

$ npm install --save-dev erik

Can I use this with my CI platform?

Yes! Erik's exit code is determined by the outcome of your test suite, so integration with your CI platform should be easy.

Notes on our assumed configuration (or, "How we make it easy for you")

Fetching remote dependencies

We use gulp-remote-src to fetch the remote dependencies that currently live in your SpecRunner.html script tags.

No Karma-configured pre-processing

If you're like us, you already have gulp tasks for bundling (and perhaps transpiling) your test suite along with its dependencies. It's easier to keep that configuration and simply pass the path of your bundled, transpiled test suite than it is to duplicate that configuration with Karma preprocessing. Additionally, we've disabled Karma's default preprocessing of coffeescript files.

The mocha reporter

Karma's default progress reporter isn't quite as nice as the report shown by Jasmine. Erik uses karma-mocha-reporter so that you can see a similar, friendly, hierarchical overview of your specs as they complete.

Example usage

(in your gulpfile)

const SHOULD_WATCH = !!argv.watch;

// Creating an `Erik` object registers several tasks with gulp (all prefixed with 'erik-').
new Erik({
  // The gulp instance with which to register Erik's tasks.
  gulp,

  /**
   * When watch is set, Erik will watch for changes to your local dependencies and re-run the test
   * suite when changes occur.
   */
  watch: SHOULD_WATCH,

  /**
   * Names of tasks to be run before any Erik processing is done. Useful for registering your
   * spec-building/processing tasks as dependencies of Erik's testing task. These tasks will be run
   * in serial as passed.
   */
  taskDependencies: [
    'build-spec-bundle',
    'bower'
  ],

  /**
   * Local dependencies to be bundled alongside your remote dependencies. Glob strings. Order is
   * respected here - make sure to include any dependencies before your specs.
   */
  localDependencies: [
    'public/build-lib.js',
    'public/lib/ext/**/*',

    // Include your specs here. Make sure that they are bundled as an IIFE.
    'spec/client/tests.js',
  ],

  /**
   * URLs corresponding to remote dependencies.
   */
  remoteDependencies: [
    'https://cdn.jsdelivr.net/g/[email protected]',
    'https://cdn.jsdelivr.net/g/[email protected]',
    'https://cdn.jsdelivr.net/g/[email protected]',
  ],

  /**
   * This configuration is not passed directly into Karma but rather is processed by Erik. Only
   * `port` is supported at this time.
   */
  karmaConfig: {
    /**
     * Port on which to run the Karma server. Defaults to 9876.
     */
    port: 1337
  },

  // Base path to use for Erik's bundled files. A directory named `.erik` will be created here.
  bundlePath: 'spec/client'
});

// Optionally configure Gulp to watch for spec changes.
gulp.on('task_start', function(e) {
  if (e.task === 'erik') {
    if (SHOULD_WATCH) {
      console.log('Watching tests…');
      gulp.watch(TEST_FILES, ['build-spec-bundle']);
    }
  }
});

Run your test suite!

$ gulp erik [--watch]

Testing on other browsers

Should you desire to use a browser other than Headless Chrome, you can do so by providing a browsers array in the karmaConfig object. Note that you'll need to install the appropriate browser plugins for Karma.

new Erik({
  gulp,
  
  ...
  
  karmaConfig: {
    port: 1337,
    browsers: ['Chrome', 'Firefox']
  }
});

Contributing

We welcome pull requests! Please lint your code using the JSHint configuration in this project.

Release history

  • 3.1.0 Add support for the customLaunchers Karma field
  • 3.0.0 Fail on empty test suites.
  • 2.0.0 Replace PhantomJS with Headless Chrome.
  • 1.2.1 Allow browser configuration by browsers array.
  • 1.2.0 Work around Karma bug to support console.log output among test cases as they run.
  • 1.1.2 Don't fail when the test suite run is empty.
  • 1.1.1 Documentation updates. Require non-empty options.localDependencies argument.
  • 1.1.0 Re-run specs on any local dependency changes. Wrap options.bundledSpecPath into options.localDependencies, deprecating options.bundledSpecPath.
  • 1.0.3 Don't specify exact dependency versions.
  • 1.0.2 Add event-based watch example.
  • 1.0.1 Move dependencies to be non-dev dependencies.
  • 1.0.0 Initial release.

Etymology

Erik is the name of the Phantom in Phantom of the Opera :D. This library used to use PhantomJS instead of Headless Chrome.