[Missing information - dialog] ember-wormhole failed to render into '#paper-wormhole'

[Juraci]

While creating a integration test for a dialog that was wrapped by my own component I got this error:

Error: ember-wormhole failed to render into '#paper-wormhole' because the element is not in the DOM

Could not find any issue or documentation on why this was happening for the Dialog component in particular.

By reading these tests I learned that for the Dialog tests to work properly I need to manually add this element <div id="paper-wormhole"></div> to my component test. Then it started to work fine.

Would be nice to have a place in the documentation with those special cases, something like "tips and tricks". I'm adding this issue hoping to help anyone that might have stumbled on the same problem.

[miguelcobain]

@Juraci We do have a cookbook section, that I think fits this info: http://miguelcobain.github.io/ember-paper/release-1/#/cookbook

[Juraci]

Nice I will work on a PR for that.

[miguelcobain]

We now wormhole to a special container if on testing, so this shouldn't be an issue anymore.

Relevant commit:
26fd088

[kltdwrds]

@miguelcobain I'm running an ember acceptance test that attempts to render the dialog on a click event:

  test('can archive an order', async function (assert) {
    await click('[data-test-target="action-additional-menu"]');
    await click('[data-test-target="action-archive-order"] button');
...
}

The render fails:
ember-wormhole failed to render into '#paper-wormhole' because the element is not in the DOM

ember-cli 3.1.1
ember-paper ^1.0.0-beta.4

[Subtletree]

@kltdwrds Not 100% sure but this PR might fix that: #915

You could also try adding this to your package.json until ember-paper either merges that PR or pins to the versions below:

"ember-basic-dropdown": "^0.33.1",
"ember-power-select": "^1.8.5",