Issue with my Angular Ionic app where the SCSS files aren't being properly tracked, which is causing the Heat Maps UI to be destroyed.

microsoft / clarity

A behavioral analytics library that uses dom mutations and user interactions to generate aggregated insights.

https://clarity.microsoft.com

MIT License

2.15k stars 214 forks source link

Issue with my Angular Ionic app where the SCSS files aren't being properly tracked, which is causing the Heat Maps UI to be destroyed. #545

Open tuhinkolese opened 8 months ago

tuhinkolese commented 8 months ago

Hello everyone,

I am currently facing an issue while implementing ms-clarity in an Angular website and ionic Native (Android application) using Capacitor. While the clarity dashboard is successfully capturing data, the SCSS/CSS is not loading properly.

I kindly request your assistance in proposing a solution to this problem. Any input or advice would be greatly appreciated.

ibradwan commented 8 months ago

Hi tuhinkolese,

Could you please elaborate more whether you're using the ClarityJs script within your website or you're using the Clarity SDK for Ionic apps?

tuhinkolese commented 8 months ago

Hi Ibrahim, In our project, we utilize the Clarity SDK for Android. For the web portion of the project, we use the ClarityJS Script which is placed in the index.html head tag. For further reference, I have shared a code snippet for the web portion below.

........... ...........

Project Framework: We are using Ionic with Angular along with Capacitor for the Native part of the project.

ibradwan commented 8 months ago

Well, you should need to do so if you're using the Ionic package, because the package will capture both native and web content in the same session.

tuhinkolese commented 7 months ago

Well, I removed the script from HTML and used the ionic package but in the web, ClarityPlugin is not defined.

tuhinkolese commented 7 months ago

ibradwan commented 7 months ago

Yes that's a known issue with Capacitor + Ionic cordova based plugins. Please apply this condition and see:

tuhinkolese commented 7 months ago

The Problem is that SCSS files are not being properly tracked, which is causing the Heat Maps UI to be destroyed.

Would you be able to provide me with the necessary line of code for the web platform for Ionic? While the Android platform appears to be functioning correctly, and Tracked in Clarity DashBoard but CSS issue exists.

tuhinkolese commented 7 months ago

For Android implementations

kiranraj1430 commented 2 days ago

The Problem is that SCSS files are not being properly tracked, which is causing the Heat Maps UI to be destroyed.

Would you be able to provide me with the necessary line of code for the web platform for Ionic? While the Android platform appears to be functioning correctly, and Tracked in Clarity DashBoard but CSS issue exists.

You are right, am also facing same issue from last 5months. Move on to another. am also facing additional issue UI not rendering after install this plugin. totally waste