This is a migrated thread and some comments may be shown as answers.

Weird characters showing up in grid sometimes

9 Answers 1058 Views

Grid

This is a migrated thread and some comments may be shown as answers.

Praveen asked on 24 Jul 2020, 04:50 AM

screen-shot-2020-07-23-at-8-10-18-pm.png

Sometime our angular 9 application (after leaving idle for sometime), starts displaying these characters in kendo grid. Please see attached image.

This happens for all drop downs, left, right arrows etc. Reloading sometimes fixes it but sometimes I need to open a new browser.

can you please suggest what might be happenning?

Thanks

9 Answers, 1 is accepted

answered on 27 Jul 2020, 12:26 PM

Hi Praveen,

Thank you for the provided screenshot.

We are unaware of such type of error so far. What can I suggest at this point is to ensure that the resources are loaded correclty and also check if the issue appears when the themes are loaded locally (from the CDN). In case the issue persists then the issue comes from the local build system. It is important to mention (not sure if it's relative to the case) that the icon font is embedded using data URI base-64 encoding and MVC bundling is known to not process data URI correctly, so do not bundle/minify the file. However, these are just shots in the dark.

I am afraid that we need some more details about this case such as which theme is used, in which browsers the issue appears, and a runnable example if possible so that we can inspect the code and be able to provide more efficient assistance. Thank you in advance.

Regards,
Martin
Progress Telerik

answered on 28 Jul 2020, 12:46 PM

dropdown901cc2e22e1a4fd5916e1683b9b1ffbd.png

grid083460f036424888805b07f4163caa98.png

datepickerd529ff6cdaac47fc9be077815f75edee.png

combo.png

I am also facing same kind of issue from friday for angular 6 for kendo UI compnenets- dropdown, combobox, grid and dateInput.

The kendo icons css are getting replaced by wired characters. PFA screenshots.

It is working perfectly on local but not working after deployment. Also tried by pointing to dist (prod build) and working fine.

Please suggest cause/solution.

answered on 30 Jul 2020, 08:06 AM

Hi Anjali,

We further investigate the case with our front end development team and we were able to reproduce the reported issue on Mac and the latest Chrome version (tested with v 84.0.4147.89 and v 84.0.4147.105).

After consulting with them, the encoding issue seems to be causing the undesired behavior. There are two scenarios that can be considered in this case:

- encoding issues related to the Chrome browser itself (which should affect many users and the issue would be known up to now).

- encoding issues with Dart Sass. Internally our sass styles are compiled with Dart Sass in order to package CSS files at the end. But Dart Sass has some encoding problems. We notify the sass team for them, and we will try to fix the issue on our side.

We typically abstain from giving exact timelines as we would not like to make promises we might not be able to hold, but our front end team will do their best to release a fix by Friday this week.

Regards,
Martin
Progress Telerik