github.com/Ilhicas/nomad@v1.0.4-0.20210304152020-e86851182bc3/ui/tests/integration/components/primary-metric-test.js (about) 1 import EmberObject, { computed } from '@ember/object'; 2 import Service from '@ember/service'; 3 import { module, test } from 'qunit'; 4 import { setupRenderingTest } from 'ember-qunit'; 5 import hbs from 'htmlbars-inline-precompile'; 6 import { find, render } from '@ember/test-helpers'; 7 import { componentA11yAudit } from 'nomad-ui/tests/helpers/a11y-audit'; 8 import { task } from 'ember-concurrency'; 9 import sinon from 'sinon'; 10 import { startMirage } from 'nomad-ui/initializers/ember-cli-mirage'; 11 import { initialize as fragmentSerializerInitializer } from 'nomad-ui/initializers/fragment-serializer'; 12 13 module('Integration | Component | primary metric', function(hooks) { 14 setupRenderingTest(hooks); 15 16 hooks.beforeEach(function() { 17 fragmentSerializerInitializer(this.owner); 18 this.store = this.owner.lookup('service:store'); 19 this.server = startMirage(); 20 this.server.create('namespace'); 21 this.server.create('node'); 22 23 const getTrackerSpy = (this.getTrackerSpy = sinon.spy()); 24 const trackerPollSpy = (this.trackerPollSpy = sinon.spy()); 25 const trackerSignalPauseSpy = (this.trackerSignalPauseSpy = sinon.spy()); 26 27 const MockTracker = EmberObject.extend({ 28 poll: task(function*() { 29 yield trackerPollSpy(); 30 }), 31 signalPause: task(function*() { 32 yield trackerSignalPauseSpy(); 33 }), 34 35 cpu: computed(function() { 36 return []; 37 }), 38 memory: computed(function() { 39 return []; 40 }), 41 }); 42 43 const mockStatsTrackersRegistry = Service.extend({ 44 getTracker(...args) { 45 getTrackerSpy(...args); 46 return MockTracker.create(); 47 }, 48 }); 49 50 this.owner.register('service:stats-trackers-registry', mockStatsTrackersRegistry); 51 this.statsTrackersRegistry = this.owner.lookup('service:stats-trackers-registry'); 52 }); 53 54 hooks.afterEach(function() { 55 this.server.shutdown(); 56 }); 57 58 const commonTemplate = hbs` 59 <PrimaryMetric 60 @resource={{resource}} 61 @metric={{metric}} /> 62 `; 63 64 test('Contains a line chart, a percentage bar, a percentage figure, and an absolute usage figure', async function(assert) { 65 let resource; 66 const metric = 'cpu'; 67 68 await this.store.findAll('node'); 69 70 resource = this.store.peekAll('node').get('firstObject'); 71 this.setProperties({ resource, metric }); 72 73 await render(commonTemplate); 74 75 assert.ok(find('[data-test-line-chart]'), 'Line chart'); 76 assert.ok(find('[data-test-percentage-bar]'), 'Percentage bar'); 77 assert.ok(find('[data-test-percentage]'), 'Percentage figure'); 78 assert.ok(find('[data-test-absolute-value]'), 'Absolute usage figure'); 79 await componentA11yAudit(this.element, assert); 80 }); 81 82 test('The CPU metric maps to is-info', async function(assert) { 83 const metric = 'cpu'; 84 85 await this.store.findAll('node'); 86 87 const resource = this.store.peekAll('node').get('firstObject'); 88 this.setProperties({ resource, metric }); 89 90 await render(commonTemplate); 91 92 assert.ok( 93 find('[data-test-line-chart] .area').classList.contains('is-info'), 94 'Info class for CPU metric' 95 ); 96 }); 97 98 test('The Memory metric maps to is-danger', async function(assert) { 99 const metric = 'memory'; 100 101 await this.store.findAll('node'); 102 103 const resource = this.store.peekAll('node').get('firstObject'); 104 this.setProperties({ resource, metric }); 105 106 await render(commonTemplate); 107 108 assert.ok( 109 find('[data-test-line-chart] .area').classList.contains('is-danger'), 110 'Danger class for Memory metric' 111 ); 112 }); 113 114 test('Gets the tracker from the tracker registry', async function(assert) { 115 const metric = 'cpu'; 116 117 await this.store.findAll('node'); 118 119 const resource = this.store.peekAll('node').get('firstObject'); 120 this.setProperties({ resource, metric }); 121 122 await render(commonTemplate); 123 124 assert.ok( 125 this.getTrackerSpy.calledWith(resource), 126 'Uses the tracker registry to get the tracker for the provided resource' 127 ); 128 }); 129 130 test('Immediately polls the tracker', async function(assert) { 131 const metric = 'cpu'; 132 133 await this.store.findAll('node'); 134 135 const resource = this.store.peekAll('node').get('firstObject'); 136 this.setProperties({ resource, metric }); 137 138 await render(commonTemplate); 139 140 assert.ok(this.trackerPollSpy.calledOnce, 'The tracker is polled immediately'); 141 }); 142 143 test('A pause signal is sent to the tracker when the component is destroyed', async function(assert) { 144 const metric = 'cpu'; 145 146 // Capture a reference to the spy before the component is destroyed 147 const trackerSignalPauseSpy = this.trackerSignalPauseSpy; 148 149 await this.store.findAll('node'); 150 151 const resource = this.store.peekAll('node').get('firstObject'); 152 this.setProperties({ resource, metric, showComponent: true }); 153 await render(hbs` 154 {{#if showComponent}} 155 <PrimaryMetric 156 @resource={{resource}} 157 @metric={{metric}} /> 158 }} 159 {{/if}} 160 `); 161 162 assert.notOk(trackerSignalPauseSpy.called, 'No pause signal has been sent yet'); 163 // This will toggle the if statement, resulting the primary-metric component being destroyed. 164 this.set('showComponent', false); 165 166 assert.ok(trackerSignalPauseSpy.calledOnce, 'A pause signal is sent to the tracker'); 167 }); 168 });