TypeScriptify visualize loader #21025

timroes · 2018-07-20T11:36:25Z

This PR also refactores and improves a couple of minor issues:

We now throw an error in case we cannot find the request/response handler for a visualization instead of failing obscure.
Rename visualizeLoader to visualizeLoader.render
Remove a couple of unused services is VisualizeLoader
Actually check in courier request handler if timeRange is set before applying it as a filter.
When calling fetchAndRender multiple times we now force a fetch as long as a single one of those calls was a forceFetch call. Previously we always used the parameter passed to the last call before debounce was triggered.
Only use timeRange in date_histogram if it isn't undefined.

elasticmachine · 2018-07-20T12:47:11Z

💔 Build Failed

continuous-integration/kibana-ci/pull-request

elasticmachine · 2018-07-23T16:43:29Z

💔 Build Failed

continuous-integration/kibana-ci/pull-request

elasticmachine · 2018-07-23T18:29:48Z

💔 Build Failed

continuous-integration/kibana-ci/pull-request

elasticmachine · 2018-07-24T07:41:42Z

💔 Build Failed

continuous-integration/kibana-ci/pull-request

timroes · 2018-07-24T09:22:09Z

Jenkins, test this

elasticmachine · 2018-07-24T10:41:20Z

💔 Build Failed

continuous-integration/kibana-ci/pull-request

elasticmachine · 2018-07-24T12:33:18Z

💔 Build Failed

continuous-integration/kibana-ci/pull-request

ppisljar · 2018-07-24T12:34:36Z

UI Functional Tests.test/functional/apps/dashboard/_embeddable_rendering·js.dashboard app using current data dashboard embeddable rendering adding visualizations (from (UI Functional Tests.xml))

i think the failiure is relevant, but just to be sure:

jenkins, test this

weltenwort

Quite a challenging undertaking, but aside from a few suggestions below it looks quite good to me.

weltenwort · 2018-07-24T12:53:30Z

src/ui/public/chrome/index.d.ts

@@ -17,8 +17,13 @@
 * under the License.
 */

+interface IInjector {


Have you considered using auto.IInjectorService from https://github.com/DefinitelyTyped/DefinitelyTyped/blob/a2a659c351b611398fd2f3f577fd545dab335306/types/angular/index.d.ts#L132 instead? The @types/angular package is already a dependency.

The auto namespace is not exported, so unfortunately we can't use that typing (I have no idea why the typing doesn't export that type, since it's a legit service to inject).

weltenwort · 2018-07-24T13:04:24Z

src/ui/public/visualize/loader/__tests__/visualize_loader.js

        const handler = loader.embedVisualizationWithSavedObject(newContainer()[0], createSavedObject(), {
          timeRange: { from: 'now-7d', to: 'now' }
        });
+
+        // Wait for the initial fetch and render to happen
+        await timeout(150);


I'm sure there is a reason for using these timeouts here, but I can't not comment on it. It looks like a flaky test in the making. 😉 Is there no way to synchronously force the "fetch and render to happen"? Maybe the time mocking functionality of sinon can be of use?

Unfortunately we currently cannot (I think I left a comment in the timeout below), since we use a too old lodash version. Basically we need to wait for the debounce to happen. Lodash prior 4, does not properly work together with jest or sinon fake timers, so that's the most reasonable way to trigger it imho. Also since we don't wait for something "arbitrary long" I don't think that will ever introduce flakyness, but we just need the debounce to be triggered. As soon as we update to lodash 4, we can use sinon.useFakeTimers() instead to make this sync.

How do you know that the debounce has always happened after 150ms? That looks suspiciously arbitrary. 😇 waiting for the "next tick" like in the prior test cases is not sufficient?

Unfortunately that's not enough, since in that case we actually need to wait for the debounce to be done, while the above doesn't care about that. After an update to lodash 4 that might be better, since we don't need to give it an arbitrary number here anymore, but can "flush" all pending debounce operations.

weltenwort · 2018-07-24T13:30:38Z

src/ui/public/visualize/loader/visualize_data_loader.ts

+ */
+import { isEqual } from 'lodash';
+
+// @ts-ignore


How about adding stub .d.ts files with any exports for these registries and similar imports in this file to avoid masking other problems with blanket @ts-ignores?

weltenwort · 2018-07-24T13:35:37Z

src/ui/public/vis/request_handlers/request_handlers.d.ts

+  queryFilter: QueryFilter;
+}
+
+export type RequestHandler = (vis: Vis, params: RequestHandlerParams) => any;


Would it be helpful to add a generic type argument for the return value?

src/ui/public/visualize/loader/visualize_data_loader.ts

+  private previousRequestHandlerResponse: any;
+
+  constructor(private readonly vis: Vis, Private: IPrivate) {
+    const { requestHandler, responseHandler } = vis.type;


weltenwort · 2018-07-24T13:47:08Z

src/ui/public/visualize/loader/visualize_loader.ts

+ */
+
+import chrome from '../../chrome';
+// @ts-ignore implicit-any


How about adding that export to the type in the corresponding query_filter.d.ts?

timroes · 2018-07-24T14:34:22Z

Adressed all issues and merged master to include #20863

elasticmachine · 2018-07-24T17:25:25Z

💚 Build Succeeded

continuous-integration/kibana-ci/pull-request

ppisljar

LGTM, tested on chrome linux

elasticmachine · 2018-07-24T22:12:43Z

💔 Build Failed

continuous-integration/kibana-ci/pull-request

timroes · 2018-07-24T22:22:50Z

Jenkins, test this

elasticmachine · 2018-07-24T23:34:46Z

💚 Build Succeeded

continuous-integration/kibana-ci/pull-request

* TypeScriptify Vis loaders * Fix issue with undefined timeRange * Fix chrome typing * Fix unit tests * Fix this issue * Add missing uiState to request handler * Implement Felix's suggestions * Add timefilter listener

bhavyarm · 2018-08-02T21:19:54Z

How do we test this PR @timroes? Thanks!

timroes · 2018-08-06T16:09:06Z

@bhavyarm Ideally this PR should not have changed any functionality, so it cannot be tested from a functional point. But all visualizations (everywhere) should still work.

timroes added chore Feature:Visualizations Generic visualization features (in case no more specific feature label is available) v7.0.0 Feature:Vis Loader Visualize loader APIs v6.4.0 labels Jul 20, 2018

timroes requested review from markov00 and ppisljar July 20, 2018 11:36

Tim Roes added 2 commits July 23, 2018 16:58

TypeScriptify Vis loaders

1e84014

Fix issue with undefined timeRange

5b9548e

timroes force-pushed the ts-loaders branch from 65effe7 to 5b9548e Compare July 23, 2018 15:04

timroes requested a review from weltenwort July 23, 2018 15:18

Fix chrome typing

cd1099f

Fix unit tests

d72fc6a

Tim Roes added 2 commits July 24, 2018 12:49

Merge branch 'master' into ts-loaders

14ea5c6

Fix this issue

52ae072

Add missing uiState to request handler

541bec5

weltenwort reviewed Jul 24, 2018

View reviewed changes

Tim Roes added 3 commits July 24, 2018 16:28

Implement Felix's suggestions

95d8998

Merge branch 'master' into ts-loaders

6731a89

Add timefilter listener

9a05a8c

ppisljar approved these changes Jul 24, 2018

View reviewed changes

weltenwort approved these changes Jul 24, 2018

View reviewed changes

Merge branch 'master' into ts-loaders

afe91c7

timroes merged commit 967cb4e into elastic:master Jul 25, 2018

timroes deleted the ts-loaders branch July 25, 2018 05:56

timroes mentioned this pull request Jul 25, 2018

[6.x] TypeScriptify visualize loader (#21025) #21190

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

TypeScriptify visualize loader #21025

TypeScriptify visualize loader #21025

timroes commented Jul 20, 2018 •

edited

Loading

elasticmachine commented Jul 20, 2018

elasticmachine commented Jul 23, 2018

elasticmachine commented Jul 23, 2018

elasticmachine commented Jul 24, 2018

timroes commented Jul 24, 2018

elasticmachine commented Jul 24, 2018

elasticmachine commented Jul 24, 2018

ppisljar commented Jul 24, 2018

weltenwort left a comment

weltenwort Jul 24, 2018

timroes Jul 24, 2018

weltenwort Jul 24, 2018

weltenwort Jul 24, 2018

timroes Jul 24, 2018

weltenwort Jul 24, 2018

timroes Jul 24, 2018

weltenwort Jul 24, 2018

weltenwort Jul 24, 2018

This comment was marked as resolved.

weltenwort Jul 24, 2018

timroes commented Jul 24, 2018

elasticmachine commented Jul 24, 2018

ppisljar left a comment

elasticmachine commented Jul 24, 2018

timroes commented Jul 24, 2018

elasticmachine commented Jul 24, 2018

bhavyarm commented Aug 2, 2018

timroes commented Aug 6, 2018

TypeScriptify visualize loader #21025

TypeScriptify visualize loader #21025

Conversation

timroes commented Jul 20, 2018 • edited Loading

elasticmachine commented Jul 20, 2018

💔 Build Failed

elasticmachine commented Jul 23, 2018

💔 Build Failed

elasticmachine commented Jul 23, 2018

💔 Build Failed

elasticmachine commented Jul 24, 2018

💔 Build Failed

timroes commented Jul 24, 2018

elasticmachine commented Jul 24, 2018

💔 Build Failed

elasticmachine commented Jul 24, 2018

💔 Build Failed

ppisljar commented Jul 24, 2018

weltenwort left a 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

This comment was marked as resolved.

Choose a reason for hiding this comment

timroes commented Jul 24, 2018

elasticmachine commented Jul 24, 2018

💚 Build Succeeded

ppisljar left a comment

Choose a reason for hiding this comment

elasticmachine commented Jul 24, 2018

💔 Build Failed

timroes commented Jul 24, 2018

elasticmachine commented Jul 24, 2018

💚 Build Succeeded

bhavyarm commented Aug 2, 2018

timroes commented Aug 6, 2018

timroes commented Jul 20, 2018 •

edited

Loading