Blocks with text - Text Gradient Color not appearing if I type random characters

[andeng1106]

Describe the bug

• Issue happens in editor only
• If I set a Gradient Text Color and typed random characters, it won’t add the gradient color
  • But if I type a correctly spelled word, numbers, special characters, it shows the gradient color
• Happens to blocks with text such as:
  • [ ] Heading
  • [ ] Text
  • [ ] Subtitle
  • [ ] Icon List
  • [ ] Image > Caption
  • [ ] Price
  • [ ] Progress Bar
  • [ ] Count Up
  • [ ] Number Box
  • [ ] Countdown (no dynamic content)
  • [ ] Table of Contents > Title
  • [ ] Timeline date

To Reproduce Steps to reproduce the behavior:

1. Add a new page
2. Add any block mentioned in the description
3. Type "Stackable typinffg random words 23981382938"
4. Change Text Color to a Gradient Color
5. See that the "typinffg" still doesn't have the color

Expected behavior

• The gradient text color should apply to all characters in the block

Screenshots

https://github.com/user-attachments/assets/edbbcc1c-9ba0-4a40-8827-4372d60d6b06

[bfintal]

Looks like a possible fix for this is to make sure that the -webkit-text-fill-color is also applied in ::spelling-error. You can use this to test:

h2.stk--is-gradient::spelling-error {
    -webkit-text-fill-color: #0000;
}