My Ember app injects an "i18n" object into the container via an initializer, which is later looked up with "this.container.lookup('i18n:main')" in a controller 'preferredLanguage' computed property.
A mocha unit test which tests the controller 'preferredLanguage' property, fails due to "i18n is not defined". How can I set up the mocha tests to run Ember application initializers so injected objects are defined when looked up from the container during unit testing?
I've found that the main issue is (as you mentioned) is that the start-app.js file doesn't run when mocha is installed. I battled this for a while as well but have finally refined the process to get Ember and Mocha to play nicely. First you have to get ember-cli-mocha and ember-mocha setup correctly. Then you can explicitly import and invoke the startApp function in your tests/test-helper.js file to have Ember run and inject test helpers like it normally does with qunit. Here is what has worked for me with ember-cli 1.13.1.
bower install ember-mocha
bower install ember-test-helpers
npm install ember-cli-mocha
ember install ember-cli-mocha (say Y to overwrite test-helper.js)
Then in tests/test-helper.js
// tests/test-helper.js
import resolver from './helpers/resolver';
import { setResolver } from 'ember-mocha';
// startApp doesn't run with mocha... so we run it explicitly
import startApp from "./helpers/start-app";
startApp();
setResolver(resolver);
After that you can create generate a route or controller and ember-cli-mocha will create test and you should have access to helpers like visit() and currentURL(); Though I found you need to actually setup the route and controller for those to work correctly.
it("should have use of ember's test helpers", function() {
visit("/mocha-test");
andThen(function() {
var url = currentURL();
expect(url).to.equal("/mocha-test");
});
});
Related
In a new ember 3.28 addon project:
npm install chart.js --save
ember g component-class chart
Insert <Chart /> into application.hbs on dummy app and in addons/component/chart.js, add this
import Chart from 'chart.js/auto';
Running app gives:
Uncaught Error: Could not find module `chart.js/auto` imported from `chartjs-test/components/chart`
Yet if the import Chart goes into the application.js route in the dummy app instead, it works. How can you import this module correctly from within an addon component?
Update: Same issue with other installed packages eg. import chroma from "chroma";
Turns out you need to add the same import statement into app/component/chart.js:
UPDATE:
The above isn't the proper way and causes issues when using the addon elsewhere. The real solution is to move ember-auto-import to dependencies from devDependencies in package.json of the addon
Im trying to create an Ember Addon that uses the blueprint afterInstall hook.
I have read https://cli.emberjs.com/release/writing-addons/addon-blueprints/
My addon is called hello-world.
I generated my addon blueprint by ember generate blueprint hello-world.
I have now a blueprint/hello-world/index.js file.
'use strict';
module.exports = {
description: 'This is my blueprint',
afterInstall(options) {
console.log('hello');
return this.addPackagesToProject([
{ name: 'lodash' }
]);
}
};
How could I test the the afterInstall hook is called?
My Ember Addon is in development (and has not been published), I have tried using npm link in my Ember Addon directory and npm link hello-world in my Ember app. This creates a symlink in my Ember App node_modules to point to my hello-world Ember Addon but it does not trigger the afterInstall hook.
My Ember App package.json does not get an entry for lodash in dependencies or devDependencies.
Part of my Ember App package.json
"devDependencies": {
...
"hello-world": "*"
...
}
Running npm install --offline does not seem to trigger the blueprint hook.
Ember addons are typically installed with the command ember install addon_name. This function essentially is the composite of:
npm install addon_name
ember generate addon_name
So after you npm link your addon, go into the consuming project and generate your addon's default blueprint with ember generate addon_name
I have Ember.js 2.16 acceptance tests written using the Ember template test libraries (QUnit and testem) that test the general functionality of an Ember app. When I run ember test, the 'environment' for which environment variables are retrieved is always set to test.
Is there a way to run ember test with any environment other than test? Running it with --environment="my_other_test_env" doesn't change the environment as it would for ember build or ember serve.
I’d like to be able to pass parameters to acceptance tests depending on what environment they are running in. Is this behavior supported, and if not, is there a reason I shouldn't be doing this? I understand that for lower-level unit testing, I shouldn't be dealing with external dependencies, but for end-to-end acceptance testing, it seems normal that there would be different environments I would want to run the tests in.
You could use your own environment variable:
Run with TEST_ENV=...
$ TEST_ENV=special ember test
Add it to your app configuration:
// config/environment.js
if (environment === 'test') {
ENV.testingEnvironment = process.env.TEST_ENV;
...
}
And use it in your acceptance test like:
import ENV from '../../config/environment';
alert(ENV.testingEnvironment); // outputs 'special'
I'm using similar way to deploy a production build to a staging environment, but only changing some api endpoints in the configuration.
How do you need to work in an Ember addon, to include bower packages while installing the addon.
1) I installed the bower package I want to include in my addon with bower instal packagename --save
2) then in my addon, in the root, edited index.js, to look like this:
/* jshint node: true */
'use strict';
module.exports = {
name: 'my-ember-component',
included: function(app) {
this._super.included(app);
if(app.import){
app.import(app.bowerDirectory + '/path-to-package/package.js');
}
}
};
However, when I try to start my application where the addon is installed, I get a
ENOENT: no such file or directory, stat '/my-ember-application/tmp/source_map_concat-input_base_path-bWTPoVC9.tmp/0/bower_components/path-to-package/package.js
I want to avoid having to manually add the bower dependency to every application I install my addon in.
Note: I am using npm link to debug my addon, perhaps this could be a source of the problem?
Normally the addon's bower componenets are added to the consuming project during ember install addon.
But since you're doing local development and using npm link. You need to simulate this. You can do this with:
ember generate your-addon-name
Explanation.
Check out the docs on default blueprints in the ember cli docs.
A blueprint with the same name as the addon (unless explicitly
changed, see above) will be automatically run after install (in
development, it must be manually run after linking). This is where you
can tie your addon’s bower dependencies into the client app so that
they actually get installed.
In short, you need to create a default blueprint for your app and add the bower dependency there.
Create your file:
//blueprints/your-addon-name/index.js
module.exports = {
normalizeEntityName: function() {}, // no-op since we're just adding dependencies
afterInstall: function() {
return this.addBowerPackageToProject('BOWER PACKAGE NAME'); // is a promise
}
};
Then when you run the default blueprint with
ember generate your-addon-name
I'm new to Ember, and I'd like to get a simple project up and running, and have some integration tests running in chrome.
I bought the book "Developing an Ember.js Edge" where they create the application ember-trackr but as all things in the JS world move fast, details seem to have changed.
If I:
git clone https://github.com/developing-an-emberjs-edge/ember-trackr
cd ember-trackr
testem
I get an error:
Error running before_tests hook
┃
┃before_tests hook: "ember build -c"
┃version: 0.0.41
┃You have to be inside an ember-cli project in order to use the build command.
I'm not sure but I think the steps in http://emberjs.com/guides/testing/integration/ are already taken care of when using
ember new <appname>
So, if I create a new app and run testem:
ember new testem-test
cd testem-test
testem
I see the 'waiting for runners' message in the console and chrome launces.
Now if I try to add a trivial test (say, to check the page content for some text - copied from http://www.ember-cli.com/#testing) as tests/test1.js:
import Ember from "ember";
import { test } from 'ember-qunit';
import startApp from 'helpers/start-app';
var App;
module('An Integration test', {
setup: function() {
App = startApp();
},
teardown: function() {
Ember.run(App, App.destroy);
}
});
test("Page contents", function() {
expect(2);
visit('/foos').then(function() {
equal(find('.foos-list').length, 1, "Page contains list of models");
equal(find('.foos-list .foo-item').length, 5, "List contains expected number of models");
});
});
If I run 'testem', I just get the waiting for runners message.
If I run 'ember test' I get:
~/IdeaProjects/spike/testem-test (master) $ ember test
version: 0.0.41
Build failed.
ENOENT, no such file or directory '/Users/paul/IdeaProjects/spike/testem-test/tmp/tree_merger-tmp_dest_dir-2QJNmsEl.tmp/helpers/start-app.js'
File: helpers/start-app.js
Does anyone have any clues as to what I'm missing?
Also, if it hasn't been done already, it would be nice to keep the ember-trackr sample app up to date with ember-cli so it runs out of the box - I'd be happy to contribute if I can figure out what its missing...
Thanks.
For the first part of your problem, yes ember-cli has changed, and you have to migrate that project. I would do that for 100 bounty.
For the second part, you don't have to create a test from scratch:
run ember generate acceptance-test test1 and it will do the boilerplate for you.
the specific error message can be fixed by updating this line:
import startApp from '../helpers/start-app';