diff --git a/packages/toast-message/addon-test-support/initialize.js b/packages/toast-message/addon-test-support/initialize.js new file mode 100644 index 00000000..56646e87 --- /dev/null +++ b/packages/toast-message/addon-test-support/initialize.js @@ -0,0 +1,3 @@ +import FlashObject from 'ember-cli-flash/flash/object'; + +FlashObject.reopen({ init() {} }); diff --git a/packages/toast-message/addon/styles/components/_nucleus-toast-message.scss b/packages/toast-message/addon/styles/components/_nucleus-toast-message.scss index 57e8223d..3f8fa2b8 100644 --- a/packages/toast-message/addon/styles/components/_nucleus-toast-message.scss +++ b/packages/toast-message/addon/styles/components/_nucleus-toast-message.scss @@ -46,6 +46,10 @@ padding-right: 16px; flex-grow: 2; + .title { + margin: 0; + } + .link { color: $text-info; } diff --git a/packages/toast-message/addon/templates/components/nucleus-toast-message.hbs b/packages/toast-message/addon/templates/components/nucleus-toast-message.hbs index 182f5548..a97fda16 100644 --- a/packages/toast-message/addon/templates/components/nucleus-toast-message.hbs +++ b/packages/toast-message/addon/templates/components/nucleus-toast-message.hbs @@ -1,30 +1,28 @@ -{{#ember-wormhole to="nucleus-toast-messages-wormhole"}} -
- {{#each flashMessages.queue as |flash|}} - {{#transition-group transitionClass="slide-down"}} - {{#flash-message flash=flash class="nucleus-toast-message" as |component flash close|}} -
{{nucleus-icon name=(get _iconMap component.flashType) size="medium"}}
-
-

{{flash.message}}

- {{#if flash.content}} - - {{flash.content.linkText}} - - {{/if}} -
-
- {{nucleus-button - variant="text" - size="mini" - customClass=(concat "flash-message-close") - icon="nucleus-cross" - onClick=(action close)}} -
- {{/flash-message}} - {{/transition-group}} - {{/each}} -
-{{/ember-wormhole}} +
+ {{#each flashMessages.queue as |flash|}} + {{#transition-group transitionClass="slide-down"}} + {{#flash-message flash=flash class="nucleus-toast-message" as |component flash close|}} +
{{nucleus-icon name=(get _iconMap component.flashType) size="medium"}}
+
+

{{flash.message}}

+ {{#if flash.content}} + + {{flash.content.linkText}} + + {{/if}} +
+
+ {{nucleus-button + variant="text" + size="mini" + customClass=(concat "flash-message-close") + icon="nucleus-cross" + onClick=(action close)}} +
+ {{/flash-message}} + {{/transition-group}} + {{/each}} +
diff --git a/packages/toast-message/ember-backstop/backstop_data/bitmaps_reference/ember-backstoptest_Integration__Component__nucleus-toast-message__it_passes_visual_regression_tests__assert0_0_document_0_webview.png b/packages/toast-message/ember-backstop/backstop_data/bitmaps_reference/ember-backstoptest_Integration__Component__nucleus-toast-message__it_passes_visual_regression_tests__assert0_0_document_0_webview.png index 85f4d070..3852639d 100644 Binary files a/packages/toast-message/ember-backstop/backstop_data/bitmaps_reference/ember-backstoptest_Integration__Component__nucleus-toast-message__it_passes_visual_regression_tests__assert0_0_document_0_webview.png and b/packages/toast-message/ember-backstop/backstop_data/bitmaps_reference/ember-backstoptest_Integration__Component__nucleus-toast-message__it_passes_visual_regression_tests__assert0_0_document_0_webview.png differ diff --git a/packages/toast-message/package.json b/packages/toast-message/package.json index b96e5834..fd6b166c 100644 --- a/packages/toast-message/package.json +++ b/packages/toast-message/package.json @@ -31,8 +31,7 @@ "ember-css-transitions": "^0.1.16", "ember-decorators": "^6.1.1", "ember-decorators-polyfill": "shibulijack-fd/ember-decorators-polyfill#master", - "ember-truth-helpers": "^2.1.0", - "ember-wormhole": "^0.5.5" + "ember-truth-helpers": "^2.1.0" }, "devDependencies": { "@ember/optional-features": "^1.0.0", diff --git a/packages/toast-message/tests/helpers/setup-toast-message.js b/packages/toast-message/tests/helpers/setup-toast-message.js deleted file mode 100644 index 34ed9829..00000000 --- a/packages/toast-message/tests/helpers/setup-toast-message.js +++ /dev/null @@ -1,13 +0,0 @@ -export default function setupToastMessage(hooks = self) { - hooks.beforeEach(function() { - this.rootEl = document.querySelector(this.owner.rootElement); - this.modalDivEl = document.createElement('div'); - this.modalDivEl.id = 'nucleus-toast-messages-wormhole'; - - this.rootEl.appendChild(this.modalDivEl); - }); - - hooks.afterEach(function() { - this.rootEl.removeChild(this.modalDivEl); - }); -} diff --git a/packages/toast-message/tests/integration/components/nucleus-toast-message-test.js b/packages/toast-message/tests/integration/components/nucleus-toast-message-test.js index 4b2a5cc6..f07aebc4 100644 --- a/packages/toast-message/tests/integration/components/nucleus-toast-message-test.js +++ b/packages/toast-message/tests/integration/components/nucleus-toast-message-test.js @@ -4,12 +4,10 @@ import test from 'ember-sinon-qunit/test-support/test'; import { render } from '@ember/test-helpers'; import hbs from 'htmlbars-inline-precompile'; import FlashMessage from 'ember-cli-flash/flash/object'; -import setupToastMessage from '../../helpers/setup-toast-message'; import backstop from 'ember-backstop/test-support/backstop'; module('Integration | Component | nucleus-toast-message', function(hooks) { setupRenderingTest(hooks); - setupToastMessage(hooks); hooks.beforeEach(function() { const typesUsed = ['info', 'warning', 'success', 'danger'];