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  });