• Stars
    star
    130
  • Rank 267,843 (Top 6 %)
  • Language
    JavaScript
  • License
    Apache License 2.0
  • Created over 9 years ago
  • Updated 10 months ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Mocha helpers for testing Ember.js applications

DEPRECATION WARNING

This package is not actively developed. ember-qunit is a good alternative.

If you use ember-mocha and want to maintain it, please ask in the #help channel on the ember discord.

ember-mocha

Latest NPM release TravisCI Build Status

ember-mocha simplifies testing of Ember applications with Mocha by providing Mocha-specific wrappers around the helpers contained in @ember/test-helpers.

Upgrading from an earlier version? Have a look at our Migration Guide.

Compatibility

  • Ember.js v3.4 or above
  • Ember CLI v2.13 or above
  • Node.js 8 or above

Installation

ember-mocha is an Ember CLI addon, so install it as you would any other addon:

$ ember install ember-mocha

Some other addons are detecting the test framework based on the installed addon names and are expecting ember-cli-mocha instead. If you have issues with this then ember install ember-cli-mocha, which should work exactly the same.

Usage

The following section describes the use of Ember Mocha with the latest modern Ember testing APIs, as laid out in the RFCs 232 and 268.

For the older APIs have a look at our Legacy Guide.

Setting the Application

Your tests/test-helper.js file should look similar to the following, to correctly setup the application required by @ember/test-helpers:

import Application from '../app';
import config from '../config/environment';
import { setApplication } from '@ember/test-helpers';
import { start } from 'ember-mocha';

setApplication(Application.create(config.APP));
start();

Also make sure that you have set ENV.APP.autoboot = false; for the test environment in your config/environment.js.

Setup Tests

The setupTest() function can be used to setup a unit test for any kind of "module/unit" of your application that can be looked up in a container.

It will setup your test context with:

  • this.owner to interact with Ember's Dependency Injection system
  • this.set(), this.setProperties(), this.get(), and this.getProperties()
  • this.pauseTest() method to allow easy pausing/resuming of tests

For example, the following is a unit test for the SidebarController:

import { expect } from 'chai';
import { describe, it } from 'mocha';
import { setupTest } from 'ember-mocha';

describe('SidebarController', function() {
  setupTest();

  // Replace this with your real tests.
  it('exists', function() {
    let controller = this.owner.lookup('controller:sidebar');
    expect(controller).to.be.ok;
  });
});

If you find that test helpers from other addons want you to pass a hooks object you can do so like this:

let hooks = setupTest();
setupMirage(hooks);

This will make sure that in functions passed to hooks.afterEach() the this.owner and other things that setupTest() sets up are still available. Mocha itself runs afterEach hooks in a different order than QUnit, which is why this "workaround" is sometimes needed.

Setup Rendering Tests

The setupRenderingTest() function is specifically designed for tests that render arbitrary templates, including components and helpers.

It will setup your test context the same way as setupTest(), and additionally:

  • Initializes Ember's renderer to be used with the Rendering helpers, specifically render()
  • Adds this.element to your test context which returns the DOM element representing the wrapper around the elements that were rendered via render()
  • sets up the DOM Interaction Helpers from @ember/test-helpers (click(), fillIn(), ...)
import { expect } from 'chai';
import { describe, it } from 'mocha';
import { setupRenderingTest } from 'ember-mocha';
import { render } from '@ember/test-helpers';
import hbs from 'htmlbars-inline-precompile';

describe('GravatarImageComponent', function() {
  setupRenderingTest();

  it('renders', async function() {
    await render(hbs`{{gravatar-image}}`);
    expect(this.element.querySelector('img')).to.exist;
  });
});

Setup Application Tests

The setupApplicationTest() function can be used to run tests that interact with the whole application, so in most cases acceptance tests.

On top of setupTest() it will:

import { expect } from 'chai';
import { describe, it } from 'mocha';
import { setupApplicationTest } from 'ember-mocha';
import { visit, currentURL } from '@ember/test-helpers';

describe('basic acceptance test', function() {
  setupApplicationTest();

  it('can visit /', async function() {
    await visit('/');
    expect(currentURL()).to.equal('/');
  });
});

Upgrading

For instructions how to upgrade your test suite please read our Migration Guide.

Contributing

Contributions are welcome. Please follow the instructions below to install and test this library.

Installation

npm install

Testing

In order to test in the browser:

npm start

... and then visit http://localhost:4200/tests.

In order to perform a CI test:

npm test

Copyright and License

Copyright 2014 Switchfly

This product includes software developed at Switchfly (http://www.switchfly.com).

NOTICE: Only our own original work is licensed under the terms of the Apache License Version 2.0. The licenses of some libraries might impose different redistribution or general licensing terms than those stated in the Apache License. Users and redistributors are hereby requested to verify these conditions and agree upon them.

More Repositories

1

ember.js

Ember.js - A JavaScript framework for creating ambitious web applications
JavaScript
22,427
star
2

data

A lightweight reactive data library for javascript applications. Designed over composable primitives.
JavaScript
3,036
star
3

ember-rails

Ember for Rails 3.1+
Ruby
1,363
star
4

ember-inspector

Adds an Ember tab to the browser's Developer Tools that allows you to inspect Ember objects in your application.
JavaScript
976
star
5

rfcs

RFCs for changes to Ember
793
star
6

website

Source for emberjs.com
HTML
642
star
7

list-view

An incremental rendering list view for Ember.js
JavaScript
465
star
8

starter-kit

A starter kit for Ember
JavaScript
373
star
9

guides

This repository is DEPRECATED!
CSS
283
star
10

ember-qunit

QUnit test helpers for Ember
JavaScript
260
star
11

ember-test-helpers

Test-framework-agnostic helpers for testing Ember.js applications
JavaScript
189
star
12

ember-cli-babel

Ember CLI plugin for Babel
JavaScript
153
star
13

core-notes

Meeting minutes from the Ember.js core teams
151
star
14

ember-inflector

ember-inflector goal is to be rails compatible.
JavaScript
107
star
15

group-helper

An experimental helper to change the granularity of bindings.
JavaScript
87
star
16

ember-render-modifiers

Implements did-insert / did-update / will-destroy modifiers for emberjs/rfcs#415
JavaScript
82
star
17

ember-states

JavaScript
52
star
18

ember-gem

Development tools for Ember.js
JavaScript
40
star
19

ember-optional-features

JavaScript
40
star
20

ember-dev

Development Tools for Ember Packages
JavaScript
40
star
21

emberjs.github.com

Ember.js Website - DO NOT OPEN ISSUES/PRs HERE!!! Please send them to https://github.com/emberjs/website instead.
HTML
34
star
22

ember-test-waiters

An Ember addon to allow @ember/test-helpers to manage asynchronous operations
TypeScript
27
star
23

quickstart-code-sample

Code samples from the quickstart guide
CSS
22
star
24

ember-legacy-views

Extended support for Ember.View and friends until Ember 2.4
JavaScript
18
star
25

ember-jquery

JavaScript
15
star
26

rfc-tracking

This project is no longer maintained
12
star
27

log-manager

Hierarchical Logging + multiple appenders -- Basis for Ember.js logging
JavaScript
12
star
28

ember-classic-decorator

JavaScript
12
star
29

emberjs-build

Build pipeline for Ember.js
JavaScript
12
star
30

ember-data-fixture-adapter

JavaScript
11
star
31

babel-plugin-ember-template-compilation

Babel implementation of Ember's low-level template-compilation API
TypeScript
9
star
32

ember-legacy-controllers

JavaScript
8
star
33

ember-octanify

JavaScript
8
star
34

ember-2-legacy

JavaScript
8
star
35

ember-module-unification-blueprint

Ember CLI blueprint for initializing a Ember application with a module unification layout.
JavaScript
7
star
36

ember-string

Ember addon with String-related utilities
JavaScript
6
star
37

ember-legacy-built-in-components

TypeScript
5
star
38

ember-debug

JavaScript
5
star
39

ember-copy

JavaScript
4
star
40

ember-edition-utils

JavaScript
4
star
41

whiteboard

For experimental design projects, efforts, proposals, etc.
4
star
42

guides.emberjs.com

A repo to contain versioned guides
HTML
3
star
43

ember-ordered-set

JavaScript
3
star
44

eslint-plugin-ember-internal

ESLint rules used internally by Ember.js
JavaScript
2
star
45

ember-mocha-builds

Dist repo for ember-mocha
JavaScript
1
star
46

tracking-polaris

Repo for tracking Polaris project
1
star
47

ember

The Ember.js npm module
JavaScript
1
star
48

testem-failure-only-reporter

A testem reporter that only outputs failures
JavaScript
1
star