TypeScript: chartHelpers.getRelativePosition(new Event(''), new Chart()) doesn't pass

[cyantree]

Expected behavior

When passing a Chart instance to the helper method getRelativePosition() I expect the types to be correct. In v3 this worked.

Current behavior

The types don't match and the following error will be shown:

const chart: Chart<"bar", number[], string>
Argument of type 'Chart<"bar", number[], string>' is not assignable to parameter of type 'Chart'.
  Type 'Chart<"bar", number[], string>' is missing the following properties from type 'Chart': _options, _aspectRatio, _layers, _metasets, and 41 more.ts(2345)

Reproducible sample

https://codesandbox.io/s/typescript-playground-export-forked-ufm45w?file=/index.ts:435-491

Optional extra steps/info to reproduce

Open the sandbox, ignore the runtime error and just look at the TS compiler error.

Possible solution

No response

Context

No response

chart.js version

v4.2.1

Browser name and version

No response

Link to your project

No response

[LeeLenaleee]

There does not seem to be any ts errors

[cyantree]

@LeeLenaleee It seems you've run the example on a mobile device, correct?
Please try again on a desktop computer as the mobile version doesn't seem to run type checking.

[pete-mcwilliams]

Just ran into same issue in latest after upgrade from v3...

Error: libs/charts/src/lib/components/line/line.component.ts:74:69 - error TS2345: Argument of type 'Chart<"line", (number | Point | null)[], unknown>' is not assignable to parameter of type 'Chart'.
Type 'Chart<"line", (number | Point | null)[], unknown>' is missing the following properties from type 'Chart': _options, _aspectRatio, _layers, _metasets, and 40 more.

Had to cast my chart to any.

[etimberg]

I'm guessing the unknown on the chart type is the problem which comes from https://github.com/chartjs/Chart.js/blob/master/src/types/index.d.ts#L487

When the chart has data, the unknown is then inferred from the data type.

[candelrg]

Hello.
This issue is still present in latest version of chart.js. (4.4.7)
With VSCode, when I get inside the getRelativePosition method, I can see the following class (helpers.dom.d.ts):

import type Chart from '../core/core.controller.js';
import type { ChartEvent } from '../types.js';
[...]
export declare function getRelativePosition(event: Event | ChartEvent | TouchEvent | MouseEvent, chart: Chart): {
    x: number;
    y: number;
};
[...]

The problem comes from the imports.
instead of

import type Chart from '../core/core.controller.js';
import type { ChartEvent } from '../types.js';

you should use

import type { Chart, ChartEvent } from '../types.js';

to make things work correctly inside typescript.
Otherwise, we get an error like

Argument of type 'Chart<keyof ChartTypeRegistry, (number | [number, number] | Point | BubbleDataPoint | null)[], unknown>' is not assignable to parameter of type 'Chart'.
  Type 'Chart<keyof ChartTypeRegistry, (number | [number, number] | Point | BubbleDataPoint | null)[], unknown>' is missing the following properties from type 'Chart': _options, _aspectRatio, _layers, _metasets, and 40 more.ts(2345)

This change must be done inside chart.js project

[etimberg]

@candelrg are you able to send a PR with that change?

[candelrg]

Hello and sorry for the late answer.
I'm not sure how to, because I did not clone the github project yet (I discovered the code with what node installed).
But I will give it a try.

[candelrg]

Hello again.
Sorry, it is not possible for me to do a PR.
I failed to even clone the project with ssh from the place I work.
So, in order to help, I downloaded the zip to identify the concerned class, and I found it:
src/helpers/helpers.dom.ts