CSS loads, but body content obscured and un-readable

[GrahamAtOliver]

Clarity is installed on ballantines.com

We are seeing screen recordings and heatmaps load. We are not seeing the issue where recordings load without CSS as colours, fonts and positioning are all correct.

However, it is almost as if there is an opaque layer lying above the body content of the page that makes it almost impossible to see what's happening on screen. Text and images are present, but in an incredibly faint, ghost-like way. Obviously, the pages are normal in real life. Occasional elements will appear as normal - e.g. pop-ups.

I can see no errors in the browser console. We are using a Permissions-policy HTTP header of display-capture(), but I would expect there to either be a browser error or nothing showing at all if this were interfering with the recordings. While the Clarity documentation has excellent coverage of Content Security Policy, I can't see any mention of either Permissions-policy or Feature-policy.

Here is what an example page should look like:

Here is what the Clarity recording shows:

[GrahamAtOliver]

I have since seen this behaviour on my own computer (not via Clarity recording) and it was down to a web application firewall blocking access to some .JS files. Are there publicly available lists of Clarity IP addresses that we can allow-list in our WAF?

[sayushman19]

I am also facing similar css issue on project whose id is - jxftj6xnug, it works sometimes and sometimes gives the error on console that like - GET https://www.clarity.ms/tag/uet/355013735?insights=1 net::ERR_NAME_NOT_RESOLVED