You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by su...@apache.org on 2019/09/18 08:09:12 UTC

[incubator-echarts] branch master updated (105bde5 -> ae7fbad)

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

sushuang pushed a change to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-echarts.git.


    from 105bde5  doc: fix image link in contributing doc (#11270)
     new 004dfec  feat(test): support `npm run mktest some-test-file`.
     new ae7fbad  feat(test): Add instructions for adding a test case and tweak `mktest`.

The 2 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.


Summary of changes:
 CONTRIBUTING.md                               |  63 ++++++++++-
 package.json                                  |   2 +
 test/{tmp-base.html => build/mktest-tpl.html} |  49 +++++---
 test/build/mktest.js                          | 156 ++++++++++++++++++++++++++
 4 files changed, 252 insertions(+), 18 deletions(-)
 copy test/{tmp-base.html => build/mktest-tpl.html} (59%)
 create mode 100755 test/build/mktest.js


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


[incubator-echarts] 02/02: feat(test): Add instructions for adding a test case and tweak `mktest`.

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

sushuang pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-echarts.git

commit ae7fbad774149899502b613847858d7a823e1a91
Author: sushuang <su...@gmail.com>
AuthorDate: Wed Sep 18 02:23:24 2019 +0800

    feat(test): Add instructions for adding a test case and tweak `mktest`.
---
 CONTRIBUTING.md      | 63 +++++++++++++++++++++++++++++++++++++++++++++++++---
 package.json         |  1 +
 test/build/mktest.js |  2 ++
 3 files changed, 63 insertions(+), 3 deletions(-)

diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index 53c2552..504eef8 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -44,10 +44,12 @@ Please follow the [coding standard](https://echarts.apache.org/en/coding-standar
 
 If you wish to fix a bug or add new features but don't know how, please discuss it with us in the [mailing list](dev@echarts.apache.org).
 
+
 ## How to Debug ECharts
 
 The following steps help you to set up a developing environment for ECharts.
 
+
 ### 1. Clone ECharts project
 
 If you wish to make pull requests, you should **fork the ECharts project** first. Otherwise, just clone it locally.
@@ -64,6 +66,7 @@ git clone git@github.com:ecomfe/zrender.git
 
 We assume these projects are downloaded at `~/workspace/echarts` and `~/workspace/zrender`. But their locations can be arbitrary.
 
+
 ### 2. Install dependencies
 
 ```bash
@@ -84,6 +87,7 @@ npm link zrender
 
 With this, you can see that `~/workspace/echarts/node_modules/zrender` is a link to `~/workspace/zrender`.
 
+
 ### 3. Run and debug
 
 To build the ECharts project and watch source file changes (including ZRender project) to rebuild:
@@ -103,7 +107,59 @@ Then, open the test cases under `~/workspace/echarts/test` in Web browser. You c
 
 ![Chrome inspect](./asset/contributing-inspect.png)
 
-### 4. Run test
+
+### 4. Add test cases
+
+In most cases, one or more test cases should be added when developing a feature or fixing a bug.
+All of the existing test cases are in directory `~/workspace/echarts/test`.
+Check the file `~/workspace/echarts/test/dataZoom-action.html` as an example.
+
+**Organize test cases:**
+Each file can be regard as a **test suite** and each chart in the file can be regard as a **test case**,
+which contains one or multiple expected results (check points).
+If a feature or bug is related to a chart type or a component type, probably it should belongs to
+a test file named `chartOrComponentType-someSubCategory.html`. Or some common feature is related
+to multiple chart or component or has nothing to do with chart and component, probably it should
+belongs a test file named `featureName-someSubCateogory.html`.
+
+**The naming of a test file:**
+Generally speaking, the name of the test file should start with a chart type or component type
+or a common feature name (like "hoverStyle", "clip").
+
+**Add a test case:**
+If intending to add a test case, firstly try to find in the existing test files which file this
+new test case might belongs to.
+If an existing file found, add the test case to the file.
+Otherwise, add a new test file by commands as follows:
+
+```shell
+# Make a file named "bar-action.html" in directory "echarts/test" with 1 initial chart.
+npm run mktest bar-action
+# or `npm run mktest bar-action.html`
+
+# Make a file named "bar-action.html" in directory "echarts/test" with 5 initial charts.
+npm run mktest bar-action 5
+```
+
+**The expected results and the instructions of user interaction:**
+Although we have auto-visual-test tool to run tests, we should better write the expected result
+(check points) for each test cases for manual checking.
+Some cases need user interactions involved. The instructions should be written clearly.
+The expected results and the user instructions should be written in the `title` filed when
+creating a test by `testHelper.create` as follows:
+
+```js
+var chart = testHelper.create(echarts, 'main0', {
+    title: [
+        'Hover on the red circle',
+        '**A blue label** should appear on the **top of red circle**.'
+    ],
+    option: option
+});
+```
+
+
+### 5. Run test cases
 
 ```bash
 # puppeteer is not in the devDependencies and needs to be installed manually
@@ -113,7 +169,8 @@ npm run test:visual
 
 It will run all the test cases under `~/workspace/echarts/test` automatically to compare with the previous version. You can use this to check if your code bring some breaking change.
 
-### 5. Check the code style
+
+### 6. Check the code style
 
 The code style should follow the [Code Standard](https://echarts.apache.org/en/coding-standard.html).
 
@@ -125,7 +182,7 @@ npm run lint
 to check the the code style.
 
 
-### 6. Make a pull request
+### 7. Make a pull request
 
 Fork ECharts project into your own project. Checkout a branch from master branch named `fix-xxxx`, where xxxx is the issue id related. If there's no related issue, you need to create one in most cases to describe what's wrong or what new feature is required.
 
diff --git a/package.json b/package.json
index 10fb6f6..8fdeb54 100644
--- a/package.json
+++ b/package.json
@@ -21,6 +21,7 @@
     "test:visual": "node test/runTest/server.js",
     "test": "node build/build.js",
     "mktest": "node test/build/mktest.js",
+    "mktest:help": "node test/build/mktest.js -h",
     "lint": "./node_modules/.bin/eslint src extension-src",
     "lint:dist": "echo 'It might take a while. Please wait ...' && ./node_modules/.bin/jshint --config .jshintrc-dist dist/echarts.js"
   },
diff --git a/test/build/mktest.js b/test/build/mktest.js
index c71403a..9734e9c 100755
--- a/test/build/mktest.js
+++ b/test/build/mktest.js
@@ -63,6 +63,7 @@ function run() {
     if (nodeFS.existsSync(opt.testFilePath)) {
         printError(`The file ${opt.testFilePath} exists! Please chose another name.`);
         printError('Please chose another name.');
+        console.log(manualText);
         return;
     }
 
@@ -92,6 +93,7 @@ function prepareOpt() {
 
     if (!testFileName) {
         printError('Must input a file name!');
+        console.log(manualText);
         return;
     }
 


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


[incubator-echarts] 01/02: feat(test): support `npm run mktest some-test-file`.

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

sushuang pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-echarts.git

commit 004dfecfeafd050b51ebf7629bbefdbcf277bce8
Author: sushuang <su...@gmail.com>
AuthorDate: Wed Sep 18 01:25:06 2019 +0800

    feat(test): support `npm run mktest some-test-file`.
---
 package.json               |   1 +
 test/build/mktest-tpl.html |  80 +++++++++++++++++++++++
 test/build/mktest.js       | 154 +++++++++++++++++++++++++++++++++++++++++++++
 3 files changed, 235 insertions(+)

diff --git a/package.json b/package.json
index 2dbadba..10fb6f6 100644
--- a/package.json
+++ b/package.json
@@ -20,6 +20,7 @@
     "prepublish": "node build/build.js --prepublish",
     "test:visual": "node test/runTest/server.js",
     "test": "node build/build.js",
+    "mktest": "node test/build/mktest.js",
     "lint": "./node_modules/.bin/eslint src extension-src",
     "lint:dist": "echo 'It might take a while. Please wait ...' && ./node_modules/.bin/jshint --config .jshintrc-dist dist/echarts.js"
   },
diff --git a/test/build/mktest-tpl.html b/test/build/mktest-tpl.html
new file mode 100644
index 0000000..15836ef
--- /dev/null
+++ b/test/build/mktest-tpl.html
@@ -0,0 +1,80 @@
+<!DOCTYPE html>
+<!--
+Licensed to the Apache Software Foundation (ASF) under one
+or more contributor license agreements.  See the NOTICE file
+distributed with this work for additional information
+regarding copyright ownership.  The ASF licenses this file
+to you under the Apache License, Version 2.0 (the
+"License"); you may not use this file except in compliance
+with the License.  You may obtain a copy of the License at
+
+   http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing,
+software distributed under the License is distributed on an
+"AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+KIND, either express or implied.  See the License for the
+specific language governing permissions and limitations
+under the License.
+-->
+
+
+<html>
+    <head>
+        <meta charset="utf-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1" />
+        <script src="lib/esl.js"></script>
+        <script src="lib/config.js"></script>
+        <script src="lib/jquery.min.js"></script>
+        <script src="lib/facePrint.js"></script>
+        <script src="lib/testHelper.js"></script>
+        <!-- <script src="ut/lib/canteen.js"></script> -->
+        <link rel="stylesheet" href="lib/reset.css" />
+    </head>
+    <body>
+        <style>
+        </style>
+
+
+<!-- TPL_DOM_PLACE -->
+
+<!-- TPL_JS_PLACE -->
+
+    </body>
+</html>
+
+<!-- TPL_SEGMENT_DELIMITER -->
+        <div id="{{TPL_DOM_ID}}"></div>
+<!-- TPL_SEGMENT_DELIMITER -->
+
+
+
+
+
+
+        <script>
+        require(['echarts'/*, 'map/js/china' */], function (echarts) {
+            var option;
+            // $.getJSON('./data/nutrients.json', function (data) {});
+
+            option = {
+                xAxis: {},
+                yAxis: {},
+                series: {
+                    type: 'line',
+                    data: [[11, 22], [33, 44]]
+                }
+            };
+
+            var chart = testHelper.create(echarts, '{{TPL_DOM_ID}}', {
+                title: [
+                    'Test Case Description of {{TPL_DOM_ID}}',
+                    '(Muliple lines and **emphasis** are supported in description)'
+                ],
+                option: option
+                // height: 300,
+                // buttons: [{text: 'btn-txt', onclick: function () {}}],
+                // recordCanvas: true,
+            });
+        });
+        </script>
diff --git a/test/build/mktest.js b/test/build/mktest.js
new file mode 100755
index 0000000..c71403a
--- /dev/null
+++ b/test/build/mktest.js
@@ -0,0 +1,154 @@
+#!/usr/bin/env node
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you under the Apache License, Version 2.0 (the
+* "License"); you may not use this file except in compliance
+* with the License.  You may obtain a copy of the License at
+*
+*   http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing,
+* software distributed under the License is distributed on an
+* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+* KIND, either express or implied.  See the License for the
+* specific language governing permissions and limitations
+* under the License.
+*/
+
+
+const nodeFS = require('fs');
+const assert = require('assert');
+const nodePath = require('path');
+const commander = require('commander');
+const {color} = require('zrender/build/helper');
+
+const colorFgCyanDim = color('fgCyan', 'dim');
+const colorFgGreen = color('fgGreen');
+const colorFgRed = color('fgRed');
+
+const testDir = nodePath.resolve(__dirname, '..');
+const testTplPath = nodePath.resolve(__dirname, 'mktest-tpl.html');
+const tplSegmentDelimiter = '<!-- TPL_SEGMENT_DELIMITER -->';
+const tagDomId = /{{TPL_DOM_ID}}/g;
+const tagDomPlace = '<!-- TPL_DOM_PLACE -->';
+const tagJSPlace = '<!-- TPL_JS_PLACE -->';
+
+const manualText = `
+    ${colorFgCyanDim('Usage:')}
+
+    # Make a file named "bar-action.html" in directory "echarts/test" with 1 initial chart.
+    ${colorFgGreen('npm run mktest bar-action')}
+    # or
+    ${colorFgGreen('npm run mktest bar-action.html')}
+    # or
+    ${colorFgGreen('node ./test/build/mktest bar-action')}
+
+    # Make a file named "bar-action.html" in directory "echarts/test" with 5 initial charts.
+    ${colorFgGreen('npm run mktest bar-action 5')}
+    # or
+    ${colorFgGreen('node ./test/build/mktest bar-action 5')}
+`;
+
+function run() {
+    let opt = prepareOpt();
+
+    if (!opt) {
+        return;
+    }
+
+    if (nodeFS.existsSync(opt.testFilePath)) {
+        printError(`The file ${opt.testFilePath} exists! Please chose another name.`);
+        printError('Please chose another name.');
+        return;
+    }
+
+    const testTplContent = nodeFS.readFileSync(testTplPath, {encoding: 'utf8'});
+
+    const testFileContent = makeTestFileContent(opt, testTplContent);
+
+    nodeFS.writeFileSync(opt.testFilePath, testFileContent, {encoding: 'utf8'});
+
+    console.log(`A test file has been added in: \n${colorFgGreen(opt.testFilePath)}`);
+    console.log();
+}
+
+function prepareOpt() {
+    commander
+        .usage('test-file-name [chart-number]')
+        .description(manualText)
+        .parse(process.argv);
+
+    let args = commander.args || [];
+
+    let testFileName = args[0];
+    let testCaseNumber = args[1];
+    if (isNaN(testCaseNumber)) {
+        testCaseNumber = 1;
+    }
+
+    if (!testFileName) {
+        printError('Must input a file name!');
+        return;
+    }
+
+    testFileName = normalizeInputExt(testFileName);
+    let testFilePath = nodePath.resolve(testDir, testFileName);
+
+    return {
+        testFileName: testFileName,
+        testFilePath: testFilePath,
+        testCaseNumber: testCaseNumber
+    };
+}
+
+function makeTestFileContent(opt, testTplContent) {
+    const testTplSegments = testTplContent.split(tplSegmentDelimiter);
+
+    const tplSegMain = testTplSegments[0];
+    const tplSegDom = testTplSegments[1];
+    const tplSegJS = testTplSegments[2];
+
+    assert(tplSegMain && tplSegDom && tplSegJS);
+
+    let segDomList = [];
+    let segJSList = [];
+
+    for (let i = 0; i < opt.testCaseNumber; i++) {
+        let domId = 'main' + i;
+        segDomList.push(tplSegDom.replace(tagDomId, domId));
+        segJSList.push(tplSegJS.replace(tagDomId, domId));
+    }
+
+    let htmlContent = tplSegMain
+        .replace(tagDomPlace, segDomList.join('\n'))
+        .replace(tagJSPlace, segJSList.join('\n'));
+
+    return htmlContent;
+}
+
+function normalizeInputExt(testFileName) {
+    if (hasExt(testFileName, '.html')) {
+        return testFileName;
+    }
+    else if (hasExt(testFileName, '.htm')) {
+        return testFileName + 'l';
+    }
+    else {
+        return testFileName + '.html';
+    }
+
+    function hasExt(fileName, ext) {
+        let idx = fileName.lastIndexOf(ext);
+        return idx >= 0 && idx === fileName.length - ext.length;
+    }
+}
+
+function printError(msg) {
+    console.error(colorFgRed('[ERROR]: ' + msg));
+}
+
+run();


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