github.com/Ilhicas/nomad@v1.0.4-0.20210304152020-e86851182bc3/ui/tests/integration/components/scale-events-chart-test.js (about) 1 import { module, test } from 'qunit'; 2 import { setupRenderingTest } from 'ember-qunit'; 3 import { click, find, findAll, render } from '@ember/test-helpers'; 4 import hbs from 'htmlbars-inline-precompile'; 5 import moment from 'moment'; 6 import setupCodeMirror from 'nomad-ui/tests/helpers/codemirror'; 7 import { componentA11yAudit } from 'nomad-ui/tests/helpers/a11y-audit'; 8 9 module('Integration | Component | scale-events-chart', function(hooks) { 10 setupRenderingTest(hooks); 11 setupCodeMirror(hooks); 12 13 const events = [ 14 { 15 time: new Date('2020-08-05T04:06:00'), 16 count: 2, 17 hasCount: true, 18 meta: {}, 19 message: '', 20 error: false, 21 }, 22 { 23 time: new Date('2020-08-06T04:06:00'), 24 count: 3, 25 hasCount: true, 26 meta: {}, 27 message: '', 28 error: false, 29 }, 30 { 31 time: new Date('2020-08-07T04:06:00'), 32 count: 4, 33 hasCount: true, 34 meta: {}, 35 message: '', 36 error: false, 37 }, 38 { 39 time: new Date('2020-08-06T04:06:00'), 40 hasCount: false, 41 meta: { prop: { deep: true }, five: 5 }, 42 message: 'Something went wrong', 43 error: true, 44 }, 45 { 46 time: new Date('2020-08-05T04:06:00'), 47 hasCount: false, 48 meta: {}, 49 message: 'Something insightful', 50 error: false, 51 }, 52 ]; 53 54 test('each event is rendered as an annotation', async function(assert) { 55 this.set('events', events); 56 await render(hbs`<ScaleEventsChart @events={{this.events}} />`); 57 58 assert.equal( 59 findAll('[data-test-annotation]').length, 60 events.filter(ev => ev.count == null).length 61 ); 62 await componentA11yAudit(this.element, assert); 63 }); 64 65 test('clicking an annotation presents details for the event', async function(assert) { 66 const annotation = events 67 .rejectBy('hasCount') 68 .sortBy('time') 69 .reverse()[0]; 70 71 this.set('events', events); 72 await render(hbs`<ScaleEventsChart @events={{this.events}} />`); 73 74 assert.notOk(find('[data-test-event-details]')); 75 await click('[data-test-annotation] button'); 76 77 assert.ok(find('[data-test-event-details]')); 78 assert.equal( 79 find('[data-test-timestamp]').textContent, 80 moment(annotation.time).format('MMM DD HH:mm:ss ZZ') 81 ); 82 assert.equal(find('[data-test-message]').textContent, annotation.message); 83 assert.equal( 84 getCodeMirrorInstance('[data-test-json-viewer]').getValue(), 85 JSON.stringify(annotation.meta, null, 2) 86 ); 87 88 await componentA11yAudit(this.element, assert); 89 }); 90 91 test('clicking an active annotation closes event details', async function(assert) { 92 this.set('events', events); 93 94 await render(hbs`<ScaleEventsChart @events={{this.events}} />`); 95 assert.notOk(find('[data-test-event-details]')); 96 97 await click('[data-test-annotation] button'); 98 assert.ok(find('[data-test-event-details]')); 99 100 await click('[data-test-annotation] button'); 101 assert.notOk(find('[data-test-event-details]')); 102 }); 103 });