You cannot use the same root element (#ember-testing) multiple times in an Ember.Application

[nathanpalmer]

We started getting this on the build server after 0.3.2 was published. Traced it back to ember-qunit and a downgrade to 0.3.1 which got our tests running successfully again. Here is the log

ok 8 PhantomJS 1.9 - JSHint - .: test-helper.js should pass jshint
not ok 9 PhantomJS 1.9 - AddressDisplayComponent: it renders

---
actual: >
null
message: >
TypeError: Requested keys of a value that is not an object.
Log: >
...
not ok 10 PhantomJS 1.9 - AddressDropdownComponent: it renders

---
actual: >
null
message: >
Error: Assertion Failed: You cannot use the same root element (#ember-testing) multiple times in an Ember.Application
Log: >
...
not ok 11 PhantomJS 1.9 - BackerTotalsComponent: it renders

---
actual: >
null
message: >
Error: Assertion Failed: You cannot use the same root element (#ember-testing) multiple times in an Ember.Application
Log: >
...
not ok 12 PhantomJS 1.9 - ConfirmProductComponent: it renders

---
actual: >
null
message: >
Error: Assertion Failed: You cannot use the same root element (#ember-testing) multiple times in an Ember.Application
Log: >
...
not ok 13 PhantomJS 1.9 - InputRegexComponent: it renders

---
actual: >
null
message: >
Error: Assertion Failed: You cannot use the same root element (#ember-testing) multiple times in an Ember.Application
Log: >

I'm not familiar enough with the changes in 0.3.2 to pinpoint the issue. I see some stuff was added for Glimmer (we're on Ember 1.11.3)

[alexlafroscia]

I think I'm seeing this too, it just started recently but I am getting this error all over the place.

[elidupuis]

Hitting this too. Tried switching versions but couldn't get rid of the errors ;(

Just noticed Phantom 2.0 is out... could that help?

[alexlafroscia]

@elidupuis I've been using Phantom 2.0 and I'm still seeing the problems.

[alvinvogelzang]

Same issue. Does anyone have a solution for this already?

[nathanpalmer]

@alvinvogelzang I downgraded to 0.3.13 and the errors went away (make sure to clear tmp/node_modules and install again)

[cgrayADC]

Still having this issue on Ember 1.13.4. Anyone able to solve this or do we need to stay on Ember 1.13.3 for now?

Edit: Just for more info the Ember-QUnit version I am using is 0.4.1

[mydea]

I also have this issue. I made a fresh install with:

bower.json:

"ember": "1.13.5",
"ember-qunit": "0.4.1",
"ember-qunit-notifications": "0.0.7",
"qunit": "~1.17.1",

package.json:

"ember-cli": "1.13.1",
"ember-cli-qunit": "0.3.15",

And I always get "Assertion Failed: You cannot use the same root element (#ember-testing) multiple times in an Ember.Application". I have exactly one integration test (apart from the jshint-tests):

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

var App;

moduleForComponent('list-item', 'Integration | Component | list item', {
    integration: true,
    beforeEach: function () {
        App = startApp();
    },
    afterEach: function () {
        Ember.run(App, 'destroy');
    }
});

test('it renders', function (assert) {
    assert.expect(1);
    visit("/");
    assert.ok(true);
});

[thec0keman]

@mydea I think the issue here is you are mixing the component integration test format with the acceptance test format. Does this work if you remove integration: true and change this to a moduleFor instead of moduleForComponent?

[QVongoc]

Same issue. My tests were fine with ember 1.12 and ember-qunit 0.4.1. But when i upgrade to ember 1.13.10, my test cases can not run anymore. Do we have any solution? I have tried to downgrade to 0.3.1 but that can not help me.

[rwjblue]

Can someone please provide a reproduction so that we have a chance of tracking this down?

[turboMaCk]

@QVongoc Is it possible that there are some dependencies missing in index.html for tests? Like analytics or bugtracking stuff or anything you are loading to app/index.html?

[turboMaCk]

@rwjblue It looks like this is caused by async stuff in my initializers. I'm experimenting with this addon: https://github.com/minutebase/ember-inject-script. I think it might be race condition – test finish and then promise in initializer is resolved. Another error which I had sometimes is called set on destroyed object. Probably race condition between test app live cycle and some other (async) stuff I hope. Does it make sense? Otherwise I can try to reproduce it in clean app.

[ef4]

Last I looked, ember-qunit doesn't actually do anything with promises returned from setup/teardown hooks. That may explain your race. You can use assert.async instead.

[hjdivad]

FWIW these symptoms exactly match those that I experienced when initially upgrading ember from 1.12 to 1.13. My issue stemmed from having integration: true set for tests that were written with ember-test-helpers v0.4.3 which had significantly different semantics for integration tests.

You may want to convert your component integration tests to the new style. This means changing things like

test("this thing works!", function () {
  var component = this.subject();
  this.render();

  equal(component.$('span.something').text(), 'some kinda text');
})

to something more like

test("this thing works!", function () {
  this.render(hbs`{{my-component}}`)

  equal(this.$('span.something').text(), 'some kinda text');
})

To avoid having to do this for all your tests at once, and especially to avoid having to do this for tests that might be difficult to convert, you could try checking out emberjs/ember-test-helpers#115 which adds support for integration: "legacy" to get you back to the old semantics, specifically to help with upgrading.

[hjdivad]

For those who want to try out integration: "legacy" before the PR is in you can update your bower.json with

  "ember-qunit": "hjdivad/ember-qunit#use-integration-legacy-fork",

[nicholasjstock]

I was having this issue when using phantomjs 1.9 but not when using phantomjs 2.0. I added a polyfill for bind that doesnt exist in phantomjs 1.9 and that resolved my issue.

[juliankmazo]

Any news on this?
I'm having this issue when I run all my tests.
When I run the integrations test isolated, they pass. But when I run all of them, they fail with this error.

[jelhan]

niccholasjstock (https://github.com/rwjblue/ember-qunit/issues/168#issuecomment-158085991) is right. Faced same issue running phantomjs 1.9.8. After update to 2.1.1 tests passes again.

[bargar]

Another way to hit this that just bit me: I had a typo in one acceptance test that I had converted from an initial pass at it as a component test. This made all tests in the affected module hang after running otherwise more or less successfully, blowing up the rest of the test suite.

Specifically, I was inadvertently using QUnit module instead of APP/tests/helpers/module-for-acceptance.

BAD

import { test, module } from 'qunit';
module('Acceptance | student/baseline/setup', {
...

GOOD

import { test } from 'qunit';
import moduleForAcceptance from APP/tests/helpers/module-for-acceptance';
moduleForAcceptance('Acceptance | student/baseline/setup', {
...

Incredibly obvious in hindsight, but this was a big test with lots going on and hopefully my pain will help avoid someone else's...

[jamesarosen]

I get this on phantomjs 1.9.8 when using moduleForComponent with ember-cli 2.10.0 and ember-cli-qunit 3.0.4.

When I tried upgrading from phantomjs 1.9.8 to 2.1.1, I instead got this problem:

Global error: Error: Could not find module ember-metal/core required by: ember-testing at http://localhost:7357/assets/test-support.js, line 63

[Turbo87]

closing due to inactivity

[ef4]

To future visitor who land here from Google: this is an old thread with out-of-date advice. For example, in modern Ember you're supposed to use module directly from QUnit, even though this thread calls that bad.

There are several reasons you might see "you cannot use the same root element" errors, mostly around broken tests leaving part of an application around to conflict with the next test.

[txm]

@ef4 are you aware of any blogs/docs (codemods?) etc further detailing causes with ember 3? FWIW I'm bumping from ember 2.18.

[jelhan]

@txm This is most likely caused by missing ENV.APP.autoboot = false; for test environment in config/environment.js. Have a look at #309 for details.

[txm]

Thanks @jelhan that's already set, I'll keep hunting.

[txm]

Ah ha thanks, test-support/helpers/start-app.js attributes.autoboot = true; // <------ true here.

Still the same num of test failing, but at least I can see for sure now that they are unhandled promise rejections.