• Stars
    star
    130
  • Rank 277,575 (Top 6 %)
  • Language
    JavaScript
  • License
    Apache License 2.0
  • Created about 10 years ago
  • Updated over 1 year 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,457
star
2

data

A lightweight reactive data library for web applications. Designed over composable primitives.
TypeScript
3,032
star
3

ember-rails

Ember for Rails 3.1+
Ruby
1,359
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
966
star
5

rfcs

RFCs for changes to Ember
792
star
6

website

Source for emberjs.com
HTML
647
star
7

list-view

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

starter-kit

A starter kit for Ember
JavaScript
370
star
9

guides

This repository is DEPRECATED!
CSS
283
star
10

ember-qunit

QUnit test helpers for Ember
JavaScript
261
star
11

ember-test-helpers

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

ember-cli-babel

Ember CLI plugin for Babel
JavaScript
153
star
13

core-notes

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

ember-inflector

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

group-helper

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

ember-render-modifiers

Implements did-insert / did-update / will-destroy modifiers for emberjs/rfcs#415
JavaScript
85
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
29
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
16
star
26

log-manager

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

ember-classic-decorator

JavaScript
12
star
28

emberjs-build

Build pipeline for Ember.js
JavaScript
12
star
29

rfc-tracking

This project is no longer maintained
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
TypeScript
6
star
37

ember-legacy-built-in-components

TypeScript
5
star
38

ember-debug

JavaScript
5
star
39

ember-edition-utils

JavaScript
5
star
40

ember-copy

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
49

ember-map-polyfill

JavaScript
1
star