question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Delayed color change for invalid colors

See original GitHub issue

Expected behavior

I would expect the invalid colors to be constant.

Current behavior

When using invalid colors like rgba(267,292,60,0.2) or rgba(560,60,60,1) (with 267 & 560 outside the expected 0-255 range) the color is not “stable” on hover transition and changes twice.

Reproducible sample

https://jsfiddle.net/xafer/86rvbhoj/8/

Optional extra steps/info to reproduce

  • Hover on first bar “A” and exit: the bar A will update its color twice
  • Hover on second bar “B”: the bar B will update its color twice during hover

Possible solution

No response

Context

Since this happens with invalid colors the behavior is clearly unspecified but the current behavior is unexpected/surprising (and did not happen with v2.9.3).

chart.js version

v3.7.1

Browser name and version

No response

Link to your project

No response

Issue Analytics

  • State:closed
  • Created a year ago
  • Comments:6 (4 by maintainers)

github_iconTop GitHub Comments

1reaction
kurklecommented, May 22, 2022

Ok, looks like this is an issue with the color lib. <del>Transferring.</del>

Edit: can’t transfer. Anyway, it will be fixed in @kurkle/color v0.2.0

1reaction
kurklecommented, May 22, 2022

Maybe, I’ll debug this.

Read more comments on GitHub >

github_iconTop Results From Across the Web

invalid - CSS: Cascading Style Sheets - MDN Web Docs
The color red is commonly used to indicate invalid input. People who have certain types of color blindness will be unable to determine...
Read more >
Bootstrap form validation changing success and error colors
i want it to change colors using bootstrap's css classes, can anyone teach me how i could make that happen? p.s. i am...
Read more >
Changing success and error colors - FormValidation
Changing success and error colors. We can distinguish a valid and invalid field by colors. The label, message and feedback icon associated with...
Read more >
transition | CSS-Tricks
The transition property is a shorthand property used to represent up to four transition-related longhand properties:
Read more >
CSS Animations Not Working? Try These Fixes - HubSpot Blog
Say you have an animation that starts in one state — like black text — and ends in another state — like purple-colored...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found