mirror of
https://github.com/hashicorp/vault.git
synced 2025-08-20 06:01:10 +02:00
050a90b2ab
* Create date-range component with tests * update selectors and callback behavior * update cc tests & selectors * cleanup * RIP calendar-widget and date-dropdown -- you were good components * reset on close * Add changelog * use parseApiTimestamp * fix test * cleanup * make date-range typescript, update behavior * add words * minor styling * fix test
107 lines
3.9 KiB
JavaScript
107 lines
3.9 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, fillIn, render } from '@ember/test-helpers';
|
|
import { hbs } from 'ember-cli-htmlbars';
|
|
import Sinon from 'sinon';
|
|
import timestamp from 'core/utils/timestamp';
|
|
import { GENERAL } from 'vault/tests/helpers/general-selectors';
|
|
import { CLIENT_COUNT } from 'vault/tests/helpers/clients/client-count-selectors';
|
|
|
|
const DATE_RANGE = CLIENT_COUNT.dateRange;
|
|
module('Integration | Component | clients/date-range', function (hooks) {
|
|
setupRenderingTest(hooks);
|
|
|
|
hooks.beforeEach(function () {
|
|
Sinon.replace(timestamp, 'now', Sinon.fake.returns(new Date('2018-04-03T14:15:30')));
|
|
this.now = timestamp.now();
|
|
this.startTime = '2018-01-01T14:15:30';
|
|
this.endTime = '2019-01-31T14:15:30';
|
|
this.onChange = Sinon.spy();
|
|
this.renderComponent = async () => {
|
|
await render(
|
|
hbs`<Clients::DateRange @startTime={{this.startTime}} @endTime={{this.endTime}} @onChange={{this.onChange}} />`
|
|
);
|
|
};
|
|
});
|
|
|
|
test('it renders prompt to set dates if no start time', async function (assert) {
|
|
this.startTime = undefined;
|
|
await this.renderComponent();
|
|
|
|
assert.dom(DATE_RANGE.set).exists();
|
|
|
|
await click(DATE_RANGE.set);
|
|
assert.dom(DATE_RANGE.editModal).exists();
|
|
assert.dom(DATE_RANGE.editDate('start')).hasValue('');
|
|
await fillIn(DATE_RANGE.editDate('start'), '2018-01');
|
|
await fillIn(DATE_RANGE.editDate('end'), '2019-01');
|
|
await click(GENERAL.saveButton);
|
|
assert.deepEqual(this.onChange.args[0], [
|
|
{
|
|
end_time: 1548892800,
|
|
start_time: 1514764800,
|
|
},
|
|
]);
|
|
assert.dom(DATE_RANGE.editModal).doesNotExist('closes modal');
|
|
});
|
|
|
|
test('it renders the date range passed and can reset it', async function (assert) {
|
|
await this.renderComponent();
|
|
|
|
assert.dom(DATE_RANGE.dateDisplay('start')).hasText('January 2018');
|
|
assert.dom(DATE_RANGE.dateDisplay('end')).hasText('January 2019');
|
|
|
|
await click(DATE_RANGE.edit);
|
|
assert.dom(DATE_RANGE.editModal).exists();
|
|
assert.dom(DATE_RANGE.editDate('start')).hasValue('2018-01');
|
|
assert.dom(DATE_RANGE.editDate('end')).hasValue('2019-01');
|
|
assert.dom(DATE_RANGE.defaultRangeAlert).doesNotExist();
|
|
|
|
await click(DATE_RANGE.editDate('reset'));
|
|
assert.dom(DATE_RANGE.editDate('start')).hasValue('');
|
|
assert.dom(DATE_RANGE.editDate('end')).hasValue('');
|
|
assert.dom(DATE_RANGE.defaultRangeAlert).exists();
|
|
await click(GENERAL.saveButton);
|
|
assert.deepEqual(this.onChange.args[0], [{ start_time: undefined, end_time: undefined }]);
|
|
});
|
|
|
|
test('it does not trigger onChange if date range invalid', async function (assert) {
|
|
await this.renderComponent();
|
|
|
|
await click(DATE_RANGE.edit);
|
|
await click(DATE_RANGE.editDate('reset'));
|
|
await fillIn(DATE_RANGE.editDate('end'), '2017-05');
|
|
assert.dom(DATE_RANGE.validation).hasText('You must supply both start and end dates.');
|
|
await click(GENERAL.saveButton);
|
|
assert.false(this.onChange.called);
|
|
|
|
await fillIn(DATE_RANGE.editDate('start'), '2018-01');
|
|
assert.dom(DATE_RANGE.validation).hasText('Start date must be before end date.');
|
|
await click(GENERAL.saveButton);
|
|
assert.false(this.onChange.called);
|
|
|
|
await click(GENERAL.cancelButton);
|
|
assert.false(this.onChange.called);
|
|
assert.dom(DATE_RANGE.editModal).doesNotExist();
|
|
});
|
|
|
|
test('it resets the tracked values on close', async function (assert) {
|
|
await this.renderComponent();
|
|
|
|
await click(DATE_RANGE.edit);
|
|
await click(DATE_RANGE.editDate('reset'));
|
|
assert.dom(DATE_RANGE.editDate('start')).hasValue('');
|
|
assert.dom(DATE_RANGE.editDate('end')).hasValue('');
|
|
await click(GENERAL.cancelButton);
|
|
|
|
await click(DATE_RANGE.edit);
|
|
assert.dom(DATE_RANGE.editDate('start')).hasValue('2018-01');
|
|
assert.dom(DATE_RANGE.editDate('end')).hasValue('2019-01');
|
|
});
|
|
});
|