Tests for PrimaryMetric::Node

ui/app/components/primary-metric/current-value.hbs

@@ -2,6 +2,7 @@
   <div class="column">
     <div class="inline-chart" data-test-percentage-bar>
       <progress
+        data-test-current-value
         class="progress {{@chartClass}} is-small"
         value="{{@percent}}"
         max="1">

ui/mirage/factories/node.js

@@ -68,6 +68,13 @@ export default Factory.extend({
     hostVolumes: () => ({}),
   }),
 
+  reserved: trait({
+    reservedResources: generateResources({
+      CPU: 1000,
+      MemoryMB: 2000,
+    }),
+  }),
+
   drainStrategy: null,
 
   drivers: makeDrivers,

ui/tests/integration/components/primary-metric/node-test.js

@@ -0,0 +1,69 @@
+import { setupRenderingTest } from 'ember-qunit';
+import { module, test } from 'qunit';
+import { find, render } from '@ember/test-helpers';
+import { initialize as fragmentSerializerInitializer } from 'nomad-ui/initializers/fragment-serializer';
+import hbs from 'htmlbars-inline-precompile';
+import { setupPrimaryMetricMocks, primaryMetric } from './primary-metric';
+import { componentA11yAudit } from 'nomad-ui/tests/helpers/a11y-audit';
+import { startMirage } from 'nomad-ui/initializers/ember-cli-mirage';
+
+module('Integration | Component | PrimaryMetric::Node', function(hooks) {
+  setupRenderingTest(hooks);
+  setupPrimaryMetricMocks(hooks);
+
+  hooks.beforeEach(function() {
+    fragmentSerializerInitializer(this.owner);
+    this.store = this.owner.lookup('service:store');
+    this.server = startMirage();
+    this.server.create('namespace');
+    this.server.create('node');
+  });
+
+  hooks.afterEach(function() {
+    this.server.shutdown();
+  });
+
+  const template = hbs`
+    <PrimaryMetric::Node
+      @node={{this.resource}}
+      @metric={{this.metric}} />
+  `;
+
+  const preload = async store => {
+    await store.findAll('node');
+  };
+
+  const findResource = store => store.peekAll('node').get('firstObject');
+
+  test('Must pass an accessibility audit', async function(assert) {
+    await preload(this.store);
+
+    const resource = findResource(this.store);
+    this.setProperties({ resource, metric: 'cpu' });
+
+    await render(template);
+    await componentA11yAudit(this.element, assert);
+  });
+
+  test('When the node has a reserved amount for the metric, a horizontal annotation is shown', async function(assert) {
+    this.server.create('node', 'reserved', { id: 'withAnnotation' });
+    await preload(this.store);
+
+    const resource = this.store.peekRecord('node', 'withAnnotation');
+    this.setProperties({ resource, metric: 'cpu' });
+
+    await render(template);
+
+    assert.ok(find('[data-test-annotation]'));
+    assert.equal(
+      find('[data-test-annotation]').textContent.trim(),
+      `${resource.reserved.cpu} MHz reserved`
+    );
+  });
+
+  primaryMetric({
+    template,
+    preload,
+    findResource,
+  });
+});

ui/tests/integration/components/primary-metric/primary-metric.js

@@ -0,0 +1,138 @@
+import EmberObject, { computed } from '@ember/object';
+import Service from '@ember/service';
+import { find, render, clearRender } from '@ember/test-helpers';
+import { test } from 'qunit';
+import { task } from 'ember-concurrency';
+import sinon from 'sinon';
+
+export function setupPrimaryMetricMocks(hooks, tasks = []) {
+  hooks.beforeEach(function() {
+    const getTrackerSpy = (this.getTrackerSpy = sinon.spy());
+    const trackerPollSpy = (this.trackerPollSpy = sinon.spy());
+    const trackerSignalPauseSpy = (this.trackerSignalPauseSpy = sinon.spy());
+
+    const MockTracker = EmberObject.extend({
+      poll: task(function*() {
+        yield trackerPollSpy();
+      }),
+      signalPause: task(function*() {
+        yield trackerSignalPauseSpy();
+      }),
+
+      cpu: computed(function() {
+        return [];
+      }),
+      memory: computed(function() {
+        return [];
+      }),
+      tasks,
+    });
+
+    const mockStatsTrackersRegistry = Service.extend({
+      getTracker(...args) {
+        getTrackerSpy(...args);
+        return MockTracker.create();
+      },
+    });
+
+    this.owner.register('service:stats-trackers-registry', mockStatsTrackersRegistry);
+    this.statsTrackersRegistry = this.owner.lookup('service:stats-trackers-registry');
+  });
+}
+
+export function primaryMetric({ template, findResource, preload }) {
+  test('Contains a line chart, a percentage bar, a percentage figure, and an absolute usage figure', async function(assert) {
+    const metric = 'cpu';
+
+    await preload(this.store);
+
+    const resource = findResource(this.store);
+    this.setProperties({ resource, metric });
+
+    await render(template);
+
+    assert.ok(find('[data-test-line-chart]'), 'Line chart');
+    assert.ok(find('[data-test-percentage-bar]'), 'Percentage bar');
+    assert.ok(find('[data-test-percentage]'), 'Percentage figure');
+    assert.ok(find('[data-test-absolute-value]'), 'Absolute usage figure');
+  });
+
+  test('The CPU metric maps to is-info', async function(assert) {
+    const metric = 'cpu';
+
+    await preload(this.store);
+
+    const resource = findResource(this.store);
+    this.setProperties({ resource, metric });
+
+    await render(template);
+
+    assert.ok(
+      find('[data-test-current-value]').classList.contains('is-info'),
+      'Info class for CPU metric'
+    );
+  });
+
+  test('The Memory metric maps to is-danger', async function(assert) {
+    const metric = 'memory';
+
+    await preload(this.store);
+
+    const resource = findResource(this.store);
+    this.setProperties({ resource, metric });
+
+    await render(template);
+
+    assert.ok(
+      find('[data-test-current-value]').classList.contains('is-danger'),
+      'Danger class for Memory metric'
+    );
+  });
+
+  test('Gets the tracker from the tracker registry', async function(assert) {
+    const metric = 'cpu';
+
+    await preload(this.store);
+
+    const resource = findResource(this.store);
+    this.setProperties({ resource, metric });
+
+    await render(template);
+
+    assert.ok(
+      this.getTrackerSpy.calledWith(resource) || this.getTrackerSpy.calledWith(resource.allocation),
+      'Uses the tracker registry to get the tracker for the provided resource'
+    );
+  });
+
+  test('Immediately polls the tracker', async function(assert) {
+    const metric = 'cpu';
+
+    await preload(this.store);
+
+    const resource = findResource(this.store);
+    this.setProperties({ resource, metric });
+
+    await render(template);
+
+    assert.ok(this.trackerPollSpy.calledOnce, 'The tracker is polled immediately');
+  });
+
+  test('A pause signal is sent to the tracker when the component is destroyed', async function(assert) {
+    const metric = 'cpu';
+
+    // Capture a reference to the spy before the component is destroyed
+    const trackerSignalPauseSpy = this.trackerSignalPauseSpy;
+
+    await preload(this.store);
+
+    const resource = findResource(this.store);
+    this.setProperties({ resource, metric });
+    await render(template);
+
+    assert.notOk(trackerSignalPauseSpy.called, 'No pause signal has been sent yet');
+    await clearRender();
+
+    assert.ok(trackerSignalPauseSpy.calledOnce, 'A pause signal is sent to the tracker');
+  });
+}