chartjs / chartjs/Chart.js

Color transitions do not work when CSS comments are in the color strings

Open
#12,079 4 comments 0 reactions 0 assignees View on GitHub
type: bug
Dominant language
JavaScript
Stars
67.7k
Forks
11.9k
Avg merge
7h 39m
Merged PRs (30d)
5

Description

### Expected behavior

when transitioning from this:

`chart.data.dataset[0].backgroundColor = 'rgba(255,0,0, /*alpha*/ 0.5)`

to this:

`chart.data.dataset[0].backgroundColor = 'rgba(0,255,0, /*alpha*/ 0.5)`

I would expect the transition to happen regardless of the comment in the `/* */`.

### Current behavior

Despite the final colors being correctly applied, there is no transition between the color in any setting. Color transition happens instantly

### Reproducible sample

https://codepen.io/Gianfry7/pen/qEddoZg

### Optional extra steps/info to reproduce

Refer to the codepen for a sample.

### Possible solution

I think the problem is in the default color interpolator which is not able to remove the commen, while the interpreter for the canvas does. One may regex away all the `/* */` content when parsing the color.

### Context

I incurred in this bug while trying to lazily apply border and background colors with a single settings for datasets.

### chart.js version

latest

### Browser name and version

_No response_

### Link to your project

_No response_

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.