open-nomad/ui/tests/pages/components/recommendation-card.js
Buck Doyle 20ec481090
Add DAS subroute and copy button (#9201)
This continues iteration on the DAS UI by adding the ability to directly
navigate to a recommendation summary by (namespaced) slug and a copy
button for the direct navigation link.

It includes a change to CopyButton allowing it to take a block that’s
rendered within the button.

It also changes some instances of multi-relationship traversal to use
in-summary attributes, such as summary.jobNamespace instead of
summary.job.namespace.name.
2020-11-04 12:22:24 -06:00

113 lines
2.7 KiB
JavaScript

import { attribute, collection, hasClass, isPresent, text } from 'ember-cli-page-object';
import { getter } from 'ember-cli-page-object/macros';
import toggle from 'nomad-ui/tests/pages/components/toggle';
export default {
scope: '[data-test-task-group-recommendations]',
slug: {
jobName: text('[data-test-job-name]'),
groupName: text('[data-test-task-group-name]'),
},
namespace: text('[data-test-namespace]'),
copyButton: {
scope: '[data-test-copy-button]',
clipboardText: attribute('data-clipboard-text', 'button'),
},
totalsTable: totalsTableComponent('[data-test-group-totals]'),
narrative: text('[data-test-narrative]'),
togglesTable: {
scope: '[data-test-toggles-table]',
toggleAllIsPresent: isPresent('[data-test-toggle-all]'),
toggleAllCPU: toggle('[data-test-tasks-head] [data-test-cpu-toggle]'),
toggleAllMemory: toggle('[data-test-tasks-head] [data-test-memory-toggle]'),
tasks: collection('[data-test-task-toggles]', {
name: text('[data-test-name]'),
cpu: toggle('[data-test-cpu-toggle]'),
memory: toggle('[data-test-memory-toggle]'),
isActive: hasClass('active'),
}),
},
activeTask: {
scope: '[data-test-active-task]',
name: text('[data-test-task-name]'),
totalsTable: totalsTableComponent(''),
charts: collection('[data-test-chart-for]', {
resource: text('text.resource'),
}),
cpuChart: resourceChartComponent('[data-test-chart-for=CPU]'),
memoryChart: resourceChartComponent('[data-test-chart-for=MemoryMB]'),
},
acceptButton: {
scope: '[data-test-accept]',
isDisabled: attribute('disabled'),
},
dismissButton: {
scope: '[data-test-dismiss]',
},
};
function totalsTableCell(scope) {
return {
scope,
isIncrease: hasClass('increase'),
isDecrease: hasClass('decrease'),
isNeutral: getter(function() {
return !this.isIncrease && !this.isDecrease;
}),
};
}
function totalsTableComponent(scope) {
return {
scope,
current: {
scope: '[data-test-current]',
cpu: totalsTableCell('[data-test-cpu]'),
memory: totalsTableCell('[data-test-memory]'),
},
recommended: {
scope: '[data-test-recommended]',
cpu: totalsTableCell('[data-test-cpu]'),
memory: totalsTableCell('[data-test-memory]'),
},
unitDiff: {
cpu: text('[data-test-cpu-unit-diff]'),
memory: text('[data-test-memory-unit-diff]'),
},
percentDiff: {
cpu: text('[data-test-cpu-percent-diff]'),
memory: text('[data-test-memory-percent-diff]'),
},
};
}
function resourceChartComponent(scope) {
return {
scope,
isIncrease: hasClass('increase'),
isDecrease: hasClass('decrease'),
isDisabled: hasClass('disabled'),
};
}