Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

UI: Topology info panel incorrect accounting bugs #9886

Merged
merged 4 commits into from
Jan 28, 2021
Merged

UI: Topology info panel incorrect accounting bugs #9886

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
a22a952
Only count the scheduled allocs on the topo viz node stats bar
DingoEatingFuzz Jan 25, 2021
792559e
Clamp widths at zero to prevent negative width warnings
DingoEatingFuzz Jan 26, 2021
d3dd3f5
Test coverage for the topology info panel.
DingoEatingFuzz Jan 26, 2021
73be2c3
Merge branch 'master' into b-ui/topo-viz-accounting
backspace Jan 28, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
10 changes: 5 additions & 5 deletions ui/app/components/topo-viz/node.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,7 @@ export default class TopoVizNode extends Component {
}

get count() {
return this.args.node.allocations.length;
return this.allocations.length;
}

get allocations() {
Expand Down Expand Up @@ -150,15 +150,15 @@ export default class TopoVizNode extends Component {
allocation,
offset: cpuOffset * 100,
percent: cpuPercent * 100,
width: cpuWidth,
width: Math.max(cpuWidth, 0),
x: cpuOffset * width + (isFirst ? 0 : 0.5) + (isSelected ? 0.5 : 0),
className: allocation.allocation.clientStatus,
});
memory.push({
allocation,
offset: memoryOffset * 100,
percent: memoryPercent * 100,
width: memoryWidth,
width: Math.max(memoryWidth, 0),
x: memoryOffset * width + (isFirst ? 0 : 0.5) + (isSelected ? 0.5 : 0),
className: allocation.allocation.clientStatus,
});
Expand All @@ -169,11 +169,11 @@ export default class TopoVizNode extends Component {

const cpuRemainder = {
x: cpuOffset * width + 0.5,
width: width - cpuOffset * width,
width: Math.max(width - cpuOffset * width, 0),
};
const memoryRemainder = {
x: memoryOffset * width + 0.5,
width: width - memoryOffset * width,
width: Math.max(width - memoryOffset * width, 0),
};

return {
Expand Down
16 changes: 9 additions & 7 deletions ui/app/controllers/topology.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,15 +47,17 @@ export default class TopologyControllers extends Controller {
return reduceToLargestUnit(this.totalMemory)[1];
}

@computed('model.allocations.@each.allocatedResources')
@computed('scheduledAllocations.@each.allocatedResources')
get totalReservedMemory() {
const mibs = this.model.allocations.mapBy('allocatedResources.memory').reduce(sumAggregator, 0);
const mibs = this.scheduledAllocations
.mapBy('allocatedResources.memory')
.reduce(sumAggregator, 0);
return mibs * 1024 * 1024;
}

@computed('model.allocations.@each.allocatedResources')
@computed('scheduledAllocations.@each.allocatedResources')
get totalReservedCPU() {
return this.model.allocations.mapBy('allocatedResources.cpu').reduce(sumAggregator, 0);
return this.scheduledAllocations.mapBy('allocatedResources.cpu').reduce(sumAggregator, 0);
}

@computed('totalMemory', 'totalReservedMemory')
Expand All @@ -70,13 +72,13 @@ export default class TopologyControllers extends Controller {
return this.totalReservedCPU / this.totalCPU;
}

@computed('activeAllocation', 'model.allocations.@each.{taskGroupName,job}')
@computed('activeAllocation', 'scheduledAllocations.@each.{taskGroupName,job}')
get siblingAllocations() {
if (!this.activeAllocation) return [];
const taskGroup = this.activeAllocation.taskGroupName;
const jobId = this.activeAllocation.belongsTo('job').id();

return this.model.allocations.filter(allocation => {
return this.scheduledAllocations.filter(allocation => {
return allocation.taskGroupName === taskGroup && allocation.belongsTo('job').id() === jobId;
});
}
Expand Down Expand Up @@ -104,7 +106,7 @@ export default class TopologyControllers extends Controller {

@computed('siblingAllocations.@each.node')
get uniqueActiveAllocationNodes() {
return this.siblingAllocations.mapBy('node').uniq();
return this.siblingAllocations.mapBy('node.id').uniq();
}

@action
Expand Down
49 changes: 27 additions & 22 deletions ui/app/templates/topology.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -60,29 +60,29 @@
<div data-test-info-panel-title class="boxed-section-head">
{{#if this.activeNode}}Client{{else if this.activeAllocation}}Allocation{{else}}Cluster{{/if}} Details
</div>
<div class="boxed-section-body">
<div data-test-info-panel class="boxed-section-body">
{{#if this.activeNode}}
{{#let this.activeNode.node as |node|}}
<div class="dashboard-metric">
<p class="metric">{{this.activeNode.allocations.length}} <span class="metric-label">Allocations</span></p>
<p data-test-allocations class="metric">{{this.activeNode.allocations.length}} <span class="metric-label">Allocations</span></p>
</div>
<div class="dashboard-metric">
<h3 class="pair">
<strong>Client:</strong>
<LinkTo @route="clients.client" @model={{node}}>
<LinkTo data-test-client-link @route="clients.client" @model={{node}}>
{{node.shortId}}
</LinkTo>
</h3>
<p class="minor-pair"><strong>Name:</strong> {{node.name}}</p>
<p class="minor-pair"><strong>Address:</strong> {{node.httpAddr}}</p>
<p class="minor-pair"><strong>Status:</strong> {{node.status}}</p>
<p data-test-name class="minor-pair"><strong>Name:</strong> {{node.name}}</p>
<p data-test-address class="minor-pair"><strong>Address:</strong> {{node.httpAddr}}</p>
<p data-test-status class="minor-pair"><strong>Status:</strong> {{node.status}}</p>
</div>
<div class="dashboard-metric">
<h3 class="pair">
<strong>Draining?</strong> <span class="{{if node.isDraining "status-text is-info"}}">{{if node.isDraining "Yes" "No"}}</span>
<strong>Draining?</strong> <span data-test-draining class="{{if node.isDraining "status-text is-info"}}">{{if node.isDraining "Yes" "No"}}</span>
</h3>
<h3 class="pair">
<strong>Eligible?</strong> <span class="{{unless node.isEligible "status-text is-warning"}}">{{if node.isEligible "Yes" "No"}}</span>
<strong>Eligible?</strong> <span data-test-eligible class="{{unless node.isEligible "status-text is-warning"}}">{{if node.isEligible "Yes" "No"}}</span>
</h3>
</div>
<div class="dashboard-metric with-divider">
Expand All @@ -93,8 +93,9 @@
</p>
<div class="columns graphic">
<div class="column">
<div class="inline-chart" data-test-percentage-bar>
<div class="inline-chart">
<progress
data-test-memory-progress-bar
class="progress is-danger is-small"
value="{{this.nodeUtilization.reservedMemoryPercent}}"
max="1">
Expand All @@ -106,7 +107,7 @@
<span class="nowrap" data-test-percentage>{{format-percentage this.nodeUtilization.reservedMemoryPercent total=1}}</span>
</div>
</div>
<div class="annotation" data-test-absolute-value>
<div class="annotation" data-test-memory-absolute-value>
<strong>{{format-bytes this.nodeUtilization.totalReservedMemory}}</strong> / {{format-bytes this.nodeUtilization.totalMemory}} reserved
</div>
</div>
Expand All @@ -116,6 +117,7 @@
<div class="column">
<div class="inline-chart" data-test-percentage-bar>
<progress
data-test-cpu-progress-bar
class="progress is-info is-small"
value="{{this.nodeUtilization.reservedCPUPercent}}"
max="1">
Expand All @@ -127,7 +129,7 @@
<span class="nowrap" data-test-percentage>{{format-percentage this.nodeUtilization.reservedCPUPercent total=1}}</span>
</div>
</div>
<div class="annotation" data-test-absolute-value>
<div class="annotation" data-test-cpu-absolute-value>
<strong>{{this.nodeUtilization.totalReservedCPU}} MHz</strong> / {{this.nodeUtilization.totalCPU}} MHz reserved
</div>
</div>
Expand All @@ -136,18 +138,19 @@
<div class="dashboard-metric">
<h3 class="pair">
<strong>Allocation:</strong>
<LinkTo @route="allocations.allocation" @model={{this.activeAllocation}} class="is-primary">{{this.activeAllocation.shortId}}</LinkTo>
<LinkTo data-test-id @route="allocations.allocation" @model={{this.activeAllocation}} class="is-primary">{{this.activeAllocation.shortId}}</LinkTo>
</h3>
<p class="minor-pair"><strong>Sibling Allocations:</strong> {{this.siblingAllocations.length}}</p>
<p class="minor-pair"><strong>Unique Client Placements:</strong> {{this.uniqueActiveAllocationNodes.length}}</p>
<p data-test-sibling-allocs class="minor-pair"><strong>Sibling Allocations:</strong> {{this.siblingAllocations.length}}</p>
<p data-test-unique-placements class="minor-pair"><strong>Unique Client Placements:</strong> {{this.uniqueActiveAllocationNodes.length}}</p>
</div>
<div class="dashboard-metric with-divider">
<h3 class="pair">
<strong>Job:</strong>
<LinkTo
data-test-job
@route="jobs.job"
@model={{this.activeAllocation.job}}
@query={{hash jobNamespace=this.activeAllocation.job.namespace.id}} data-test-job>
@query={{hash jobNamespace=this.activeAllocation.job.namespace.id}}>
{{this.activeAllocation.job.name}}</LinkTo>
<span class="is-faded" data-test-task-group> / {{this.activeAllocation.taskGroupName}}</span>
</h3>
Expand All @@ -157,7 +160,7 @@
<div class="dashboard-metric with-divider">
<h3 class="pair">
<strong>Client:</strong>
<LinkTo @route="clients.client" @model={{this.activeAllocation.node}}>
<LinkTo data-test-client @route="clients.client" @model={{this.activeAllocation.node}}>
{{this.activeAllocation.node.shortId}}
</LinkTo>
</h3>
Expand All @@ -173,10 +176,10 @@
{{else}}
<div class="columns is-flush">
<div class="dashboard-metric column">
<p class="metric">{{this.model.nodes.length}} <span class="metric-label">Clients</span></p>
<p data-test-node-count class="metric">{{this.model.nodes.length}} <span class="metric-label">Clients</span></p>
</div>
<div class="dashboard-metric column">
<p class="metric">{{this.scheduledAllocations.length}} <span class="metric-label">Allocations</span></p>
<p data-test-alloc-count class="metric">{{this.scheduledAllocations.length}} <span class="metric-label">Allocations</span></p>
</div>
</div>
<div class="dashboard-metric with-divider">
Expand All @@ -185,6 +188,7 @@
<div class="column">
<div class="inline-chart" data-test-percentage-bar>
<progress
data-test-memory-progress-bar
class="progress is-danger is-small"
value="{{this.reservedMemoryPercent}}"
max="1">
Expand All @@ -193,10 +197,10 @@
</div>
</div>
<div class="column is-minimum">
<span class="nowrap" data-test-percentage>{{format-percentage this.reservedMemoryPercent total=1}}</span>
<span class="nowrap" data-test-memory-percentage>{{format-percentage this.reservedMemoryPercent total=1}}</span>
</div>
</div>
<div class="annotation" data-test-absolute-value>
<div class="annotation" data-test-memory-absolute-value>
<strong>{{format-bytes this.totalReservedMemory}}</strong> / {{format-bytes this.totalMemory}} reserved
</div>
</div>
Expand All @@ -206,6 +210,7 @@
<div class="column">
<div class="inline-chart" data-test-percentage-bar>
<progress
data-test-cpu-progress-bar
class="progress is-info is-small"
value="{{this.reservedCPUPercent}}"
max="1">
Expand All @@ -214,10 +219,10 @@
</div>
</div>
<div class="column is-minimum">
<span class="nowrap" data-test-percentage>{{format-percentage this.reservedCPUPercent total=1}}</span>
<span class="nowrap" data-test-cpu-percentage>{{format-percentage this.reservedCPUPercent total=1}}</span>
</div>
</div>
<div class="annotation" data-test-absolute-value>
<div class="annotation" data-test-cpu-absolute-value>
<strong>{{this.totalReservedCPU}} MHz</strong> / {{this.totalCPU}} MHz reserved
</div>
</div>
Expand Down