UI: Background Polling Step 1 - Foundational support & jobs #3893

DingoEatingFuzz · 2018-02-21T00:55:59Z

First thing's first, gifs!

Starting a couple jobs and watching allocations go through various states

Deploying a new version of a service job

Details

This first step is the biggest step. It is all the underpinning required to leverage Nomad's blocking queries for long-polling updates for the UI. It's done using Ember and Ember Data, of course, as well as Ember Concurrency for task management and a fair amount of customizations to the adapter and serializer layers of Ember Data.

With that foundation in place, getting pages to watch resources is pretty straightforward. Future PRs for this background polling project should be much smaller and come at a regular pace.

meirish · 2018-03-02T22:12:57Z

ui/app/adapters/watchable.js

+        xhr.abort();
+      }
+    }
+  },


👏 👏 👏 wow this file - super bummer there's not a better way to cancel requests than to manually track and reach down into the jquery XHR object, but still this is 👌

Yeah. Though with a promise-based workflow, there isn't a good place to expose the XHR. And promises aren't cancelable, so that avenue doesn't work either. Maybe we need AjaxPromiseProxies to come back from store methods.

meirish · 2018-03-02T22:16:52Z

ui/app/components/distribution-bar.js

@@ -66,14 +66,18 @@ export default Component.extend(WindowResizable, {
    this.renderChart();
  },

+  updateChart: observer('_data.@each.{value,label,className}', function() {
+    this.renderChart();


So with the more live updating - does this.renderChart() need to be an e-c task? Just curious if there's a small chance of race between updating the data more frequently, drawing the chart, and navigating away from the page/component.

The chart rendering is entirely synchronous, so it should be fine.

meirish · 2018-03-02T22:27:12Z

ui/app/models/task-group.js

@@ -4,6 +4,8 @@ import attr from 'ember-data/attr';
 import { fragmentOwner, fragmentArray } from 'ember-data-model-fragments/attributes';
 import sumAggregation from '../utils/properties/sum-aggregation';

+const maybe = arr => arr || [];


Loosely inspired by Haskell.

meirish · 2018-03-02T22:46:16Z

ui/app/utils/wait.js

@@ -0,0 +1,10 @@
+import RSVP from 'rsvp';


Seems weird that the fn is timeout which is also the default export from a file called wait. Not a big deal, but I'd rename the file.

Good catch. I just save as'd the existing timeout.js. I'll rename the function here.

meirish · 2018-03-02T22:48:00Z

ui/tests/acceptance/job-detail-test.js

@@ -79,6 +79,11 @@ test('when switching namespaces, the app redirects to /jobs with the new namespa

  visit(`/jobs/${job.id}?namespace=${namespace.name}`);

+  // andThen(() => {


Did you mean to leave this in?

meirish · 2018-03-02T22:51:44Z

ui/tests/unit/adapters/node-test.js

+            .mapBy('id')
+            .sort(),
+          ['node-1-2', 'node-2-1', 'node-2-2'],
+          'The deleted allocation is removed from the store and the allocations associated with the other node are untouched'


meirish · 2018-03-02T22:52:49Z

ui/tests/utils/push-payload-to-store.js

+  run(() => {
+    store._push(payload);
+    store._didUpdateAll(modelName);
+  });


huh, TIL that does look handy

meirish

This looks really great and you did a nice job of separating and packaging up the complexity of the polling parts. I had one question about a race (maybe it's not an issue because d3 is fast enough™?), but other than that mega 👍 here.

Now that blocking queries are going to be in play, We can no longer pretend the two requests are one, since they have independent nomad indices.

- Service to manage X-Nomad-Index values - Adapter method for reloading relationships with additional params - Pattern for watching models and model relationships using EC

- Key data using datum label (when something goes from number, to zero, to number again) - Retain active and inactive classes across data updates

Ember Data doesn't do this by default, instead opting to be as non-destructive as possible. However, this is desired behavior.

When the findAll response from the server no longer has them.

github-actions · 2023-03-11T02:14:10Z

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.

DingoEatingFuzz added the theme/ui label Feb 21, 2018

DingoEatingFuzz force-pushed the f-ui-polling-foundation branch from 4dd6b38 to 77fe4f3 Compare February 23, 2018 00:10

meirish reviewed Mar 2, 2018

View reviewed changes

meirish approved these changes Mar 2, 2018

View reviewed changes

DingoEatingFuzz added 20 commits March 2, 2018 16:21

Refactor job summary to a relationship

18782dd

Now that blocking queries are going to be in play, We can no longer pretend the two requests are one, since they have independent nomad indices.

Re-render chart whenever data changes

66d0eab

Prototype watching resources

9b2080d

- Service to manage X-Nomad-Index values - Adapter method for reloading relationships with additional params - Pattern for watching models and model relationships using EC

Move watch tasks into a utils file

5bf5448

Fix distribution-bar bugs found with live data

27a32a7

- Key data using datum label (when something goes from number, to zero, to number again) - Retain active and inactive classes across data updates

Add a watchAll computed property macro

6bf66f9

Make the throttle time configurable

4dd6972

Blocking query support for findAll requests

bc29457

Remove records from the store when they are no longer in array responses

5e4491c

Ember Data doesn't do this by default, instead opting to be as non-destructive as possible. However, this is desired behavior.

Watch all records on the jobs list page

702228e

Watch for summary changes in job-row

b675d97

Remove stale records from the store for findHasMany requests

8a119d9

Track xhrs in the watchable adapter and expose cancellation methods

ed809fe

Watch properties cancel long poll requests

b69fe31

Cancel watch tasks when appropriate

dbc9903

Generalized solution for removing records in the local store

60ee871

When the findAll response from the server no longer has them.

Fix existing tests

3c2a1f8

Watchable request helper for Mirage

0a0cea0

Tests for watching and canceling requests

504ff2d

Add tests for findAll store culling

7c51270

DingoEatingFuzz added 3 commits March 2, 2018 16:21

Add tests for findHasMany store culling

47dad64

Json viewer isn't side effect free, so use a copy

6c3a091

Set slices after merging the selection

5dd83fd

DingoEatingFuzz force-pushed the f-ui-polling-foundation branch from 77fe4f3 to 27867a5 Compare March 3, 2018 00:26

Address headers and ID bugs

421f082

DingoEatingFuzz force-pushed the f-ui-polling-foundation branch from 27867a5 to 421f082 Compare March 3, 2018 00:28

DingoEatingFuzz merged commit 2f93dea into f-ui-polling Mar 4, 2018

DingoEatingFuzz deleted the f-ui-polling-foundation branch March 4, 2018 02:17

DingoEatingFuzz mentioned this pull request Mar 5, 2018

UI: Live updating views #3936

Merged

3 tasks

github-actions bot locked as resolved and limited conversation to collaborators Mar 11, 2023

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

UI: Background Polling Step 1 - Foundational support & jobs #3893

UI: Background Polling Step 1 - Foundational support & jobs #3893

DingoEatingFuzz commented Feb 21, 2018

meirish Mar 2, 2018

DingoEatingFuzz Mar 3, 2018

meirish Mar 2, 2018

DingoEatingFuzz Mar 3, 2018

meirish Mar 2, 2018

DingoEatingFuzz Mar 3, 2018

meirish Mar 2, 2018

DingoEatingFuzz Mar 3, 2018

meirish Mar 2, 2018

DingoEatingFuzz Mar 3, 2018

meirish Mar 2, 2018

meirish Mar 2, 2018

meirish left a comment

github-actions bot commented Mar 11, 2023

		@@ -79,6 +79,11 @@ test('when switching namespaces, the app redirects to /jobs with the new namespa

		visit(`/jobs/${job.id}?namespace=${namespace.name}`);

		// andThen(() => {

UI: Background Polling Step 1 - Foundational support & jobs #3893

UI: Background Polling Step 1 - Foundational support & jobs #3893

Conversation

DingoEatingFuzz commented Feb 21, 2018

Details

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

meirish left a comment

Choose a reason for hiding this comment

github-actions bot commented Mar 11, 2023