Recording shows image gradient instead of text when text is styled with linear-gradient

[mifegui]

Bug description

When a text is styled with background-image: linear-gradient to achieve a gradient on the text, the posthog recording records the background-image instead of the text.

The text:

How it appears in the recording:

How to reproduce

1. Have a page with similar text and gradient This is the css that is most likely causing the issue. I think the relationship of background-image: linear-gradient and -webkit-text-fill-color : transparent and -webkit-background-clip: text; is not being properly considered/calculated by posthog

   text-align: left;
   color: #1D2D35;
   font-family: 'Verdana', sans-serif;
   font-weight: 700;
   background-image: linear-gradient(352deg, #FF7F7F 0%, #1D2D35 70%);
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;

   2. Visit it and see recording

Environment

• [x] PostHog Cloud

Additional context

The text has been styled this way as it is the default way in which carrd.co makes colors gradients in a text. The same thing might happen in other page builders.

[benjackwhite]

@mifegui that does seem off! Have you got a link to a recording I can take a look at and investigate if it's something we can fix easily?

[mifegui]

@benjackwhite Surely

I am assuming the way you can check the recording is to simply give you the link I bave when I am watching here