Expose canvas data to assist in automated testing

[generator87]

Currently to test canvas charts using automated testing many are using some screenshot comparison tools which are pain but if it would be possible to easily get json data for the chart canvas then testing would be faster and more reliable. Just imagine some simple javascript like for example document.getElementById("#montlyTemperaturesCanvas") would have return including json data that was used to draw that canvas then automated test could easily parse this and check that correct data was used.

[LeeLenaleee]

You can do this:

Chart.getChart(canvasId);

With this you get the chart instance for that canvas if it is made which has all the configuration.

[LeeLenaleee]

You can still use the Chart.getChart method, you just need to make the Chart object available by adding it to the window like so:

import Chart from 'chart.js/auto';
window.Chart = Chart;

const chart = Chart.getChart(canvasId);

Otherwise you need to keep it at image based testing

[generator87]

import Chart from 'chart.js/auto';

when I try to import Chart from 'chart.js/auto'; using chrome debugger console I get the following errors. It means some code on out side need to be changed to allow Chart to be imported?

:

[LeeLenaleee]

Yes in your code where you make the chart you add it to the window:
In code base:

import Chart from 'chart.js/auto';
window.Chart = Chart;

new Chart(ctx, config);

In debugger console:

Chart.getChart(canvasId);

[generator87]

Yes in your code where you make the chart you add it to the window: In code base:

import Chart from 'chart.js/auto';
window.Chart = Chart;

new Chart(ctx, config);

In debugger console:

Chart.getChart(canvasId);

Thanks, we will try this soon and I will post about the results.

[generator87]

Yes in your code where you make the chart you add it to the window: In code base:

import Chart from 'chart.js/auto';
window.Chart = Chart;

new Chart(ctx, config);

In debugger console:

Chart.getChart(canvasId);

Thank you for your help. Your suggestion works fine. It is possible now to drill down to get any value of the chart.