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

[ui] Adds meta k/v tables to Task Group and Task pages #24594

Merged
merged 6 commits into from
Dec 17, 2024
Merged

[ui] Adds meta k/v tables to Task Group and Task pages #24594

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
5c80ed0
Experimenting with a generic meta job-part component
philrenaud Dec 2, 2024
5902561
Taskstate.task gets me every time
philrenaud Dec 3, 2024
85b168f
continue-on-error false test
philrenaud Dec 3, 2024
2f5069a
continue-on-error back in, but explicit success check after exam
philrenaud Dec 3, 2024
935d000
Testfixes for new meta structure on tasks and groups
philrenaud Dec 5, 2024
1fb8c7e
Clean up test and dev code
philrenaud Dec 6, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions .changelog/24594.txt
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
```release-note:improvement
ui: Adds metadata tables to Task Group and Task pages
```
6 changes: 3 additions & 3 deletions ui/app/models/task-group.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -62,13 +62,13 @@ export default class TaskGroup extends Fragment {

@fragment('group-scaling') scaling;

@attr() meta;
@fragment('structured-attributes') meta;

@computed('job.meta.raw', 'meta')
@computed('job.meta.raw', 'meta.raw')
get mergedMeta() {
return {
...this.job.get('meta.raw'),
...this.meta,
...this.get('meta.raw'),
};
}

Expand Down
6 changes: 3 additions & 3 deletions ui/app/models/task.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,15 +21,15 @@ export default class Task extends Fragment {
@fragmentArray('action', { defaultValue: () => [] })
actions;

@attr() meta;
@fragment('structured-attributes') meta;

@fragment('task-schedule') schedule;

@computed('taskGroup.mergedMeta', 'meta')
@computed('meta.raw', 'taskGroup.mergedMeta')
get mergedMeta() {
return {
...this.taskGroup.mergedMeta,
...this.meta,
...this.meta?.raw,
Copy link
Contributor Author

Choose a reason for hiding this comment

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

You might notice that this is using the ...this.meta.raw format where the above task-group model is using this.get('meta.raw'). The get syntax is valid JS and everything, but is more of an old-ember convention, and task group models have existed longer than task models in our codebase.

You can see these old-ember ways of doing things scattered throughout: look for a @classic decorator near the top of the class declaration.

};
}

Expand Down
5 changes: 5 additions & 0 deletions ui/app/templates/allocations/allocation/task/index.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -287,4 +287,9 @@
</ListTable>
</div>
</div>
{{#if this.model.task.meta}}
<JobPage::Parts::Meta
@meta={{this.model.task.meta}}
/>
{{/if}}
</section>
4 changes: 2 additions & 2 deletions ui/app/templates/components/job-page.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@
PlacementFailures=(component "job-page/parts/placement-failures" job=@job)
TaskGroups=(component "job-page/parts/task-groups" job=@job)
RecentAllocations=(component "job-page/parts/recent-allocations" job=@job activeTask=@activeTask setActiveTaskQueryParam=@setActiveTaskQueryParam)
Meta=(component "job-page/parts/meta" job=@job)
Meta=(component "job-page/parts/meta" meta=@job.meta)
Copy link
Contributor Author

@philrenaud philrenaud Dec 6, 2024 •
edited
Loading

Choose a reason for hiding this comment

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

This generally changes the context from "This is a component for jobs, it knows how to get metadata from a job" to "This is a component for metadata, it is given metadata"

DasRecommendations=(component
"job-page/parts/das-recommendations" job=@job
)
Expand All @@ -35,4 +35,4 @@

)
)
}}
}}
4 changes: 2 additions & 2 deletions ui/app/templates/components/job-page/parts/meta.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,15 +3,15 @@
SPDX-License-Identifier: BUSL-1.1
~}}

{{#if @job.meta.structured}}
{{#if @meta.structured}}
<div class="boxed-section">
<div class="boxed-section-head">
Meta
</div>
<div class="boxed-section-body is-full-bleed">
<AttributesTable
data-test-meta
@attributePairs={{@job.meta.structured.root}}
@attributePairs={{@meta.structured.root}}
@class="attributes-table" />
</div>
</div>
Expand Down
8 changes: 7 additions & 1 deletion ui/app/templates/jobs/job/task-group.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -220,7 +220,7 @@
</t.head>
<t.body @key="model.id" as |row|>
<AllocationRow
{{keyboard-shortcut
{{keyboard-shortcut
enumerated=true
action=(action "gotoAllocation" row.model)
}}
Expand Down Expand Up @@ -360,4 +360,10 @@
</div>
</div>
{{/if}}

{{#if this.model.meta}}
<JobPage::Parts::Meta
@meta={{this.model.meta}}
/>
{{/if}}
</section>
4 changes: 4 additions & 0 deletions ui/mirage/factories/task-group.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -57,6 +57,9 @@ export default Factory.extend({
// When true, the group will simulate a "scheduled" block's paused state
withPausedTasks: false,

// When true, the tasks will have metadata
withTaskMeta: false,

afterCreate(group, server) {
let taskIds = [];
let volumes = Object.keys(group.volumes);
Expand Down Expand Up @@ -114,6 +117,7 @@ export default Factory.extend({
})),
createRecommendations: group.createRecommendations,
withSchedule: group.withPausedTasks,
withMeta: group.withTaskMeta,
});
});
taskIds = tasks.mapBy('id');
Expand Down
6 changes: 6 additions & 0 deletions ui/mirage/factories/task.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,8 @@ export default Factory.extend({
// Set in the TaskGroup factory
volumeMounts: [],

meta: null,

JobID: '',

name: (id) => `task-${dasherize(faker.hacker.noun())}-${id}`,
Expand Down Expand Up @@ -128,5 +130,9 @@ export default Factory.extend({
});
task.update({ schedule: schedule });
}

if (task.withMeta) {
task.update({ meta: { raw: { foo: 'bar' } } });
}
Copy link
Contributor Author

Choose a reason for hiding this comment

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

This is a factory file! Used by our mocking service (Mirage), and our tests, this gives us some private convenience methods when creating mocked objects like tasks/task groups. In this case, applying withTaskMeta to a task group will make a group with as many allocations/tasks as you'd like, each of which having some basic metadata.

},
});
23 changes: 22 additions & 1 deletion ui/tests/acceptance/task-detail-test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,6 @@ import a11yAudit from 'nomad-ui/tests/helpers/a11y-audit';
import Task from 'nomad-ui/tests/pages/allocations/task/detail';
import Layout from 'nomad-ui/tests/pages/layout';
import moment from 'moment';

let allocation;
let task;

Expand Down Expand Up @@ -213,6 +212,28 @@ module('Acceptance | task detail', function (hooks) {
});
});

test('when a task group has metadata, the metadata table is shown', async function (assert) {
const job = server.create('job', {
createAllocations: false,
});
const taskGroup = server.create('task-group', {
job,
name: 'scaling',
count: 1,
withTaskMeta: true,
});
job.update({ taskGroupIds: [taskGroup.id] });
allocation = server.db.allocations[1];
server.db.taskStates.update(
{ allocationId: allocation.id },
{ state: 'running' }
);
const jobTask = taskGroup.tasks.models[0];
task = jobTask;
await Task.visit({ id: allocation.id, name: task.name });
assert.ok(Task.hasMeta);
});

test('each recent event should list the time, type, and description of the event', async function (assert) {
const event = server.db.taskEvents.where({ taskStateId: task.id })[0];
const recentEvent = Task.events.objectAt(Task.events.length - 1);
Expand Down
13 changes: 13 additions & 0 deletions ui/tests/acceptance/task-group-detail-test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -453,6 +453,19 @@ module('Acceptance | task group detail', function (hooks) {
assert.notOk(TaskGroup.hasVolumes);
});

test('when the task group has metadata, the metadata table is shown', async function (assert) {
job = server.create('job', {
meta: { raw: { a: 'b' } },
});
taskGroup = server.create('task-group', {
job,
meta: { raw: { foo: 'bar' } },
});
await TaskGroup.visit({ id: job.id, name: taskGroup.name });

assert.ok(TaskGroup.hasMeta);
});

test('each row in the volumes table lists information about the volume', async function (assert) {
await TaskGroup.visit({ id: job.id, name: taskGroup.name });

Expand Down
2 changes: 2 additions & 0 deletions ui/tests/pages/allocations/task/detail.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -60,6 +60,8 @@ export default create({
clientSource: text('[data-test-volume-client-source]'),
}),

hasMeta: isPresent('[data-test-meta]'),
Copy link
Contributor Author

Choose a reason for hiding this comment

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

These are "test pages": a way to have nice syntactic sugar in our actual tests (like assert.ok(task.hasMeta)) instead of making the tests themselves feel verbose.


events: collection('[data-test-task-event]', {
time: text('[data-test-task-event-time]'),
type: text('[data-test-task-event-type]'),
Expand Down
2 changes: 2 additions & 0 deletions ui/tests/pages/jobs/job/task-group.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -54,6 +54,8 @@ export default create({
permissions: text('[data-test-volume-permissions]'),
}),

hasMeta: isPresent('[data-test-meta]'),

hasScaleEvents: isPresent('[data-test-scale-events]'),
scaleEvents: collection(
'[data-test-scale-events] [data-test-accordion-head]',
Expand Down
16 changes: 7 additions & 9 deletions ui/tests/unit/models/task-group-test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -76,24 +76,22 @@ module('Unit | Model | task-group', function (hooks) {
const jobWithMeta = run(() =>
store.createRecord('job', {
name: 'example-with-meta',
meta: store.createFragment('structured-attributes', {
raw: { a: 'b' },
}),
meta: { raw: { a: 'b' } },
taskGroups: [
{
name: 'one',
meta: { c: 'd' },
meta: { raw: { c: 'd' } },
},
{
name: 'two',
},
{
name: 'three',
meta: null,
meta: { raw: null },
},
{
name: 'four',
meta: {},
meta: { raw: {} },
},
],
})
Expand All @@ -114,18 +112,18 @@ module('Unit | Model | task-group', function (hooks) {
taskGroups: [
{
name: 'one',
meta: { c: 'd' },
meta: { raw: { c: 'd' } },
},
{
name: 'two',
},
{
name: 'three',
meta: null,
meta: { raw: null },
},
{
name: 'four',
meta: {},
meta: { raw: {} },
},
],
})
Expand Down
14 changes: 7 additions & 7 deletions ui/tests/unit/models/task-test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,22 +20,22 @@ module('Unit | Model | task', function (hooks) {
taskGroups: [
{
name: 'one',
meta: { a: 'b' },
meta: { raw: { a: 'b' } },
tasks: [
{
name: 'task-one',
meta: { c: 'd' },
meta: { raw: { c: 'd' } },
},
{
name: 'task-two',
},
{
name: 'task-three',
meta: null,
meta: { raw: null },
},
{
name: 'task-four',
meta: {},
meta: { raw: {} },
},
],
},
Expand All @@ -44,18 +44,18 @@ module('Unit | Model | task', function (hooks) {
tasks: [
{
name: 'task-one',
meta: { c: 'd' },
meta: { raw: { c: 'd' } },
},
{
name: 'task-two',
},
{
name: 'task-three',
meta: null,
meta: { raw: null },
},
{
name: 'task-four',
meta: {},
meta: { raw: {} },
},
],
},
Expand Down
Loading