[BUG]: Colorful text rendering error

[liangmiQwQ]

Environment

System:
OS: macOS 15.0.1
CPU: (8) arm64 Apple M2
Memory: 71.69 MB / 16.00 GB
Shell: 3.7.1 - /opt/homebrew/bin/fish
Binaries:
Node: 23.9.0 - /opt/homebrew/bin/node
npm: 10.9.2 - /opt/homebrew/bin/npm
pnpm: 10.4.1 - /opt/homebrew/bin/pnpm
Browsers:
Chrome: 134.0.6998.118
Safari: 18.0.1
npmPackages:
@vueuse/core: ^13.0.0 => 13.0.0
motion-v: 0.13.0-beta.4 => 0.13.0-beta.4
nuxt: ^3.15.4 => 3.16.0
vue: latest => 3.5.13

Describe the bug

Colorful will threw an error in console

Uncaught TypeError: Cannot read properties of null (reading '0')
    at mixObject (motion-v.js?v=8097d189:3402:10)
    at mix (motion-v.js?v=8097d189:3448:10)
    at createMixers (motion-v.js?v=8097d189:3780:17)
    at interpolate (motion-v.js?v=8097d189:3801:18)
    at keyframes (motion-v.js?v=8097d189:3856:29)
    at MainThreadAnimation.initPlayback (motion-v.js?v=8097d189:3935:23)
    at MainThreadAnimation.onKeyframesResolved (motion-v.js?v=8097d189:3250:36)
    at DOMKeyframesResolver.onResolved [as onComplete] (motion-v.js?v=8097d189:3913:67)
    at DOMKeyframesResolver.complete (motion-v.js?v=8097d189:2989:10)
    at motion-v.js?v=8097d189:2910:44

Reproduction

Use Colorful Text in Nuxt project

Additional context

No response

Screenshots

Logs

Additional information

• Would you be willing to fix this bug?

[rahul-vashishtha]

Can you share more details about the error or the sample of your code how you are implementing this?

[liangmiQwQ]

I found a stable way to reproduce this problem. You can create a nuxt project and use anywhere, and you should swap your browser to other tabs for a while (just make sure the text of color will change when you are in another tab) and back to the tab with . It will show something wrong.

To fix this bug I think can set a rule to pause the animation when users swap to other tabs. May be I can try it

[liangmiQwQ]

I'm sorry to say that I didn't check the option of Would you be willing to fix this bug?, I make a pr to fix this bug but it has something not very good is that it will trigger and replay the animation when back to the tab with

[rahul-vashishtha]

Fixed in #163