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.

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

System Batch UI, Client Status Bar Chart and Client Tab page view #11078

Merged
merged 66 commits into from
Oct 7, 2021

Conversation

ChaiWithJai
Copy link
Contributor

@ChaiWithJai ChaiWithJai commented Aug 24, 2021

This PR is linked to this umbrella issue.

It should cover the following:

  • Create custom page for sysbatch jobs
  • Create custom page for periodic and dispatch sysbatch jobs
  • Create job client status bar
    • Compute aggregate job status for each client
    • Display the status in the bar summary
    • Make each segment clickable (alternatively, make legend items clickable)
    • Display help message when hovering over each status
    • Display client list popover when hovering over a segment
    • Pick colours for the new statuses
  • Display job constrains, if any, if there are "not scheduled" clients
  • Create Clients tab
    • Display table
    • Make rows clickable
    • Display job status and colour code
    • Paginate table
    • Make table searchable
    • Add table filters, making sure filters can be applied via URL params

Cases to test:

  • Job with multiple groups
  • Job with constraints at each level (job, group and task)
  • Job in non-default namespace
  • periodic and parameterized sysbatch jobs
  • Adding nodes after sysbatch job is registered
  • Automatic data update

@github-actions
Copy link

github-actions bot commented Aug 24, 2021

Ember Asset Size action

As of 8c8c3fd

Files that got Bigger 🚨:

File raw gzip
nomad-ui.js +36.4 kB +4.47 kB
nomad-ui.css +876 B +140 B

Files that stayed the same size 🤷‍:

File raw gzip
vendor.js 0 B 0 B
vendor.css 0 B 0 B

Copy link

@motobrowning motobrowning left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

So I'm at a complete loss on all levels. If I'm supposed to be doing something that I'm not, could someone please politely let me know. I'm losing my mind here.

@github-actions
Copy link

github-actions bot commented Aug 24, 2021

Ember Test Audit comparison

main 8c8c3fd change
passes 1135 1191 +56
failures 0 0 0
flaky 0 0 0
duration 9m 20s 238ms 8m 31s 219ms -49s 019ms

@github-actions
Copy link

Ember Test Audit flaky tests

Ember Test Audit detected these flaky tests on 38f764f:

  • Acceptance | allocation detail (preemptions): shows a dedicated section to the allocation that preempted this allocation
  • Acceptance | job definition: when changes are submitted, the site redirects to the job overview page
  • Acceptance | job detail (with namespaces): the exec button state can change between namespaces
  • Acceptance | job detail (with namespaces): when the dynamic autoscaler is applied, you can scale a task within the job detail page
  • Acceptance | job versions: all versions but the current one have a button to revert to that version
  • Acceptance | jobs list: each job row should link to the corresponding job
  • Acceptance | regions (only one): pages do not include the region query param
  • Acceptance | regions (many): when the region is not the default region, all api requests other than the agent/self request include the region query param
  • Acceptance | search: search exposes and navigates to results from the fuzzy search endpoint
  • Acceptance | task detail (different namespace): breadcrumbs match jobs / job / task group / allocation / task
  • Acceptance | task detail (not running): when the allocation for a task is not running, the resource utilization graphs are replaced by an empty message
  • Acceptance | task group detail: /jobs/:id/:task-group second breadcrumb should link to the job for the task group
  • Acceptance | tokens: when the ott query parameter is present upon application load it’s exchanged for a token

@github-actions
Copy link

Ember Test Audit flaky tests

Ember Test Audit detected these flaky tests on 2c96d75:

  • Acceptance | allocation detail (preemptions): shows a dedicated section to the allocation that preempted this allocation
  • Acceptance | job definition: when changes are submitted, the site redirects to the job overview page
  • Acceptance | job detail (with namespaces): the exec button state can change between namespaces
  • Acceptance | jobs list: each job row should link to the corresponding job
  • Acceptance | regions (only one): pages do not include the region query param
  • Acceptance | regions (only one): api requests do not include the region query param
  • Acceptance | regions (many): when the region is not the default region, all api requests other than the agent/self request include the region query param
  • Acceptance | search: search exposes and navigates to results from the fuzzy search endpoint
  • Acceptance | task group detail: /jobs/:id/:task-group second breadcrumb should link to the job for the task group
  • Acceptance | tokens: when the ott query parameter is present upon application load it’s exchanged for a token
  • Acceptance | topology: when an allocation is selected, the info panel shows information on the allocation
  • Integration | Component | TopoViz: clicking on an allocation in a deeply nested TopoViz::Node will associate sibling allocations with curves
  • Integration | Component | TopoViz: when the count of sibling allocations is high enough relative to the node count, curves are not rendered
  • Integration | Utility | exec-socket-xterm-adapter: resizing the window passes a resize message through the socket

@github-actions
Copy link

github-actions bot commented Oct 7, 2021

Ember Test Audit flaky tests

Ember Test Audit detected these flaky tests on c38c0a5:

  • Acceptance | task group detail: /jobs/:id/:task-group second breadcrumb should link to the job for the task group
  • Integration | Component | TopoViz: clicking on an allocation in a deeply nested TopoViz::Node will associate sibling allocations with curves
  • Integration | Component | TopoViz: when the count of sibling allocations is high enough relative to the node count, curves are not rendered
  • Integration | Utility | exec-socket-xterm-adapter: resizing the window passes a resize message through the socket

@github-actions
Copy link

github-actions bot commented Oct 7, 2021

Ember Test Audit flaky tests

Ember Test Audit detected these flaky tests on dc22c75:

  • Acceptance | task group detail: /jobs/:id/:task-group second breadcrumb should link to the job for the task group
  • Integration | Component | TopoViz: clicking on an allocation in a deeply nested TopoViz::Node will associate sibling allocations with curves
  • Integration | Component | TopoViz: when the count of sibling allocations is high enough relative to the node count, curves are not rendered
  • Integration | Utility | exec-socket-xterm-adapter: resizing the window passes a resize message through the socket

Copy link
Contributor

@lgfa29 lgfa29 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

:shipit: 🎉

@lgfa29 lgfa29 merged commit 0564f9f into main Oct 7, 2021
@lgfa29 lgfa29 deleted the f-sysbatch-ui branch October 7, 2021 21:11
lgfa29 added a commit that referenced this pull request Oct 8, 2021
lgfa29 added a commit that referenced this pull request Oct 14, 2021
Copy link
Contributor

@DingoEatingFuzz DingoEatingFuzz left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is top-notch work! All my comments are mere observations. Thank you for shipping this neat UI at the same time as the core feature ❤️

@@ -25,7 +25,8 @@ module.exports = function(environment) {

APP: {
blockingQueries: true,
mirageScenario: 'topoMedium',
// TODO: revert before merging to main.
mirageScenario: 'sysbatchSmall', // convert to 'sysbatchSmall' when working on feature
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oops. topoMedium isn't a particularly good default scenario anyway.

Comment on lines +63 to +65
const clientIDs = clients.sortBy('id').map(c => c.id);
const clientsInTable = Clients.clients.map(c => c.id).sort();
assert.deepEqual(clientsInTable, clientIDs);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ideally page object collections aren't sorted, and instead of the fixture data is sorted to match what the app behavior is. Either way, good to have coverage here.

Comment on lines +84 to +85
assert.true(hasTooltip, `row ${index} has ${col} tooltip`);
assert.ok(tooltipText, `row ${index} has ${col} tooltip content ${tooltipText}`);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

These two assertion methods do the same thing. assert.ok is the method we have used in Nomad.

Comment on lines +19 to +26
moduleForJobWithClientStatus('Acceptance | job detail with client status (system)', () =>
server.create('job', {
status: 'running',
datacenters: ['dc1'],
type: 'system',
createAllocations: false,
})
);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

No harm in continuing the pattern of creating new moduleFor* utilities, but now the more idiomatic thing to do is use hooks to add common behavior. Something like:

module('Acceptance | job detail with client status (system)', function(hooks) {
  setupJobWithClientStatus(hooks);

  test('...');
});

Comment on lines +195 to +199
for (var testName in additionalTests) {
test(testName, async function(assert) {
await additionalTests[testName].call(this, job, assert);
});
}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

For annoying legacy JavaScript reasons, this would be better as a for...of loop.


assert.deepEqual(result, expected);
});
});
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Great test coverage on the hairy bits of this util 👏

@github-actions
Copy link

I'm going to lock this pull request because it has been closed for 120 days ⏳. This helps our maintainers find and focus on the active contributions.
If you have found a problem that seems related to this change, please open a new issue and complete the issue template so we can capture all the details necessary to investigate further.

@github-actions github-actions bot locked as resolved and limited conversation to collaborators Nov 12, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

4 participants