Server configuration

Besides defining your routes, there’s some config options for your server available in /app/mirage/config.js. There’s also some environment options, which you define in /config/environment.js.

Server config

# this.namespace

Set the base namespace used for all routes defined with get, post, put or del.

For example,

// app/mirage/config.js
export default function() {

  this.namespace = '/api';

  // this route will handle the URL '/api/contacts'
  this.get('/contacts', 'contacts');
};

Note that only routes defined after this.namespace are affected. This is useful if you have a few one-off routes that you don’t want under your namespace:

// app/mirage/config.js
export default function() {

  // this route handles /auth
  this.get('/auth', function() { /* ... */});

  this.namespace = '/api';
  // this route will handle the URL '/api/contacts'
  this.get('/contacts', 'contacts');
};

# this.timing

Set the timing parameter of the response. Default is a 400ms delay during development and 0 delay in testing (so your tests run fast).

// app/mirage/config.js
export default function() {

  this.timing = 400; // default

};

# this.passthrough(path1, path2…, options)

By default, if your Ember app makes a request that is not defined in your server config, Mirage will throw an error. You can use passthrough to whitelist requests, and allow them to pass through your Mirage server to the actual network layer.

To ignore paths on your current host (as well as configured namespace), use a leading /:

this.passthrough('/addresses');

You can also pass a list of paths, or call passthrough multiple time:

this.passthrough('/addresses', '/contacts');
this.passthrough('/something');
this.passthrough('/else');

These lines will allow all HTTP verbs to pass through. If you want only certain verbs to pass through, pass an array as the last argument with the specified verbs:

this.passthrough('/addresses', ['post']);
this.passthrough('/contacts', '/photos', ['get']);

If you want all requests on the current domain to pass through, simply invoke the method with no arguments:

this.passthrough();

Note again that the current namespace (i.e. any namespace property defined above this call) will be applied.

You can also allow other-origin hosts to passthrough. If you use a fully-qualified domain name, the namespace property will be ignored. Use two * wildcards to match all requests under a path:

this.passthrough('http://api.foo.bar/**');
this.passthrough('http://api.twitter.com/v1/cards/**');

Be aware that currently, passthrough only works with jQuery >= 2.x. See this issue for details.

# this.loadFixtures(file1, file2…)

By default, all the data files under /fixtures will be loaded during testing if you don’t have factories defined, and during development if you don’t have /scenarios/default.js defined. You can use loadFixtures() to also load fixture files in either of these environments, in addition to using factories to seed your database.

server.loadFixtures() loads all the files, and server.loadFixtures(file1, file2...) loads selective fixture files.

For example, in a test you may want to start out with all your fixture data loaded:

test('I can view the photos', function() {
  server.loadFixtures();
  server.createList('photo', 10);

  visit('/');

  andThen(function() {
    equal( find('img').length, 10 );
  });
});

or in development, you may want to load a few reference fixture files, and use factories to define the rest of your data:

// scenarios/default.js
export default function(server) {
  server.loadFixtures('countries', 'states');

  let author = server.create('author');
  server.createList('post', 10, { author_id: author.id });
}

# this.pretender

Mirage uses pretender.js as its xhttp interceptor. In your Mirage config, this.pretender refers to the actual pretender instance, so any config options that work there will work here as well. By default, content returned is json stringified, so you can just return js objects.

Refer to pretender’s docs if you want to change this or any other options on your pretender instance.

# testConfig

Export a named testConfig function to define routes that only apply in your test environment:

// mirage/config.js

export default function() {
  // normal config, shared across development + testing
}

export function testConfig() {
  // test-only config, does not apply to development
}

This could be useful if you’d like use Mirage in testing, but generally proxy to an actual API during development. As you develop, your frontend may be ahead of your API, in which case you’d work with the routes in the default config, and write your tests. Then, once your API implements the new endpoints, you can move the routes to your testConfig, so your tests still run, but Mirage doesn’t interfere during development.

Environment options

# ENV[‘ember-cli-mirage’].enabled

By default, your Mirage server will run in test mode, and in development mode as long as the --proxy option isn’t passed. To change this default behavior, set enabled to either true or false in your ENV config.

For example, to enable in production (e.g. to share a working prototype before your server is ready):

// config/environment.js
...
if (environment === 'production') {
  ENV['ember-cli-mirage'] = {
    enabled: true
  }
}

To disable in development,

// config/environment.js
...
if (environment === 'development') {
  ENV['ember-cli-mirage'] = {
    enabled: false
  }
}