Split graphics tests on CI

.circleci/config.yml

@@ -2,7 +2,6 @@
 
 version: 2.1
 
-
 aliases:
   - &restore-node-modules-cache
       name: Restore node_modules cache
@@ -64,6 +63,8 @@ commands:
       productionBuild:
         type: boolean
         default: false
+      grep:
+        type: string
     steps:
       - checkout-with-deps
       - run:
@@ -74,6 +75,7 @@ commands:
             echo 'export TESTS_REPORT_FILE="test-results/graphics/results.xml"' >> $BASH_ENV
             echo 'export DEVICE_PIXEL_RATIO=<< parameters.devicePixelRatio >>' >> $BASH_ENV
             echo 'export PRODUCTION_BUILD=<< parameters.productionBuild >>' >> $BASH_ENV
+            echo 'export GREP="<< parameters.grep >>"' >> $BASH_ENV
             echo 'export COMPARE_BRANCH="v5-candidate"' >> $BASH_ENV
       - run:
           command: scripts/run-graphics-tests.sh
@@ -195,37 +197,21 @@ jobs:
           path: ./dts-changes
           when: on_fail
 
-  graphics-tests-dpr1_0:
-    executor: node-browsers-executor
-    steps:
-      - run-graphics-tests:
-          devicePixelRatio: "1.0"
-
-  graphics-tests-dpr1_25:
-    executor: node-browsers-executor
-    steps:
-      - run-graphics-tests:
-          devicePixelRatio: "1.25"
-
-  graphics-tests-dpr1_5:
-    executor: node-browsers-executor
-    steps:
-      - run-graphics-tests:
-          devicePixelRatio: "1.5"
-
-  graphics-tests-dpr2_0:
-    executor: node-browsers-executor
-    steps:
-      - run-graphics-tests:
-          devicePixelRatio: "2.0"
-
-  graphics-tests-dpr2_0-prod:
+  graphics-tests:
+    parameters:
+      grep:
+        type: string
+      dpr:
+        type: string
+      productionBuild:
+        type: boolean
+        default: false
     executor: node-browsers-executor
     steps:
       - run-graphics-tests:
-          devicePixelRatio: "2.0"
-          productionBuild: true
-
+          devicePixelRatio: << parameters.dpr >>
+          grep: << parameters.grep >>
+          productionBuild: << parameters.productionBuild >>
 
   memleaks-tests:
     executor: node-browsers-executor
@@ -307,6 +293,28 @@ jobs:
           paths:
             - website
 
+
+anchors:
+  - &graphics-test-matrix
+    parameters:
+      dpr: ["1.0", "1.25", "1.5", "2.0"]
+      productionBuild: [false, true]
+    exclude:
+      - dpr: "1.0"
+        productionBuild: true
+      - dpr: "1.25"
+        productionBuild: true
+      - dpr: "1.5"
+        productionBuild: true
+
+  - &graphics-test-config
+    requires:
+      - build
+    filters: *merge-based-filters
+    dpr: << matrix.dpr >>
+    productionBuild: << matrix.productionBuild >>
+
+
 workflows:
   version: 2
 
@@ -351,26 +359,21 @@ workflows:
           filters: *merge-based-filters
           requires:
             - build
-      - graphics-tests-dpr1_0:
-          filters: *merge-based-filters
-          requires:
-            - build
-      - graphics-tests-dpr1_25:
-          filters: *merge-based-filters
-          requires:
-            - build
-      - graphics-tests-dpr1_5:
-          filters: *merge-based-filters
-          requires:
-            - build
-      - graphics-tests-dpr2_0:
-          filters: *merge-based-filters
-          requires:
-            - build
-      - graphics-tests-dpr2_0-prod:
-          filters: *merge-based-filters
-          requires:
-            - build
+      - graphics-tests:
+          name: graphics-tests-part1-dpr<< matrix.dpr >><<# matrix.productionBuild >>-PROD<</ matrix.productionBuild >>
+          grep: "(api/|applying-options/|series-markers/|price-scale/)"
+          matrix: *graphics-test-matrix
+          <<: *graphics-test-config
+      - graphics-tests:
+          name: graphics-tests-part2-dpr<< matrix.dpr >><<# matrix.productionBuild >>-PROD<</ matrix.productionBuild >>
+          grep: "(initial-options/|logical-range/|panes/|plugins/|two-scales/|test-cases/)"
+          matrix: *graphics-test-matrix
+          <<: *graphics-test-config
+      - graphics-tests:
+          name: graphics-tests-part3-dpr<< matrix.dpr >><<# matrix.productionBuild >>-PROD<</ matrix.productionBuild >>
+          grep: "(series/|time-scale/|degenerative-horizontal-series-with-integer-min-tick/)"
+          matrix: *graphics-test-matrix
+          <<: *graphics-test-config
       - memleaks-tests:
           filters: *default-filters
           requires:

tests/README.md

@@ -47,7 +47,7 @@ You can run the coverage test with the following command:
 Alternatively, you can run the test on a specific file like this:
 
 ```bash
-node ./tests/e2e/coverage/runner.js ./dist/lightweight-charts.standalone.development.js
+npx esno ./tests/e2e/coverage/runner.ts ./dist/lightweight-charts.standalone.development.js
 ```
 
 #### Analysing the Coverage test
@@ -75,7 +75,7 @@ You can run the graphics tests with the following command:
 Alternatively, you can run the test on specific files like this:
 
 ```bash
-node ./tests/e2e/graphics/runner.js ./path/to/golden/standalone/module.js ./path/to/test/standalone/module.js
+npx esno ./tests/e2e/graphics/runner.ts ./path/to/golden/standalone/module.js ./path/to/test/standalone/module.js
 ```
 
 The following enviromental variables can be used to adjust the test:
@@ -85,7 +85,7 @@ The following enviromental variables can be used to adjust the test:
 - `CMP_OUT_DIR`: Directory to output the test artifacts. (Defaults to `.gendata`)
 
 ```bash
-PRODUCTION_BUILD=false DEVICE_PIXEL_RATIO=1.5 node ./tests/e2e/graphics/runner.js ./golden/lightweight-charts.standalone.development.js ./dist/lightweight-charts.standalone.development.js
+PRODUCTION_BUILD=false DEVICE_PIXEL_RATIO=1.5 npx esno ./tests/e2e/graphics/runner.ts ./golden/lightweight-charts.standalone.development.js ./dist/lightweight-charts.standalone.development.js
 ```
 
 ### Memory Leaks
@@ -103,7 +103,7 @@ You can run the memory leak test with the following command:
 Alternatively, you can run the test on a specific file like this:
 
 ```bash
-node ./tests/e2e/memleaks/runner.js ./dist/lightweight-charts.standalone.development.js
+npx esno ./tests/e2e/memleaks/runner.ts ./dist/lightweight-charts.standalone.development.js
 ```
 
 ### Interactions
@@ -121,5 +121,5 @@ You can run the interactions tests with the following command:
 Alternatively, you can run the tests on a specific file like this:
 
 ```bash
-node ./tests/e2e/interactions/runner.js ./dist/lightweight-charts.standalone.development.js
+npx esno ./tests/e2e/interactions/runner.ts ./dist/lightweight-charts.standalone.development.js
 ```

tests/e2e/graphics/helpers/get-test-cases.ts

@@ -1,7 +1,7 @@
 /// <reference types="node" />
 import * as fs from 'fs';
 
-import { basename, dirname, join } from 'node:path';
+import { basename, dirname, join, normalize, sep } from 'node:path';
 import { fileURLToPath } from 'node:url';
 
 const currentFilePath = fileURLToPath(import.meta.url);
@@ -14,6 +14,18 @@ export interface TestCase {
 
 const testCasesDir = join(currentDirectory, '..', 'test-cases');
 
+function splitPathToFolders(inputPath: string): string[] {
+	const normalizedPath = normalize(inputPath);
+	const folders = normalizedPath.split(sep).filter(Boolean);
+	return folders;
+}
+
+function extractTestCaseNameAndFolder(fileName: string): string | null {
+	const parentFolderAndFileName = splitPathToFolders(fileName).slice(-2).join('/');
+	const match = /^([^.].+)\.js$/.exec(parentFolderAndFileName);
+	return match && match[1];
+}
+
 function extractTestCaseName(fileName: string): string | null {
 	const match = /^([^.].+)\.js$/.exec(basename(fileName));
 	return match && match[1];
@@ -61,7 +73,7 @@ export function getTestCases(): Record<string, TestCase[]> {
 				if (!testFilterRegex) {
 					return true;
 				}
-				const name = extractTestCaseName(testCaseFile);
+				const name = extractTestCaseNameAndFolder(testCaseFile);
 				if (name) {
 					return testFilterRegex.test(name);
 				}