diff --git a/superset-frontend/package-lock.json b/superset-frontend/package-lock.json index cfce2b27b25a5..07f65c10fcb0e 100644 --- a/superset-frontend/package-lock.json +++ b/superset-frontend/package-lock.json @@ -6888,9 +6888,9 @@ } }, "@superset-ui/legacy-plugin-chart-world-map": { - "version": "0.13.3", - "resolved": "https://registry.npmjs.org/@superset-ui/legacy-plugin-chart-world-map/-/legacy-plugin-chart-world-map-0.13.3.tgz", - "integrity": "sha512-mYEvvgjYWAXvCxTxNkqk4x1wPs3qASBDb/sxSaM+uJrapjm5o6NU3+u7rw00+p2/lf8sQ4HGwW2u3rVJgwBFug==", + "version": "0.13.6", + "resolved": "https://registry.npmjs.org/@superset-ui/legacy-plugin-chart-world-map/-/legacy-plugin-chart-world-map-0.13.6.tgz", + "integrity": "sha512-Ddpik0FC5Iqe4wkJfbyjFPZJ1RoVw3PPhL00h4kEP+lWcdqBhl571vCNPnPLZtqwv/9x0H/xQ8B6w8/1Mb4zPg==", "requires": { "d3": "^3.5.17", "datamaps": "^0.5.8", @@ -6963,9 +6963,9 @@ } }, "@superset-ui/plugin-chart-word-cloud": { - "version": "0.13.3", - "resolved": "https://registry.npmjs.org/@superset-ui/plugin-chart-word-cloud/-/plugin-chart-word-cloud-0.13.3.tgz", - "integrity": "sha512-TCnu/DvPJA+I7jBool0roc8cfEpPrgK5+NCCq2Fj/vzHZl5EYtJReTf66O2ckXqWuoiFnxkFT7iS6PmEP5QOiA==", + "version": "0.13.5", + "resolved": "https://registry.npmjs.org/@superset-ui/plugin-chart-word-cloud/-/plugin-chart-word-cloud-0.13.5.tgz", + "integrity": "sha512-wsGPUDh5ZIh9RppbhyqnAZ8vmCVg+5X1uU+QbyxD7CwFaf/F8/XD3K2DMTpMo9QKtumilVG+u1exsOG2Dv7+KQ==", "requires": { "@types/d3-cloud": "^1.2.1", "@types/d3-scale": "^2.0.2", @@ -10316,28 +10316,28 @@ "dependencies": { "abbrev": { "version": "1.1.1", - "resolved": false, + "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.1.1.tgz", "integrity": "sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q==", "dev": true, "optional": true }, "ansi-regex": { "version": "2.1.1", - "resolved": false, + "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz", "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=", "dev": true, "optional": true }, "aproba": { "version": "1.2.0", - "resolved": false, + "resolved": "https://registry.npmjs.org/aproba/-/aproba-1.2.0.tgz", "integrity": "sha512-Y9J6ZjXtoYh8RnXVCMOU/ttDmk1aBjunq9vO0ta5x85WDQiQfUF9sIPBITdbiiIVcBo03Hi3jMxigBtsddlXRw==", "dev": true, "optional": true }, "are-we-there-yet": { "version": "1.1.5", - "resolved": false, + "resolved": "https://registry.npmjs.org/are-we-there-yet/-/are-we-there-yet-1.1.5.tgz", "integrity": "sha512-5hYdAkZlcG8tOLujVDTgCT+uPX0VnpAH28gWsLfzpXYm7wP6mp5Q/gYyR7YQ0cKVJcXJnl3j2kpBan13PtQf6w==", "dev": true, "optional": true, @@ -10348,14 +10348,14 @@ }, "balanced-match": { "version": "1.0.0", - "resolved": false, + "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.0.tgz", "integrity": "sha1-ibTRmasr7kneFk6gK4nORi1xt2c=", "dev": true, "optional": true }, "brace-expansion": { "version": "1.1.11", - "resolved": false, + "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==", "dev": true, "optional": true, @@ -10366,28 +10366,28 @@ }, "code-point-at": { "version": "1.1.0", - "resolved": false, + "resolved": "https://registry.npmjs.org/code-point-at/-/code-point-at-1.1.0.tgz", "integrity": "sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c=", "dev": true, "optional": true }, "concat-map": { "version": "0.0.1", - "resolved": false, + "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz", "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=", "dev": true, "optional": true }, "console-control-strings": { "version": "1.1.0", - "resolved": false, + "resolved": "https://registry.npmjs.org/console-control-strings/-/console-control-strings-1.1.0.tgz", "integrity": "sha1-PXz0Rk22RG6mRL9LOVB/mFEAjo4=", "dev": true, "optional": true }, "core-util-is": { "version": "1.0.2", - "resolved": false, + "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz", "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac=", "dev": true, "optional": true @@ -10404,35 +10404,35 @@ }, "deep-extend": { "version": "0.6.0", - "resolved": false, + "resolved": "https://registry.npmjs.org/deep-extend/-/deep-extend-0.6.0.tgz", "integrity": "sha512-LOHxIOaPYdHlJRtCQfDIVZtfw/ufM8+rVj649RIHzcm/vGwQRXFt6OPqIFWsm2XEMrNIEtWR64sY1LEKD2vAOA==", "dev": true, "optional": true }, "delegates": { "version": "1.0.0", - "resolved": false, + "resolved": "https://registry.npmjs.org/delegates/-/delegates-1.0.0.tgz", "integrity": "sha1-hMbhWbgZBP3KWaDvRM2HDTElD5o=", "dev": true, "optional": true }, "detect-libc": { "version": "1.0.3", - "resolved": false, + "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-1.0.3.tgz", "integrity": "sha1-+hN8S9aY7fVc1c0CrFWfkaTEups=", "dev": true, "optional": true }, "fs.realpath": { "version": "1.0.0", - "resolved": false, + "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz", "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8=", "dev": true, "optional": true }, "gauge": { "version": "2.7.4", - "resolved": false, + "resolved": "https://registry.npmjs.org/gauge/-/gauge-2.7.4.tgz", "integrity": "sha1-LANAXHU4w51+s3sxcCLjJfsBi/c=", "dev": true, "optional": true, @@ -10464,14 +10464,14 @@ }, "has-unicode": { "version": "2.0.1", - "resolved": false, + "resolved": "https://registry.npmjs.org/has-unicode/-/has-unicode-2.0.1.tgz", "integrity": "sha1-4Ob+aijPUROIVeCG0Wkedx3iqLk=", "dev": true, "optional": true }, "iconv-lite": { "version": "0.4.24", - "resolved": false, + "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz", "integrity": "sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==", "dev": true, "optional": true, @@ -10491,7 +10491,7 @@ }, "inflight": { "version": "1.0.6", - "resolved": false, + "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz", "integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk=", "dev": true, "optional": true, @@ -10509,14 +10509,14 @@ }, "ini": { "version": "1.3.5", - "resolved": false, + "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.5.tgz", "integrity": "sha512-RZY5huIKCMRWDUqZlEi72f/lmXKMvuszcMBduliQ3nnWbx9X/ZBQO7DijMEYS9EhHBb2qacRUMtC7svLwe0lcw==", "dev": true, "optional": true }, "is-fullwidth-code-point": { "version": "1.0.0", - "resolved": false, + "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz", "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs=", "dev": true, "optional": true, @@ -10526,14 +10526,14 @@ }, "isarray": { "version": "1.0.0", - "resolved": false, + "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz", "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE=", "dev": true, "optional": true }, "minimatch": { "version": "3.0.4", - "resolved": false, + "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz", "integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==", "dev": true, "optional": true, @@ -10617,7 +10617,7 @@ }, "npmlog": { "version": "4.1.2", - "resolved": false, + "resolved": "https://registry.npmjs.org/npmlog/-/npmlog-4.1.2.tgz", "integrity": "sha512-2uUqazuKlTaSI/dC8AzicUck7+IrEaOnN/e0jd3Xtt1KcGpwx30v50mL7oPyr/h9bL3E4aZccVwpwP+5W9Vjkg==", "dev": true, "optional": true, @@ -10630,21 +10630,21 @@ }, "number-is-nan": { "version": "1.0.1", - "resolved": false, + "resolved": "https://registry.npmjs.org/number-is-nan/-/number-is-nan-1.0.1.tgz", "integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0=", "dev": true, "optional": true }, "object-assign": { "version": "4.1.1", - "resolved": false, + "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz", "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=", "dev": true, "optional": true }, "once": { "version": "1.4.0", - "resolved": false, + "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz", "integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E=", "dev": true, "optional": true, @@ -10654,21 +10654,21 @@ }, "os-homedir": { "version": "1.0.2", - "resolved": false, + "resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz", "integrity": "sha1-/7xJiDNuDoM94MFox+8VISGqf7M=", "dev": true, "optional": true }, "os-tmpdir": { "version": "1.0.2", - "resolved": false, + "resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz", "integrity": "sha1-u+Z0BseaqFxc/sdm/lc0VV36EnQ=", "dev": true, "optional": true }, "osenv": { "version": "0.1.5", - "resolved": false, + "resolved": "https://registry.npmjs.org/osenv/-/osenv-0.1.5.tgz", "integrity": "sha512-0CWcCECdMVc2Rw3U5w9ZjqX6ga6ubk1xDVKxtBQPK7wis/0F2r9T6k4ydGYhecl7YUBxBVxhL5oisPsNxAPe2g==", "dev": true, "optional": true, @@ -10679,7 +10679,7 @@ }, "path-is-absolute": { "version": "1.0.1", - "resolved": false, + "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz", "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18=", "dev": true, "optional": true @@ -10693,7 +10693,7 @@ }, "rc": { "version": "1.2.8", - "resolved": false, + "resolved": "https://registry.npmjs.org/rc/-/rc-1.2.8.tgz", "integrity": "sha512-y3bGgqKj3QBdxLbLkomlohkvsA8gdAiUQlSBJnBhfn+BPxg4bc62d8TcBW15wavDfgexCgccckhcZvywyQYPOw==", "dev": true, "optional": true, @@ -10732,21 +10732,21 @@ }, "safe-buffer": { "version": "5.1.2", - "resolved": false, + "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz", "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==", "dev": true, "optional": true }, "safer-buffer": { "version": "2.1.2", - "resolved": false, + "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz", "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==", "dev": true, "optional": true }, "sax": { "version": "1.2.4", - "resolved": false, + "resolved": "https://registry.npmjs.org/sax/-/sax-1.2.4.tgz", "integrity": "sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw==", "dev": true, "optional": true @@ -10760,21 +10760,21 @@ }, "set-blocking": { "version": "2.0.0", - "resolved": false, + "resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz", "integrity": "sha1-BF+XgtARrppoA93TgrJDkrPYkPc=", "dev": true, "optional": true }, "signal-exit": { "version": "3.0.2", - "resolved": false, + "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.2.tgz", "integrity": "sha1-tf3AjxKH6hF4Yo5BXiUTK3NkbG0=", "dev": true, "optional": true }, "string-width": { "version": "1.0.2", - "resolved": false, + "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz", "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=", "dev": true, "optional": true, @@ -10786,7 +10786,7 @@ }, "string_decoder": { "version": "1.1.1", - "resolved": false, + "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz", "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==", "dev": true, "optional": true, @@ -10796,7 +10796,7 @@ }, "strip-ansi": { "version": "3.0.1", - "resolved": false, + "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz", "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=", "dev": true, "optional": true, @@ -10806,21 +10806,21 @@ }, "strip-json-comments": { "version": "2.0.1", - "resolved": false, + "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-2.0.1.tgz", "integrity": "sha1-PFMZQukIwml8DsNEhYwobHygpgo=", "dev": true, "optional": true }, "util-deprecate": { "version": "1.0.2", - "resolved": false, + "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz", "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8=", "dev": true, "optional": true }, "wide-align": { "version": "1.1.3", - "resolved": false, + "resolved": "https://registry.npmjs.org/wide-align/-/wide-align-1.1.3.tgz", "integrity": "sha512-QGkOQc8XL6Bt5PwnsExKBPuMKBxnGxWWW3fU55Xt4feHozMUhdUMaBCk290qpm/wG5u/RSKzwdAC4i51YigihA==", "dev": true, "optional": true, @@ -10830,7 +10830,7 @@ }, "wrappy": { "version": "1.0.2", - "resolved": false, + "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz", "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=", "dev": true, "optional": true diff --git a/superset-frontend/package.json b/superset-frontend/package.json index 001ee4bebd281..8fb5897866b85 100644 --- a/superset-frontend/package.json +++ b/superset-frontend/package.json @@ -84,12 +84,12 @@ "@superset-ui/legacy-plugin-chart-sunburst": "^0.13.5", "@superset-ui/legacy-plugin-chart-table": "^0.13.5", "@superset-ui/legacy-plugin-chart-treemap": "^0.13.3", - "@superset-ui/legacy-plugin-chart-world-map": "^0.13.3", + "@superset-ui/legacy-plugin-chart-world-map": "^0.13.6", "@superset-ui/legacy-preset-chart-big-number": "^0.13.5", "@superset-ui/legacy-preset-chart-deckgl": "^0.2.3", "@superset-ui/legacy-preset-chart-nvd3": "^0.13.5", "@superset-ui/number-format": "^0.13.3", - "@superset-ui/plugin-chart-word-cloud": "0.13.3", + "@superset-ui/plugin-chart-word-cloud": "0.13.5", "@superset-ui/preset-chart-xy": "^0.13.5", "@superset-ui/query": "^0.13.3", "@superset-ui/style": "^0.13.3", diff --git a/superset-frontend/spec/javascripts/chart/chartActions_spec.js b/superset-frontend/spec/javascripts/chart/chartActions_spec.js index aa1cffa5fa960..a4621ddb9ebef 100644 --- a/superset-frontend/spec/javascripts/chart/chartActions_spec.js +++ b/superset-frontend/spec/javascripts/chart/chartActions_spec.js @@ -19,17 +19,23 @@ import fetchMock from 'fetch-mock'; import sinon from 'sinon'; +import * as chartlib from '@superset-ui/chart'; import { LOG_EVENT } from '../../../src/logger/actions'; import * as exploreUtils from '../../../src/explore/exploreUtils'; import * as actions from '../../../src/chart/chartAction'; describe('chart actions', () => { + const V1_URL = '/http//localhost/api/v1/chart/data'; const MOCK_URL = '/mockURL'; let dispatch; let urlStub; + let metadataRegistryStub; + let buildQueryRegistryStub; + let fakeMetadata; const setupDefaultFetchMock = () => { fetchMock.post(MOCK_URL, { json: {} }, { overwriteRoutes: true }); + fetchMock.post(V1_URL, { json: {} }, { overwriteRoutes: true }); }; beforeAll(() => { @@ -43,117 +49,135 @@ describe('chart actions', () => { urlStub = sinon .stub(exploreUtils, 'getExploreUrlAndPayload') .callsFake(() => ({ url: MOCK_URL, payload: {} })); + fakeMetadata = { useLegacyApi: true }; + metadataRegistryStub = sinon + .stub(chartlib, 'getChartMetadataRegistry') + .callsFake(() => ({ get: () => fakeMetadata })); + buildQueryRegistryStub = sinon + .stub(chartlib, 'getChartBuildQueryRegistry') + .callsFake(() => ({ get: () => () => ({ some_param: 'fake query!' }) })); }); afterEach(() => { urlStub.restore(); fetchMock.resetHistory(); + metadataRegistryStub.restore(); + buildQueryRegistryStub.restore(); }); - it('should dispatch CHART_UPDATE_STARTED action before the query', () => { - const actionThunk = actions.postChartFormData({}); - - return actionThunk(dispatch).then(() => { - // chart update, trigger query, update form data, success - expect(dispatch.callCount).toBe(5); - expect(fetchMock.calls(MOCK_URL)).toHaveLength(1); - expect(dispatch.args[0][0].type).toBe(actions.CHART_UPDATE_STARTED); - - return Promise.resolve(); + describe('v1 API', () => { + beforeEach(() => { + fakeMetadata = { useLegacyApi: false }; }); - }); - it('should dispatch TRIGGER_QUERY action with the query', () => { - const actionThunk = actions.postChartFormData({}); - return actionThunk(dispatch).then(() => { - // chart update, trigger query, update form data, success - expect(dispatch.callCount).toBe(5); - expect(fetchMock.calls(MOCK_URL)).toHaveLength(1); - expect(dispatch.args[1][0].type).toBe(actions.TRIGGER_QUERY); + it('should query with the built query', async () => { + const actionThunk = actions.postChartFormData({}); + await actionThunk(dispatch); - return Promise.resolve(); + expect(fetchMock.calls(V1_URL)).toHaveLength(1); + expect(fetchMock.calls(V1_URL)[0][1].body).toBe( + JSON.stringify({ some_param: 'fake query!' }), + ); + expect(dispatch.args[0][0].type).toBe(actions.CHART_UPDATE_STARTED); }); }); - it('should dispatch UPDATE_QUERY_FORM_DATA action with the query', () => { - const actionThunk = actions.postChartFormData({}); - return actionThunk(dispatch).then(() => { - // chart update, trigger query, update form data, success - expect(dispatch.callCount).toBe(5); - expect(fetchMock.calls(MOCK_URL)).toHaveLength(1); - expect(dispatch.args[2][0].type).toBe(actions.UPDATE_QUERY_FORM_DATA); - - return Promise.resolve(); + describe('legacy API', () => { + beforeEach(() => { + fakeMetadata = { useLegacyApi: true }; }); - }); - it('should dispatch logEvent async action', () => { - const actionThunk = actions.postChartFormData({}); - return actionThunk(dispatch).then(() => { - // chart update, trigger query, update form data, success - expect(dispatch.callCount).toBe(5); - expect(fetchMock.calls(MOCK_URL)).toHaveLength(1); - expect(typeof dispatch.args[3][0]).toBe('function'); + it('should dispatch CHART_UPDATE_STARTED action before the query', () => { + const actionThunk = actions.postChartFormData({}); - dispatch.args[3][0](dispatch); - expect(dispatch.callCount).toBe(6); - expect(dispatch.args[5][0].type).toBe(LOG_EVENT); - - return Promise.resolve(); + return actionThunk(dispatch).then(() => { + // chart update, trigger query, update form data, success + expect(dispatch.callCount).toBe(5); + expect(fetchMock.calls(MOCK_URL)).toHaveLength(1); + expect(dispatch.args[0][0].type).toBe(actions.CHART_UPDATE_STARTED); + }); }); - }); - it('should dispatch CHART_UPDATE_SUCCEEDED action upon success', () => { - const actionThunk = actions.postChartFormData({}); - return actionThunk(dispatch).then(() => { - // chart update, trigger query, update form data, success - expect(dispatch.callCount).toBe(5); - expect(fetchMock.calls(MOCK_URL)).toHaveLength(1); - expect(dispatch.args[4][0].type).toBe(actions.CHART_UPDATE_SUCCEEDED); - - return Promise.resolve(); + it('should dispatch TRIGGER_QUERY action with the query', () => { + const actionThunk = actions.postChartFormData({}); + return actionThunk(dispatch).then(() => { + // chart update, trigger query, update form data, success + expect(dispatch.callCount).toBe(5); + expect(fetchMock.calls(MOCK_URL)).toHaveLength(1); + expect(dispatch.args[1][0].type).toBe(actions.TRIGGER_QUERY); + }); }); - }); - it('should CHART_UPDATE_TIMEOUT action upon query timeout', () => { - const unresolvingPromise = new Promise(() => {}); - fetchMock.post(MOCK_URL, () => unresolvingPromise, { - overwriteRoutes: true, + it('should dispatch UPDATE_QUERY_FORM_DATA action with the query', () => { + const actionThunk = actions.postChartFormData({}); + return actionThunk(dispatch).then(() => { + // chart update, trigger query, update form data, success + expect(dispatch.callCount).toBe(5); + expect(fetchMock.calls(MOCK_URL)).toHaveLength(1); + expect(dispatch.args[2][0].type).toBe(actions.UPDATE_QUERY_FORM_DATA); + }); }); - const timeoutInSec = 1 / 1000; - const actionThunk = actions.postChartFormData({}, false, timeoutInSec); - - return actionThunk(dispatch).then(() => { - // chart update, trigger query, update form data, fail - expect(dispatch.callCount).toBe(5); - expect(dispatch.args[4][0].type).toBe(actions.CHART_UPDATE_TIMEOUT); - setupDefaultFetchMock(); - - return Promise.resolve(); + it('should dispatch logEvent async action', () => { + const actionThunk = actions.postChartFormData({}); + return actionThunk(dispatch).then(() => { + // chart update, trigger query, update form data, success + expect(dispatch.callCount).toBe(5); + expect(fetchMock.calls(MOCK_URL)).toHaveLength(1); + expect(typeof dispatch.args[3][0]).toBe('function'); + + dispatch.args[3][0](dispatch); + expect(dispatch.callCount).toBe(6); + expect(dispatch.args[5][0].type).toBe(LOG_EVENT); + }); }); - }); - it('should dispatch CHART_UPDATE_FAILED action upon non-timeout non-abort failure', () => { - fetchMock.post( - MOCK_URL, - { throws: { statusText: 'misc error' } }, - { overwriteRoutes: true }, - ); - - const timeoutInSec = 100; // Set to a time that is longer than the time this will take to fail - const actionThunk = actions.postChartFormData({}, false, timeoutInSec); - - return actionThunk(dispatch).then(() => { - // chart update, trigger query, update form data, fail - expect(dispatch.callCount).toBe(5); - const updateFailedAction = dispatch.args[4][0]; - expect(updateFailedAction.type).toBe(actions.CHART_UPDATE_FAILED); - expect(updateFailedAction.queryResponse.error).toBe('misc error'); + it('should dispatch CHART_UPDATE_SUCCEEDED action upon success', () => { + const actionThunk = actions.postChartFormData({}); + return actionThunk(dispatch).then(() => { + // chart update, trigger query, update form data, success + expect(dispatch.callCount).toBe(5); + expect(fetchMock.calls(MOCK_URL)).toHaveLength(1); + expect(dispatch.args[4][0].type).toBe(actions.CHART_UPDATE_SUCCEEDED); + }); + }); - setupDefaultFetchMock(); + it('should CHART_UPDATE_TIMEOUT action upon query timeout', () => { + const unresolvingPromise = new Promise(() => {}); + fetchMock.post(MOCK_URL, () => unresolvingPromise, { + overwriteRoutes: true, + }); + + const timeoutInSec = 1 / 1000; + const actionThunk = actions.postChartFormData({}, false, timeoutInSec); + + return actionThunk(dispatch).then(() => { + // chart update, trigger query, update form data, fail + expect(dispatch.callCount).toBe(5); + expect(dispatch.args[4][0].type).toBe(actions.CHART_UPDATE_TIMEOUT); + setupDefaultFetchMock(); + }); + }); - return Promise.resolve(); + it('should dispatch CHART_UPDATE_FAILED action upon non-timeout non-abort failure', () => { + fetchMock.post( + MOCK_URL, + { throws: { statusText: 'misc error' } }, + { overwriteRoutes: true }, + ); + + const timeoutInSec = 100; // Set to a time that is longer than the time this will take to fail + const actionThunk = actions.postChartFormData({}, false, timeoutInSec); + + return actionThunk(dispatch).then(() => { + // chart update, trigger query, update form data, fail + expect(dispatch.callCount).toBe(5); + const updateFailedAction = dispatch.args[4][0]; + expect(updateFailedAction.type).toBe(actions.CHART_UPDATE_FAILED); + expect(updateFailedAction.queryResponse.error).toBe('misc error'); + + setupDefaultFetchMock(); + }); }); }); }); diff --git a/superset-frontend/src/chart/chartAction.js b/superset-frontend/src/chart/chartAction.js index 0d6b03b1ea546..1222a9a816b2d 100644 --- a/superset-frontend/src/chart/chartAction.js +++ b/superset-frontend/src/chart/chartAction.js @@ -20,6 +20,10 @@ /* eslint no-param-reassign: ["error", { "props": false }] */ import moment from 'moment'; import { t } from '@superset-ui/translation'; +import { + getChartBuildQueryRegistry, + getChartMetadataRegistry, +} from '@superset-ui/chart'; import { SupersetClient } from '@superset-ui/connection'; import { isFeatureEnabled, FeatureFlag } from 'src/featureFlags'; import { @@ -202,6 +206,48 @@ export function addChart(chart, key) { return { type: ADD_CHART, chart, key }; } +function legacyChartDataRequest( + formData, + force, + method, + dashboardId, + requestParams, +) { + const { url, payload } = getExploreUrlAndPayload({ + formData, + endpointType: 'json', + force, + allowDomainSharding, + method, + requestParams: dashboardId ? { dashboard_id: dashboardId } : {}, + }); + const querySettings = { + ...requestParams, + url, + postPayload: { form_data: payload }, + }; + + const clientMethod = + method === 'GET' && isFeatureEnabled(FeatureFlag.CLIENT_CACHE) + ? SupersetClient.get + : SupersetClient.post; + + return clientMethod(querySettings); +} + +async function v1ChartDataRequest(formData, requestParams) { + const buildQuery = await getChartBuildQueryRegistry().get(formData.viz_type); + const payload = buildQuery(formData); + const querySettings = { + ...requestParams, + endpoint: '/api/v1/chart/data', + headers: { 'Content-Type': 'application/json' }, + body: JSON.stringify(payload), + }; + + return SupersetClient.post(querySettings); +} + export function exploreJSON( formData, force = false, @@ -210,47 +256,51 @@ export function exploreJSON( method, dashboardId, ) { - return dispatch => { - const { url, payload } = getExploreUrlAndPayload({ - formData, - endpointType: 'json', - force, - allowDomainSharding, - method, - requestParams: dashboardId ? { dashboard_id: dashboardId } : {}, - }); + return async dispatch => { const logStart = Logger.getTimestamp(); const controller = new AbortController(); - const { signal } = controller; - dispatch(chartUpdateStarted(controller, payload, key)); + const { useLegacyApi } = getChartMetadataRegistry().get(formData.viz_type); - let querySettings = { - url, - postPayload: { form_data: payload }, - signal, + let requestParams = { + signal: controller.signal, timeout: timeout * 1000, }; + if (allowDomainSharding) { - querySettings = { - ...querySettings, + requestParams = { + ...requestParams, mode: 'cors', credentials: 'include', }; } - const clientMethod = - method === 'GET' && isFeatureEnabled(FeatureFlag.CLIENT_CACHE) - ? SupersetClient.get - : SupersetClient.post; - const queryPromise = clientMethod(querySettings) + const queryPromiseRaw = useLegacyApi + ? legacyChartDataRequest( + formData, + force, + method, + dashboardId, + requestParams, + ) + : v1ChartDataRequest(formData, requestParams); + + dispatch(chartUpdateStarted(controller, formData, key)); + + const queryPromiseCaught = queryPromiseRaw .then(({ json }) => { + // new API returns an object with an array of restults + // problem: json holds a list of results, when before we were just getting one result. + // `queryResponse` state is used all over the place. + // How to make the entire app compatible with multiple results? + // For now just use the first result. + const result = useLegacyApi ? json : json.result[0]; dispatch( logEvent(LOG_ACTIONS_LOAD_CHART, { slice_id: key, - is_cached: json.is_cached, + is_cached: result.is_cached, force_refresh: force, - row_count: json.rowcount, + row_count: result.rowcount, datasource: formData.datasource, start_offset: logStart, ts: new Date().getTime(), @@ -258,12 +308,12 @@ export function exploreJSON( has_extra_filters: formData.extra_filters && formData.extra_filters.length > 0, viz_type: formData.viz_type, - data_age: json.is_cached - ? moment(new Date()).diff(moment.utc(json.cached_dttm)) + data_age: result.is_cached + ? moment(new Date()).diff(moment.utc(result.cached_dttm)) : null, }), ); - return dispatch(chartUpdateSucceeded(json, key)); + return dispatch(chartUpdateSucceeded(result, key)); }) .catch(response => { const appendErrorLog = (errorDetails, isCached) => { @@ -300,9 +350,9 @@ export function exploreJSON( const annotationLayers = formData.annotation_layers || []; return Promise.all([ - queryPromise, + queryPromiseCaught, dispatch(triggerQuery(false, key)), - dispatch(updateQueryFormData(payload, key)), + dispatch(updateQueryFormData(formData, key)), ...annotationLayers.map(x => dispatch(runAnnotationQuery(x, timeout, formData, key)), ), diff --git a/superset-frontend/src/visualizations/FilterBox/FilterBoxChartPlugin.js b/superset-frontend/src/visualizations/FilterBox/FilterBoxChartPlugin.js index def1a2c76f2bd..07513606d387c 100644 --- a/superset-frontend/src/visualizations/FilterBox/FilterBoxChartPlugin.js +++ b/superset-frontend/src/visualizations/FilterBox/FilterBoxChartPlugin.js @@ -26,6 +26,7 @@ const metadata = new ChartMetadata({ description: 'A multi filter, multi-choice filter box to make dashboards interactive', thumbnail, + useLegacyApi: true, }); export default class FilterBoxChartPlugin extends ChartPlugin { diff --git a/superset-frontend/src/visualizations/presets/MainPreset.js b/superset-frontend/src/visualizations/presets/MainPreset.js index fcd140c102d5b..3b18b9aba1c37 100644 --- a/superset-frontend/src/visualizations/presets/MainPreset.js +++ b/superset-frontend/src/visualizations/presets/MainPreset.js @@ -41,7 +41,7 @@ import SankeyChartPlugin from '@superset-ui/legacy-plugin-chart-sankey'; import SunburstChartPlugin from '@superset-ui/legacy-plugin-chart-sunburst'; import TableChartPlugin from '@superset-ui/legacy-plugin-chart-table'; import TreemapChartPlugin from '@superset-ui/legacy-plugin-chart-treemap'; -import { LegacyWordCloudChartPlugin } from '@superset-ui/plugin-chart-word-cloud'; +import { WordCloudChartPlugin } from '@superset-ui/plugin-chart-word-cloud'; import WorldMapChartPlugin from '@superset-ui/legacy-plugin-chart-world-map'; import { AreaChartPlugin, @@ -105,7 +105,7 @@ export default class MainPreset extends Preset { new TimePivotChartPlugin().configure({ key: 'time_pivot' }), new TimeTableChartPlugin().configure({ key: 'time_table' }), new TreemapChartPlugin().configure({ key: 'treemap' }), - new LegacyWordCloudChartPlugin().configure({ key: 'word_cloud' }), + new WordCloudChartPlugin().configure({ key: 'word_cloud' }), new WorldMapChartPlugin().configure({ key: 'world_map' }), ], });