mirror of
https://github.com/hashicorp/vault.git
synced 2025-08-10 00:27:02 +02:00
c5d39c816a
* Move global-flash to HDS-specified area * Add flash-toast component * use flash toast for flash messages * Use spacing vars * Remove unnecessary key * Cleanup + tests * Remove nondeterministic build warning * add changelog * I wish this was automatic
59 lines
2.1 KiB
JavaScript
59 lines
2.1 KiB
JavaScript
/**
|
|
* Copyright (c) HashiCorp, Inc.
|
|
* SPDX-License-Identifier: BUSL-1.1
|
|
*/
|
|
|
|
import { module, test } from 'qunit';
|
|
import { setupRenderingTest } from 'vault/tests/helpers';
|
|
import { click, find, render } from '@ember/test-helpers';
|
|
import { hbs } from 'ember-cli-htmlbars';
|
|
import sinon from 'sinon';
|
|
|
|
module('Integration | Component | flash-toast', function (hooks) {
|
|
setupRenderingTest(hooks);
|
|
|
|
hooks.beforeEach(function () {
|
|
this.flash = {
|
|
type: 'info',
|
|
message: 'The bare minimum flash message',
|
|
};
|
|
this.closeSpy = sinon.spy();
|
|
});
|
|
|
|
test('it renders', async function (assert) {
|
|
await render(hbs`<FlashToast @flash={{this.flash}} @close={{this.closeSpy}} />`);
|
|
|
|
assert.dom('[data-test-flash-message-body]').hasText('The bare minimum flash message');
|
|
assert.dom('[data-test-flash-toast]').hasClass('hds-alert--color-highlight');
|
|
await click('button');
|
|
assert.ok(this.closeSpy.calledOnce, 'close action was called');
|
|
});
|
|
|
|
[
|
|
{ type: 'info', title: 'Info', color: 'hds-alert--color-highlight' },
|
|
{ type: 'success', title: 'Success', color: 'hds-alert--color-success' },
|
|
{ type: 'warning', title: 'Warning', color: 'hds-alert--color-warning' },
|
|
{ type: 'danger', title: 'Error', color: 'hds-alert--color-critical' },
|
|
{ type: 'foobar', title: 'Foobar', color: 'hds-alert--color-neutral' },
|
|
].forEach(({ type, title, color }) => {
|
|
test(`it has correct title and color for type: ${type}`, async function (assert) {
|
|
this.flash.type = type;
|
|
await render(hbs`<FlashToast @flash={{this.flash}} @close={{this.closeSpy}} />`);
|
|
|
|
assert.dom('[data-test-flash-toast-title]').hasText(title, 'title is correct');
|
|
assert.dom('[data-test-flash-toast]').hasClass(color, 'color is correct');
|
|
});
|
|
});
|
|
|
|
test('it renders messages with whitespaces correctly', async function (assert) {
|
|
this.flash.message = `multi-
|
|
|
|
line msg`;
|
|
|
|
await render(hbs`<FlashToast @flash={{this.flash}} @close={{this.closeSpy}} />`);
|
|
const dom = find('[data-test-flash-message-body]');
|
|
const lineHeight = 20;
|
|
assert.true(dom.clientHeight > lineHeight, 'renders message on multiple lines');
|
|
});
|
|
});
|