Style bind `background-image` not updating on `color-interpolation-method` change

[BobbieGoede]

Vue version

3.3.4

Link to minimal reproduction

https://stackblitz.com/edit/vitejs-vite-pp4jpy?file=src%2FApp.vue

Steps to reproduce

• Change the color space input to lch, some of the gradients will change.
• Change the text color input to blue, text in all gradients change color to blue.
• Change gradient direction input to left, all gradients will change direction, previous unapplied color space changes are taking effect as well.
• Change the color space input to srgb, some of the gradients will change.

What is expected?

The background-image style attribute should update when the its value has been changed.

What is actually happening?

The background-image style attribute does not update when the color space (color-interpolation-method) changes. It does update when:

• No other attributes have been bound to the component
• A different value inside background-image is changed, such as colors or gradient direction.
• inheritAttrs is set to false

System Info

System:
    OS: Linux 5.0 undefined
    CPU: (8) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
    Memory: 0 Bytes / 0 Bytes
    Shell: 1.0 - /bin/jsh
  Binaries:
    Node: 16.20.0 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 9.4.2 - /usr/local/bin/npm
    pnpm: 8.6.10 - /usr/local/bin/pnpm

Any additional comments?

I am working on a gradient picker component and adding support for different color spaces. For some reason the color space wouldn't update, and while trying to create a reproduction it seemed to be working find until I added additional binds/attributes to the component. Please let me know if more information is needed!

[wusiquan]

Change the color space from rgb to lch, the corresponding values should be converted, use css lch() function
I found a useful tool here

[edison1105]

@BobbieGoede
The issue can no longer be reproduced with your reproduction.
All the gradients will change when I change the color space input to lch or srgb .

[BobbieGoede]

@edison1105
Thanks for giving it a look! You're right it looks like it's no longer reproducible, I'm not sure how it's been resolved as even when pinning the older versions it seems to work 😅..

Either way I'm happy that it works, so I'll close this!