fix: errors in XAxisTimeLabelsGenerator after prepending candles

jest.config.js

@@ -4,4 +4,8 @@ module.exports = {
 	transform: {
 		'\\.[jt]sx?$': 'esbuild-jest',
 	},
+	moduleNameMapper: {
+		'date-fns/esm': 'date-fns',
+	},
+	setupFiles: ['jest-canvas-mock'],
 };

package.json

@@ -72,6 +72,7 @@
     "husky": "^8.0.2",
     "is-glob": "^4.0.3",
     "jest": "^24.9.0",
+    "jest-canvas-mock": "^2.5.2",
     "lint-staged": "^13.0.4",
     "mocha": "9.2.0",
     "node-html-parser": "^6.1.5",

src/chart/__tests__/chart.test.ts

@@ -0,0 +1,36 @@
+import './env';
+import { createChart } from '../../index';
+import { generateCandlesDataTS } from '../utils/candles-generator-ts.utils';
+
+describe('chart', () => {
+	const candles = generateCandlesDataTS({ quantity: 50 });
+
+	it.each([
+		['zero -> non-zero candles', [[], candles]],
+		['prepend candles', [candles.slice(10), candles.slice(0, 10)]],
+		['prepend with a gap', [candles.slice(0, 10), candles.slice(20, 30)]],
+		['prepend with overlap', [candles.slice(10), candles.slice(0, 20)]],
+		['only update existing candles', [candles, candles.slice(10, 20)]],
+		['update all candles', [candles, candles]],
+		['append candles', [candles.slice(0, 10), candles.slice(10)]],
+		['append candles with a gap', [candles.slice(0, 10), candles.slice(20)]],
+		['append candles with overlap', [candles.slice(0, 20), candles.slice(10)]],
+		['prepend and append', [candles.slice(10, 20), candles.slice(0, 30)]],
+		[
+			"fill in the gap (won't work but should not error)",
+			[candles.slice(0, 10), candles.slice(11, 20), candles.slice(10, 11)],
+		],
+	])('should update candles in various scenarios: %s', async (scenario, updates) => {
+		const div = document.createElement('div');
+		const chart = createChart(div);
+		updates.forEach((update, i) => {
+			if (i === 0) {
+				chart.setData({ candles: update });
+			} else {
+				chart.updateData({ candles: update });
+			}
+		});
+		// wait for async tasks to complete successfully
+		await new Promise(done => setTimeout(done, 100));
+	});
+});

src/chart/__tests__/env.ts

@@ -0,0 +1,25 @@
+/* @see https://jestjs.io/docs/29.4/manual-mocks#mocking-methods-which-are-not-implemented-in-jsdom */
+Object.defineProperty(window, 'matchMedia', {
+	writable: true,
+	value: jest.fn().mockImplementation(query => ({
+		matches: false,
+		media: query,
+		onchange: null,
+		addListener: jest.fn(), // deprecated
+		removeListener: jest.fn(), // deprecated
+		addEventListener: jest.fn(),
+		removeEventListener: jest.fn(),
+		dispatchEvent: jest.fn(),
+	})),
+});
+
+Object.defineProperty(window, 'ResizeObserver', {
+	writable: true,
+	value: jest.fn().mockImplementation(
+		(): ResizeObserver => ({
+			observe: jest.fn(),
+			unobserve: jest.fn(),
+			disconnect: jest.fn(),
+		}),
+	),
+});

yarn.lock

@@ -663,6 +663,7 @@ __metadata:
     husky: ^8.0.2
     is-glob: ^4.0.3
     jest: ^24.9.0
+    jest-canvas-mock: ^2.5.2
     lint-staged: ^13.0.4
     mocha: 9.2.0
     node-html-parser: ^6.1.5
@@ -3397,7 +3398,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"color-name@npm:^1.0.0, color-name@npm:~1.1.4":
+"color-name@npm:^1.0.0, color-name@npm:^1.1.4, color-name@npm:~1.1.4":
   version: 1.1.4
   resolution: "color-name@npm:1.1.4"
   checksum: b0445859521eb4021cd0fb0cc1a75cecf67fceecae89b63f62b201cca8d345baf8b952c966862a9d9a2632987d4f6581f0ec8d957dfacece86f0a7919316f610
@@ -3685,6 +3686,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"cssfontparser@npm:^1.2.1":
+  version: 1.2.1
+  resolution: "cssfontparser@npm:1.2.1"
+  checksum: 952d487cddab591fb944f2a4c326a7736bc963784a6d92b6ad4051f3bf5ee49a732eff62e29a52ff085197cb07f5bd66525a2245ded7fd356113ac81be9238b9
+  languageName: node
+  linkType: hard
+
 "cssom@npm:0.3.x, cssom@npm:>= 0.3.2 < 0.4.0":
   version: 0.3.8
   resolution: "cssom@npm:0.3.8"
@@ -6572,6 +6580,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"jest-canvas-mock@npm:^2.5.2":
+  version: 2.5.2
+  resolution: "jest-canvas-mock@npm:2.5.2"
+  dependencies:
+    cssfontparser: ^1.2.1
+    moo-color: ^1.0.2
+  checksum: a3004d2e96473049045e49dcf98e5ea6011494048ab42b5422b3089d9ff406aaca8353e79587055d840fa145541668eb8f78613765f252ad5901a8217e91ea5d
+  languageName: node
+  linkType: hard
+
 "jest-changed-files@npm:^24.9.0":
   version: 24.9.0
   resolution: "jest-changed-files@npm:24.9.0"
@@ -7982,6 +8000,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"moo-color@npm:^1.0.2":
+  version: 1.0.3
+  resolution: "moo-color@npm:1.0.3"
+  dependencies:
+    color-name: ^1.1.4
+  checksum: 02bf59b6bbd5e86641bc062e2dc0843e6e579e18ef67e1c8e93bfc01945df578f20e66ce16aa9632db2aa0e16806e0914a26eb345a804f45fff1ae12a8906a29
+  languageName: node
+  linkType: hard
+
 "ms@npm:2.0.0":
   version: 2.0.0
   resolution: "ms@npm:2.0.0"