luxolus
/
open-nomad
2
0
Fork 0
Code Issues 1 Pull Requests Packages Releases Wiki Activity

Show real usage numbers as tooltips

This commit is contained in:
Michael Lange 2017-10-16 18:47:25 -07:00
parent 726f3a75e9
commit b8d13e3229
3 changed files with 33 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
ui/app/templates/components/allocation-row.hbs
View File

@ -27,7 +27,7 @@
{{x-icon "warning" class="is-warning"}}
</span>
{{else}}
<div class="inline-chart">
<div class="inline-chart tooltip" aria-label="{{allocation.cpuUsed}} / {{allocation.taskGroup.reservedCPU}} MHz">
<progress
class="progress is-info is-small"
value="{{allocation.percentCPU}}"
@ -45,7 +45,7 @@
{{x-icon "warning" class="is-warning"}}
</span>
{{else}}
<div class="inline-chart">
<div class="inline-chart tooltip" aria-label="{{format-bytes allocation.memoryUsed}} / {{allocation.taskGroup.reservedMemory}} MiB">
<progress
class="progress is-danger is-small"
value="{{allocation.percentMemory}}"

16
ui/tests/acceptance/client-detail-test.js
View File

@ -2,6 +2,7 @@ import Ember from 'ember';
import { click, find, findAll, currentURL, visit } from 'ember-native-dom-helpers';
import { test } from 'qunit';
import moduleForAcceptance from 'nomad-ui/tests/helpers/module-for-acceptance';
import { formatBytes } from 'nomad-ui/helpers/format-bytes';
const { $ } = Ember;
@ -106,6 +107,8 @@ test('each allocation should have high-level details for the allocation', functi
});
const tasks = taskGroup.taskIds.map(id => server.db.tasks.find(id));
const cpuUsed = tasks.reduce((sum, task) => sum + task.Resources.CPU, 0);
const memoryUsed = tasks.reduce((sum, task) => sum + task.Resources.MemoryMB, 0);
visit(`/nodes/${node.id}`);
@ -157,15 +160,24 @@ test('each allocation should have high-level details for the allocation', functi
allocStats.resourceUsage.CpuStats.Percent,
'CPU %'
);
assert.equal(
allocationRow.find('td:eq(4) .tooltip').attr('aria-label'),
`${Math.floor(allocStats.resourceUsage.CpuStats.TotalTicks)} / ${cpuUsed} MHz`,
'Detailed CPU information is in a tooltip'
);
assert.equal(
allocationRow
.find('td:eq(5)')
.text()
.trim(),
allocStats.resourceUsage.MemoryStats.Cache /
tasks.reduce((sum, task) => sum + task.Resources.MemoryMB, 0),
allocStats.resourceUsage.MemoryStats.RSS / 1024 / 1024 / memoryUsed,
'Memory used'
);
assert.equal(
allocationRow.find('td:eq(5) .tooltip').attr('aria-label'),
`${formatBytes([allocStats.resourceUsage.MemoryStats.RSS])} / ${memoryUsed} MiB`,
'Detailed memory information is in a tooltip'
);
});
});

19
ui/tests/acceptance/task-group-detail-test.js
View File

@ -2,6 +2,7 @@ import Ember from 'ember';
import { click, find, findAll, fillIn, currentURL, visit } from 'ember-native-dom-helpers';
import { test } from 'qunit';
import moduleForAcceptance from 'nomad-ui/tests/helpers/module-for-acceptance';
import { formatBytes } from 'nomad-ui/helpers/format-bytes';
const { $ } = Ember;
@ -190,6 +191,9 @@ test('each allocation should show stats about the allocation, retrieved directly
const allocStats = server.db.clientAllocationStats.find(allocation.id);
const tasks = taskGroup.taskIds.map(id => server.db.tasks.find(id));
const cpuUsed = tasks.reduce((sum, task) => sum + task.Resources.CPU, 0);
const memoryUsed = tasks.reduce((sum, task) => sum + task.Resources.MemoryMB, 0);
assert.equal(
allocationRow
.find('td:eq(4)')
@ -199,16 +203,27 @@ test('each allocation should show stats about the allocation, retrieved directly
'CPU %'
);
assert.equal(
allocationRow.find('td:eq(4) .tooltip').attr('aria-label'),
`${Math.floor(allocStats.resourceUsage.CpuStats.TotalTicks)} / ${cpuUsed} MHz`,
'Detailed CPU information is in a tooltip'
);
assert.equal(
allocationRow
.find('td:eq(5)')
.text()
.trim(),
allocStats.resourceUsage.MemoryStats.Cache /
tasks.reduce((sum, task) => sum + task.Resources.MemoryMB, 0),
allocStats.resourceUsage.MemoryStats.RSS / 1024 / 1024 / memoryUsed,
'Memory used'
);
assert.equal(
allocationRow.find('td:eq(5) .tooltip').attr('aria-label'),
`${formatBytes([allocStats.resourceUsage.MemoryStats.RSS])} / ${memoryUsed} MiB`,
'Detailed memory information is in a tooltip'
);
const node = server.db.nodes.find(allocation.nodeId);
const nodeStatsUrl = `//${node.httpAddr}/v1/client/allocation/${allocation.id}/stats`;