open-vault/ui/tests/integration/components/http-requests-container-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
1.8 KiB
JavaScript

import { module, test } from 'qunit';
import { setupRenderingTest } from 'ember-qunit';
import { render, fillIn } from '@ember/test-helpers';
import hbs from 'htmlbars-inline-precompile';
const COUNTERS = [
{ start_time: '2018-12-01T00:00:00Z', total: 5500 },
{ start_time: '2019-01-01T00:00:00Z', total: 4500 },
{ start_time: '2019-02-01T00:00:00Z', total: 5000 },
{ start_time: '2019-03-01T00:00:00Z', total: 5000 },
];
module('Integration | Component | http-requests-container', function(hooks) {
setupRenderingTest(hooks);
hooks.beforeEach(function() {
this.set('counters', COUNTERS);
});
test('it renders', async function(assert) {
await render(hbs`<HttpRequestsContainer @counters={{counters}}/>`);
assert.dom('.http-requests-container').exists();
assert.dom('.select').exists();
assert.dom('.http-requests-bar-chart-container').exists();
assert.dom('.http-requests-table').exists();
});
test('it does not render a bar chart for less than one month of data', async function(assert) {
const one_month_counter = [
{
start_time: '2019-05-01T00:00:00Z',
total: 50,
},
];
this.set('one_month_counter', one_month_counter);
await render(hbs`<HttpRequestsContainer @counters={{one_month_counter}}/>`);
assert.dom('.http-requests-table').exists();
assert.dom('.http-requests-bar-chart-container').doesNotExist();
});
test('it filters the data according to the dropdown', async function(assert) {
await render(hbs`<HttpRequestsContainer @counters={{counters}}/>`);
await fillIn('[data-test-select="requests-timewindow"]', '2018');
assert.dom('.shadow-bars> .bar').exists({ count: 1 }, 'filters the bar chart to the selected year');
assert.dom('.start-time').exists({ count: 1 }, 'filters the table to the selected year');
});
});