refactor: project rewrite in TypeScript (#146)

* refactor: rewrite the project in TypeScript

* ci: make CI run on pull_request trigger

* fix(test): fix checkDraggingConfiguration unit test for inexistent chart not working properly

* refactor(test)!: reduce number of test cases in interaction.spec.ts E2E test suite

* ci: change triggers for ci.yml

* ci: enable verbose logging of codecov action & pass codecov token via env var

* ci: downgrade codecov action to v3 due to constant 500 ISE responses with v4

* chore: proper exports in package.json

* fix: bundler outputs, tests coverage not working

* fix: use closeBundle to properly copy declaration files for test bundles

* fix: page bundler asset path, package.json files include path to dist

* test: added applyMagnet unit test

* refactor: use chart.js helpers in cartesian calc instead of calculating manually; added clipValue

* test: added applyMagnet & reorganized tests files; added config checking helpers to tests

* test: increased screenshot testing threshold in E2E

* refactor(test): add jest-extended matchers & refactor tests to use toHaveBeenCalledExactlyOnceWith

* refactor(test): add dragEndCallback test suite, add extended matchers to jest tests

* refactor: strip utils property from plugin object, add comment to index.ts

* fix(test): fix dragEndCallback test

* test: more tests for plugin drag start, progress & end handlers

.eslintrc.json

@@ -5,5 +5,13 @@
 	"rules": {
 		"prettier/prettier": ["error"],
 		"import/no-extraneous-dependencies": ["off"]
-	}
+	},
+	"overrides": [
+		{
+			"files": ["*.ts", "*.tsx"],
+			"parserOptions": {
+				"project": "./tsconfig.eslint.json"
+			}
+		}
+	]
 }

.github/workflows/ci.yml

@@ -1,6 +1,11 @@
 name: Continuous Integration
 
-on: push
+on:
+  push:
+    branches:
+      - master
+  pull_request:
+  workflow_dispatch:
 
 jobs:
   tests-and-coverage:
@@ -59,7 +64,7 @@ jobs:
         run: npm test
 
       - name: Upload coverage reports to Codecov
-        uses: codecov/codecov-action@v4
+        uses: codecov/codecov-action@v3
         with:
           fail_ci_if_error: false
           files: ./coverage/e2e/coverage-final.json,./coverage/unit/coverage-final.json,./coverage/integration/coverage-final.json

.gitignore

@@ -1,5 +1,5 @@
 coverage
-/dist
+dist
 docs/assets
 pages/dist-demos/assets
 pages/dist-e2e

README.md

@@ -126,9 +126,8 @@ const draggableChart = new Chart(ctx, {
 				showTooltip: true, // show the tooltip while dragging [default = true]
 				// dragX: true // also enable dragging along the x-axis.
 				// this solely works for continous, numerical x-axis scales (no categories or dates)!
-				onDragStart: function (e, element) {
+				onDragStart: function (event, datasetIndex, index, value) {
 					/*
-          // e = event, element = datapoint that was dragged
           // you may use this callback to prohibit dragging certain datapoints
           // by returning false in this callback
           if (element.datasetIndex === 0 && element.index === 0) {
@@ -138,15 +137,15 @@ const draggableChart = new Chart(ctx, {
           }
           */
 				},
-				onDrag: function (e, datasetIndex, index, value) {
+				onDrag: function (event, datasetIndex, index, value) {
 					/*     
           // you may control the range in which datapoints are allowed to be
           // dragged by returning `false` in this callback
           if (value < 0) return false // this only allows positive values
           if (datasetIndex === 0 && index === 0 && value > 20) return false 
           */
 				},
-				onDragEnd: function (e, datasetIndex, index, value) {
+				onDragEnd: function (event, datasetIndex, index, value) {
 					// you may use this callback to store the final datapoint value
 					// (after dragging) in a database, or update other UI elements that
 					// dependent on it

jest.config.ts

@@ -13,7 +13,7 @@ const config: Config = {
 		"<rootDir>/tests/unit/jest.unit.config.ts",
 		"<rootDir>/tests/integration/jest.integration.config.ts",
 	],
-	collectCoverageFrom: ["src/*.{js,ts,jsx,tsx}"],
+	collectCoverageFrom: ["src/**/*.{js,ts,jsx,tsx}"],
 	coverageReporters: ["lcov", "json"],
 	coveragePathIgnorePatterns: testPathIgnorePatterns,
 	verbose: true,