Ember-CLI - error importing model into test

Ember CLI
1

I generated a new app with the latest ember-cli and I’m trying to write an integration test.

In my test setup I want to control the fixtures for a model so I need to do the following…

Foobar.reopenClass({
  FIXTURES: [
    { id: 1, name: 'Widget 1' },
    { id: 2, name: 'Widget 2' }
  ]
});

To get access to Foobar I would think I could do the following:

import Foobar from 'app/models/foobar';

I get a build error:

ENOENT, no such file or directory 'tmp/tree_merger-tmp_dest_dir-fdw7D9kc.tmp/app/models/foobar.js'

Being that I have no ES6 experience, I can only assume what is in that directory is my “load path” for import. If I look under the tmp/tree_merger-tmp_dest_dir-fdw7D9kc.tmp/app directory, I only see the tests directory for my application. None of the actual application files are under there, so I think that’s why I get the build error.

Am I doing it wrong or missing something? Is this a bug in the ember-cli Brocfile?

CC @stefan

2

quirk with the current tree structure (which will be fixed soon), but the encouraged path (which works correctly) is to use

moduleForModel('foobar');

see: Testing Models - Testing - Ember Guides

3

I’m writing integration tests though and I’m not really sure how to incorporate that into what I’m writing…

import startApp from '../helpers/start-app';
import { test, moduleForModel } from 'ember-qunit';

// Need class from this ???
moduleForModel('widget');

var App;

module('Integration: Widgets', {
  setup: function() {
    App = startApp();
  },
  teardown: function() {
    Ember.run(App, 'destroy');
  }
});

test('list widgets', function() {
  // Need to set fixtures here

  visit('/');

  andThen(function() {
    equal(find('.widget').length, 3, "showing 3 widgets");
  });
});

What I ended up doing for now is just looking up the class through the container inside my test…

App.__container__.resolve('model:widget').reopenClass({
  FIXTURES: [
    { id: 1, name: 'Clause 1' },
    { id: 2, name: 'Clause 2' },
    { id: 3, name: 'Clause 3' }
  ]
});

Is there a better way?

1 Like
4

Following your idea, I placed the fixtures inside the module setup function, after App = startApp(); Did anyone find a better way?

import startApp from '../helpers/start-app';
import { test, moduleForModel } from 'ember-qunit';

var App;

module('Integration: spheres', {
    setup: function() {
        App = startApp();
        
        // Fixtures

        App.__container__.resolve('model:sphere').reopenClass({
            FIXTURES: [
                {id: 'sphere1', title: 'sphere 1', description: 'This is the first sphere', type: 'type A', dpos: ['dpo1']},
                {id: 'sphere2', title: 'sphere 2', description: 'This is the second sphere', type: 'type B', dpos: ['dpo2']},
                {id: 'sphere3', title: 'sphere 3', description: 'This is the third sphere', type: 'type C', dpos: ['dpo1', 'dpo2']},
            ]
        });

    },
    teardown: function() {
        Ember.run(App, 'destroy');
    }
});

test('spheres click test', function() {
    visit("/spheres");
    click('a[href="/spheres/sphere3"]');
    andThen(function() {
        equal(currentURL(), '/spheres/sphere3', 'Clicked sphere title and current url is /spheres/sphere3');
    });
});
1 Like