You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by sh...@apache.org on 2021/05/17 08:02:18 UTC

[echarts] branch fix-component-missing-error created (now 19b8b48)

This is an automated email from the ASF dual-hosted git repository.

shenyi pushed a change to branch fix-component-missing-error
in repository https://gitbox.apache.org/repos/asf/echarts.git.


      at 19b8b48  fix(option): check the missing component before merge theme

This branch includes the following new commits:

     new 19b8b48  fix(option): check the missing component before merge theme

The 1 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails.  The revisions
listed as "add" were already present in the repository and have only
been added to this reference.


---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org


[echarts] 01/01: fix(option): check the missing component before merge theme

Posted by sh...@apache.org.
This is an automated email from the ASF dual-hosted git repository.

shenyi pushed a commit to branch fix-component-missing-error
in repository https://gitbox.apache.org/repos/asf/echarts.git

commit 19b8b48d02c9d33a7183e7d4333c33c34f094f6c
Author: pissang <bm...@gmail.com>
AuthorDate: Mon May 17 16:01:29 2021 +0800

    fix(option): check the missing component before merge theme
    
    Fix #14844
---
 src/model/Global.ts                         | 30 +++++++++++++++++++----------
 test/ut/spec/model/componentMissing.test.ts | 28 ++++++++++++++++++++-------
 2 files changed, 41 insertions(+), 17 deletions(-)

diff --git a/src/model/Global.ts b/src/model/Global.ts
index 5a35ff3..94cb256 100644
--- a/src/model/Global.ts
+++ b/src/model/Global.ts
@@ -137,6 +137,22 @@ const BUILTIN_CHARTS_MAP = {
 
 const componetsMissingLogPrinted: Record<string, boolean> = {};
 
+function checkMissingComponents(option: ECUnitOption) {
+    each(option, function (componentOption, mainType: ComponentMainType) {
+        if (!ComponentModel.hasClass(mainType)) {
+            if (__DEV__) {
+                const componentImportName = BUITIN_COMPONENTS_MAP[mainType as keyof typeof BUITIN_COMPONENTS_MAP];
+                if (componentImportName && !componetsMissingLogPrinted[componentImportName]) {
+                    error(`Component ${mainType} is used but not imported.
+import { ${componentImportName} } from 'echarts/components';
+echarts.use([${componentImportName}]);`);
+                    componetsMissingLogPrinted[componentImportName] = true;
+                }
+            }
+        }
+    });
+}
+
 class GlobalModel extends Model<ECUnitOption> {
     // @readonly
     option: ECUnitOption;
@@ -238,6 +254,9 @@ class GlobalModel extends Model<ECUnitOption> {
 
         if (!type || type === 'recreate') {
             const baseOption = optionManager.mountOption(type === 'recreate');
+            if (__DEV__) {
+                checkMissingComponents(baseOption);
+            }
 
             if (!this.option || type === 'recreate') {
                 initBase(this, baseOption);
@@ -308,16 +327,6 @@ class GlobalModel extends Model<ECUnitOption> {
             }
 
             if (!ComponentModel.hasClass(mainType)) {
-                if (__DEV__) {
-                    const componentImportName = BUITIN_COMPONENTS_MAP[mainType as keyof typeof BUITIN_COMPONENTS_MAP];
-                    if (componentImportName && !componetsMissingLogPrinted[componentImportName]) {
-                        error(`Component ${mainType} is used but not imported.
-import { ${componentImportName} } from 'echarts/components';
-echarts.use([${componentImportName}]);`);
-                        componetsMissingLogPrinted[componentImportName] = true;
-                    }
-                }
-
                 // globalSettingTask.dirty();
                 option[mainType] = option[mainType] == null
                     ? clone(componentOption)
@@ -990,6 +999,7 @@ function mergeTheme(option: ECUnitOption, theme: ThemeOption): void {
         if (name === 'colorLayer' && notMergeColorLayer) {
             return;
         }
+
         // If it is component model mainType, the model handles that merge later.
         // otherwise, merge them here.
         if (!ComponentModel.hasClass(name)) {
diff --git a/test/ut/spec/model/componentMissing.test.ts b/test/ut/spec/model/componentMissing.test.ts
index a386e8e..67e1932 100644
--- a/test/ut/spec/model/componentMissing.test.ts
+++ b/test/ut/spec/model/componentMissing.test.ts
@@ -32,7 +32,7 @@ use([PieChart, TitleComponent, CanvasRenderer]);
 import { EChartsOption } from '../../../../src/export/option';
 
 
-function createChart(): EChartsType {
+function createChart(theme?: object): EChartsType {
     const el = document.createElement('div');
     Object.defineProperty(el, 'clientWidth', {
         get() {
@@ -44,7 +44,7 @@ function createChart(): EChartsType {
             return 400;
         }
     });
-    const chart = init(el);
+    const chart = init(el, theme);
     return chart;
 };
 
@@ -61,11 +61,15 @@ echarts.use([${seriesImportName}]);`;
 }
 
 
+// !!!!IMPORTANTE NOTE:
+// DO NOT test on the same component twice.
+// Because error message will be cached. It will not report on the same component twice.
 
 describe('model_componentMissing', function () {
+    const oldConsoleErr = console.error;
+
     it('Should report grid component missing error', function () {
         const chart = createChart();
-        const oldConsoleErr = console.error;
         console.error = jest.fn();
         chart.setOption<EChartsOption>({
             xAxis: {},
@@ -81,7 +85,6 @@ describe('model_componentMissing', function () {
 
     it('Should report dataZoom component missing error', function () {
         const chart = createChart();
-        const oldConsoleErr = console.error;
         console.error = jest.fn();
         chart.setOption<EChartsOption>({
             dataZoom: {}
@@ -95,7 +98,6 @@ describe('model_componentMissing', function () {
 
     it('Should not report title component missing error', function () {
         const chart = createChart();
-        const oldConsoleErr = console.error;
         console.error = jest.fn();
         chart.setOption<EChartsOption>({
             title: {},
@@ -108,7 +110,6 @@ describe('model_componentMissing', function () {
 
     it('Should report funnel series missing error', function () {
         const chart = createChart();
-        const oldConsoleErr = console.error;
         console.error = jest.fn();
         chart.setOption<EChartsOption>({
             series: [{
@@ -124,7 +125,6 @@ describe('model_componentMissing', function () {
 
     it('Should not report pie series missing error', function () {
         const chart = createChart();
-        const oldConsoleErr = console.error;
         console.error = jest.fn();
         chart.setOption<EChartsOption>({
             series: [{
@@ -132,6 +132,20 @@ describe('model_componentMissing', function () {
             }]
         });
         expect(console.error).not.toBeCalled();
+        console.error = oldConsoleErr;
+    });
+
+
+    it('Should not report visualMap component missing error when using theme', function () {
+        const chart = createChart({
+            visualMap: {
+                borderColor: '#71708A'
+            }
+        });
+
+        console.error = jest.fn();
+        chart.setOption<EChartsOption>({});
+        expect(console.error).not.toBeCalled();
 
         console.error = oldConsoleErr;
     });

---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org