open-vault/ui/tests/integration/components/wrap-ttl-test.js
Noelle Daley 828185db49
UI/add select dropdown (#7102)
* add SelectDropdown

* use SelectDropdown instead of HttpRequestsDropdown

* use html selector instead of class name

* ensure SelectDropdown still works when rendered inside a Toolbar

* add tests

* remove old HttpRequests component

* make SelectDropdown example easier to read in Storybook

* add isFullwidth prop

* add SelectDropbown inside a Toolbar story

* fix tests

* remove actions block and call this.onChange directly

* replace dropdownLabel with label

* rename SelectDropdown to SelecT

* add test for onChange

* remove selectedItem prop since we don't need it

* make Select accept options as an array of strings or objects

* Revert "remove selectedItem prop since we don't need it"

This reverts commit 7278516de87bb1df60482edb005137252819931e.

* use Select inside TtlPicker

* remove debugger

* use a test selector

* fix pki test selectors

* improve storybook docs

* fix selected value in ttl picker

* ensure httprequests dropdown updates the selected item

* ensure select dropdown correctly matches selectedItem

* rename selectedItem to selectedValue

* remove debugger lol

* update selectedItem test

* add valueAttribute and labelAttribute to Storybook knobs

* udpate jsdocs

* remove old httprequestsdropdown component

* add note that onChange will receive value of select

* use Select inside AuthForm

* use correct test selector
2019-08-01 14:35:18 -07:00

52 lines
2.1 KiB
JavaScript

import { module, test } from 'qunit';
import { setupRenderingTest } from 'ember-qunit';
import { render, click, fillIn, blur, find, triggerEvent } from '@ember/test-helpers';
import hbs from 'htmlbars-inline-precompile';
import waitForError from 'vault/tests/helpers/wait-for-error';
module('Integration | Component | wrap ttl', function(hooks) {
setupRenderingTest(hooks);
hooks.beforeEach(function() {
this.lastOnChangeCall = null;
this.set('onChange', val => {
this.lastOnChangeCall = val;
});
});
test('it requires `onChange`', async function(assert) {
let promise = waitForError();
render(hbs`{{wrap-ttl}}`);
let err = await promise;
assert.ok(err.message.includes('`onChange` handler is a required attr in'), 'asserts without onChange');
});
test('it renders', async function(assert) {
await render(hbs`{{wrap-ttl onChange=(action onChange)}}`);
assert.equal(this.lastOnChangeCall, '30m', 'calls onChange with 30m default on first render');
assert.equal(find('label[for=wrap-response]').textContent.trim(), 'Wrap response');
});
test('it nulls out value when you uncheck wrapResponse', async function(assert) {
await render(hbs`{{wrap-ttl onChange=(action onChange)}}`);
await click('#wrap-response');
await triggerEvent('#wrap-response', 'change');
assert.equal(this.lastOnChangeCall, null, 'calls onChange with null');
});
test('it sends value changes to onChange handler', async function(assert) {
await render(hbs`{{wrap-ttl onChange=(action onChange)}}`);
await fillIn('[data-test-wrap-ttl-picker] input', '20');
assert.equal(this.lastOnChangeCall, '20m', 'calls onChange correctly on time input');
await fillIn('[data-test-select="ttl-unit"]', 'h');
await blur('[data-test-select="ttl-unit"]');
assert.equal(this.lastOnChangeCall, '20h', 'calls onChange correctly on unit change');
await fillIn('[data-test-select="ttl-unit"]', 'd');
await blur('[data-test-select="ttl-unit"]');
assert.equal(this.lastOnChangeCall, '480h', 'converts days to hours correctly');
});
});