Crayons issue when using localStorage API

Hi All,

We have submitted a public marketplace app in Freshdesk. The was working fine till the Crayons update. But now the dropdown fields fails to load.

Can someone confirm whether the crayons update will impact the existing app?


Thanks in Advance,
Priya Dharshini.

@Priyadharshini_Ramas,
Good Day, Welcome to the community!
There are plenty of changes in crayons v3,

kindly refer to this topic for more reference

Thanks

Hi @Santhosh

We understand that there are many changes in the Crayons V3.

But my concern is will this update in crayons will impact in the existing app? The public marketplace app was publish on September 2021.

@Priyadharshini_Ramas,
it will have an impact, we modified the CDN link to v2 by ourselves,
can you please confirm, by looking into the app (by inspecting the deployed app) which points to v2 or the latest version?

Thanks

Hi @Santhosh

Please refer the link below for the screenshot.
https://community.developers.freshworks.com/t/crayons-issue/5418?u=priyadharshini_ramas

Hi @Priyadharshini_Ramas,

For your question, yes, the Crayons V3 update affects existing apps as well. Since all the apps pointed to the latest version and v3 was released recently, all the apps by default started pointing to version 3.
So, we have migrated all the existing apps to point to v2 of the crayons version in the CDN URL.

We couldn’t find if your app points to which version in the screenshots that you have posted. Could you inspect the code of the app and check if the CDN URL has “@2” in it?

1 Like

Hi @Raviraj

Thanks for the explanation.

Since this app was published last year we have not used @2. We used just Crayons.

Please refer the below screenshot.

1 Like

@Priyadharshini_Ramas Actually, our team has migrated all the existing apps which are in production to use v2 of Crayons and the URL will have “@2”.

Only when you publish a new version of the app, you will have to add “@2” to the URL as mentioned in the Crayons v2 documentation.

In the screenshot shared, it shows the whole Freshdesk page’s code. Could you right-click on the app and inspect the app’s code? You can find the HTML code you have used in the app if you do so.
Could you check if the Crayons CDN URL used in the HTML content of the app has “@2” in the imported script’s CDN URL?

It should look like the following script.
<script nomodule="" src="https://unpkg.com/@freshworks/crayons@2/dist/crayons/crayons.js"></script>

1 Like

Hi @Raviraj

Please find the screenshot below.

@Priyadharshini_Ramas I see this app has “@2” in the imported CDN URL for Crayons. The issue is not with the breaking changes introduced in the Crayons v3.

Could you please debug the issues for any changes in the app? Or help us troubleshoot account to access shared with me (raviraj.subramanian@freshworks.com) and reproducing steps if the app was not changed and introduced issues in the production?

9 posts were merged into an existing topic: App is stuck in Draft state since Crayons release

Thanks for the link.

1 Like

Hi @Raviraj ,

We are still facing the issue issue in crayons dropdown fields. The App is deployed in Market place last year. So the customers are reaching us regarding the issue. Please do needful on this.

Updates from Office Hour with @Priyadharshini_Ramas and team today:

  1. The app was last published on Sep 2021
  2. The app already uses crayons@2 URL, as found by inspecting the app’s iframe
  3. The app uses localStorage to store data in the browser. Given that the Platform has disallowed localStorage usage, this was throwing an Unhandled exception due to not handling any error that may result from the localStorage API call.
  4. Suggestion: Use client.db instead.

This is not a Crayons issue, but an issue arising out of using localStorage, whose exception was blocking rendering of some Crayons components that depend on the resulting data. Once the localStorage code is replaced with client.db there may still be other exceptions that will surface.

2 Likes

@Priyadharshini_Ramas We are trying to debug the localStorage issue on our end. It will be very helpful if you can share the following details:

  • App ID (or URL if it is a public app)
  • Account ID and region if it is a custom app
  • A screenshot or log showing the localStorage error