Maui Hybrid - BlazorWebView tracking doesnt work correctly

[Kebechet]

Clarity doesnt correctly load app CSS and the final capture looks terrible.

https://www.google.com/search?sca_esv=ffb9636045d1fdd5&sxsrf=ADLYWIJgqvwBac6_uqDS_2biEKU5TgG6wA:1721082007551&q=clarity+doesn%27t+show+css&sa=X&ved=2ahUKEwjC08GNiqqHAxVYhf0HHWH-AisQ7xYoAHoECBAQAQ&biw=1745&bih=828&dpr=1.1

Collected info:

• Found in JS mentioned: clarityhybrid
• Troubleshooting link: https://learn.microsoft.com/en-us/clarity/session-recordings/troubleshooting-recordings
• WebView inside Android and iOS doesnt have CSS (.NET MAUI Hybrid) microsoft/clarity#636
• support email: [email protected]

[Kebechet]

I went through their:

• docs
• FAQ
• some Github issues

and I also sent them email regarding this issue. Currently I cant do more. Theoretically resolution of ticket:
microsoft/clarity#326 would do the job

[Kebechet]

I received response from Clarity. The limitation is that ALL styles that are needed for UI reconstruction have to be public. So when you have css baked only in your app it can be a problem. If you use e.g. bootstrap from public URL it will work as expected.

I will keep this issue opened till functionality for this is implemented into clarity.

[Kebechet]

Workaround:
Host your CSS on some public url and link them in your public app along those local ones. This way clarity will be able to reconstruct the UI session.

I was trying to disable the public CSS in index.html of my hybrid app so that there are not 2 same styles for everything but I wasnt able to. E.g. when applying disabled to the link href clarity wont be able to load it.