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

Font icons are not loaded in IE11 / Edge running on Windows 10

24 Answers 997 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
Telerik Admin
Top achievements
Rank 1
Iron
Telerik Admin asked on 30 Mar 2017, 12:09 PM

In Windows 10 there is a feature(and a policy that applies the feature), which blocks the so-called "untrusted fonts". Untrusted fonts mean any font not installed %windir%/fonts, including web fonts.

With this feature enabled (or the policy applied) custom fonts, such as font icons will not be loaded regardless of the provider. Hence, font icons used by Kendo UI, Kendo UI for Angular and Telerik UI for ASP.NET AJAX, MVC, Core will not be loaded.

More information about the Windows 10 feature that blocks the untrusted font icons could be found below:

https://support.microsoft.com/en-us/help/3053676/windows-10-technical-preview-adds-a-feature-that-blocks-untrusted-fonts

24 Answers, 1 is accepted

Sort by
0
Alan
Top achievements
Rank 1
answered on 11 May 2017, 01:12 PM

So the unfortunate solution would be to use the last Kendo UI version (2016 version) that used images instead of font icons?

I'm using Kendo UI on sites accessed by government persons and since we don't have control over how their networks may configure their machines, if they are blocking untrusted fonts (which can be done in Windows 7 as well) then there is no way we could ever use a Kendo UI version beyond the last 2016 ver.

I like font icons, but can't justify paying for licenses for future versions when I know that portions of my user base may never be able to use font icons for the foreseeable future, thus making Kendo UI somewhat unusable in my world.

 

 

 

0
Ivan Zhekov
Telerik team
answered on 15 May 2017, 02:37 PM
Alan,

as of now we don't really have an answer for that question.

We are evaluating a couple of options, namely, providing an alternative stylesheet that uses image icons or employing svg icons, with both having their ups and downs.

The ups for image icon alternative are that images are unlikely to be disabled as technology anytime soon, unless you are browsing in windows high contrast mode with a browser lower than Edge. The downs are that we need at least 3 sprites for the task and a workaround for the aforementioned high contrast mode.

The ups for svg is that it doesn't suffer from the high contrast issue; it's scalable; controllable by css (if made the correct way)... The downs are higher markup payload; couple of browser issues to name a few.

As soon as we have chosen a direction, we'll update this thread with our intended resolution.

Regards,
Ivan Zhekov
Telerik by Progress
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Alan
Top achievements
Rank 1
answered on 16 May 2017, 03:16 PM
Understand, and thanks for the reply. If I can supply any additional information regarding this kind of scenario, please let me know.
0
EIMCM
Top achievements
Rank 1
answered on 26 Jul 2017, 04:02 PM
Running into this issue as well.  In creating our workaround it would be good to know if this is something you are still looking at?  Any possibility of it being in a 2017 release?
0
Ivan Zhekov
Telerik team
answered on 28 Jul 2017, 11:48 AM
According to a recent Microsoft blog post -- https://blogs.technet.microsoft.com/secguide/2017/06/15/dropping-the-untrusted-font-blocking-setting/ -- Microsoft is dropping the setting (stated in the title), or removing the recommendation to enable this setting (stated later in the text).

With that in mind it seems, that the policy will be either removed or needs to be disabled without any security consequences. Note: according to the last comment, disabling the policy does not enable font downloading (which is another security policy).

We'll monitor closely the development of the issue and if need be, we'll provide a fix.

Regards,
Ivan Zhekov
Progress Telerik
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Mathews
Top achievements
Rank 1
answered on 19 Sep 2017, 11:45 PM
I have a production release on October, are we planning to get some fix soon?
0
Ivan Zhekov
Telerik team
answered on 22 Sep 2017, 06:43 AM
As of now we don't plan on providing a fix, as there is no need due to Microsoft re-evaluating their font blocking policy.

Just to be on the same page, Untrusted font blocking policy differs from Allow font download policy. The former disabled use of fonts not located within windir/fonts directory (for any Microsoft app), while the latter simply doesn't download any fonts (in Internet Explorer and Edge).

Regards,
Ivan Zhekov
Progress Telerik
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Alan
Top achievements
Rank 1
answered on 25 Sep 2017, 06:32 PM

I don't know if this applies to the other folks who have posted on this thread, but I can attest to the fact that government entities are usually much slower at adopting and implementing change; especially if there is any potential security risk (real or perceived) involved. So if they can still block font icons in any way, they probably will and if that is the case, then my original point still stands - using Kendo UI beyond 2016 version has an inherent use risk in this regard because of the sole reliance on font icons for visual cue, thus making it somewhat unusable to support government clients.

I do understand that you have no plans for a fix at this time and that you would have to make product decisions looking forward, just wanted to express that, in the scenario of font icons, making them the only option causes some grief.

0
Mathews
Top achievements
Rank 1
answered on 25 Sep 2017, 06:46 PM

Looks like Kendoui for external website is not a good choice going forward. I would not recommend Kendoui to anybody. Many of my clients are not seeing any icons in the grid, dropdowns and so on. I had a fix for my personal icons with a .svg alternative, but kendo seems to be impossible to fix. I am not in a position to go back to a version before 2016 too.
I wish Telerik will provide a work around at the earliest.

0
Ivan Zhekov
Telerik team
answered on 27 Sep 2017, 03:52 PM
Looking at the blog post I've referenced earlier -- https://blogs.technet.microsoft.com/secguide/2017/06/15/dropping-the-untrusted-font-blocking-setting/ -- it seems that the policy was made available with the first release of Windows 10 (v1507) is no longer applied with the so called Creators Update (v1703), which is available since August 17th, 2017.

From the clarifications in the comments it also seems that the policy applies to IE 11 only, so another option would be to use Edge browser (comes with all windows 10 installations).

The best way to resolve the issue would be to upgrade to that version, or if a newer is available.

If that is not applicable at this time, there are other ways to resolve the issue: if the issue is happening in a controlled environment, apps can be excluded from the mitigation policy, as described in the Block untrusted font documentation (https://docs.microsoft.com/en-us/windows/threat-protection/block-untrusted-fonts-in-enterprise).

It's worth noting that the MS staff is responding quite swiftly, so questions related to enabling / disabling the policies, as well as the scope of the policies could be directed at either at the blog post, or the documentation article.

For the time being, it's not feasible to change our font icons to svg icons, because it's resource consuming and the benefit will be only for those affected e.g. the rest of the customers will not see almost any difference.

Proving an image sprites is also not an option, because some themes don't have them at all; and all themes use font icons for certain controls.

Regards,
Ivan Zhekov
Progress Telerik
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Maxime Bellemare
Top achievements
Rank 2
answered on 01 Nov 2017, 02:16 PM
[quote]Ivan Zhekov said:Looking at the blog post I've referenced earlier -- https://blogs.technet.microsoft.com/secguide/2017/06/15/dropping-the-untrusted-font-blocking-setting/ -- it seems that the policy was made available with the first release of Windows 10 (v1507) is no longer applied with the so called Creators Update (v1703), which is available since August 17th, 2017.

From the clarifications in the comments it also seems that the policy applies to IE 11 only, so another option would be to use Edge browser (comes with all windows 10 installations).

The best way to resolve the issue would be to upgrade to that version, or if a newer is available.

If that is not applicable at this time, there are other ways to resolve the issue: if the issue is happening in a controlled environment, apps can be excluded from the mitigation policy, as described in the Block untrusted font documentation (https://docs.microsoft.com/en-us/windows/threat-protection/block-untrusted-fonts-in-enterprise).

It's worth noting that the MS staff is responding quite swiftly, so questions related to enabling / disabling the policies, as well as the scope of the policies could be directed at either at the blog post, or the documentation article.

For the time being, it's not feasible to change our font icons to svg icons, because it's resource consuming and the benefit will be only for those affected e.g. the rest of the customers will not see almost any difference.

Proving an image sprites is also not an option, because some themes don't have them at all; and all themes use font icons for certain controls.

Regards,
Ivan Zhekov
Progress Telerik
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.

[/quote]

Any ideas why we do not have the problem when using kendo CDN ?

0
Ivan Zhekov
Telerik team
answered on 02 Nov 2017, 01:54 PM
Hi, Maxime.

The following is just speculation and should be taken with a grain of salt.

Back in the days, when IE 10 and 11 became available some versions of .net framework were not able to recognize them as such. So to target this Microsoft had set up a site that contained definitions of many sites and instructed IE 10/11 to spoof another browser string. Among those sites were all of Telerik domains. In other words, if you had hosted a single page on demos.telerik.com and on arandomsite.com, you would get different experience when opening it with the same browser.

So here is the speculation: perhaps, there is the same rule that allows fonts from certain sites to be processed. But that's just a speculation.

And also, in our Sass themes (and their less counterparts) we embed the fonts within the styles (as base64 data url). We have not verified if such fonts would be blocked.

So depending on the actual scenario, any of the following is possible:

* the policy is no longer applied
* the policy is applied, but the kendo cdn is white listed
* the policy is applied, but white lists all embedded fonts

Regards,
Ivan Zhekov
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Craig
Top achievements
Rank 1
answered on 07 Dec 2017, 09:43 PM
So this is a big problem for us not showing pager and other font icons. I went through the documentation to exclude iexplore.exe turning off/on the policy and cannot get it to work.  Has anyone gotten this to work for IE11 with the newest Kendo?  Is the only known solution going back to the prior release?
0
Ivan Zhekov
Telerik team
answered on 08 Dec 2017, 10:40 AM
Craig,

could you test with the new sass based themes, either kendo-theme-default or kendo-theme-bootstrap, which have embedded font icons as base64 resources. If the problem persists, then the only solution would be downgrade. If the issue is fixed, we'll iterate over the less themes to embed the font as well.

Regards,
Ivan Zhekov
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Craig
Top achievements
Rank 1
answered on 08 Dec 2017, 03:35 PM
I assume you mean the Sass files from KendoUI for Angular?  I don't know how similar in styles they are.  Is it just compile and it would generate a plug and play replacement for the current CSS?  Would love to see Telerik put out a workaround for this rather than me hack at the CSS.  As it is 50% of your base still use IE11 and telling them to run Edge won't fly well.
0
Craig
Top achievements
Rank 1
answered on 11 Dec 2017, 06:43 PM

Well I worked around the issue by adding to the specific classes a background image which was identical to the font image.  In IE you see these images in other browsers the overlay is unnoticed as it is identical in position and size.  It was a PIA but this seemed the least disruptive.

I would like to see Telerik address this in a more formal manor as IE still accounts for a large base for many companies.

0
Magdalena
Telerik team
answered on 12 Dec 2017, 11:39 AM
Hello Craig,

SASS based themes are all themes available for KendoUI for Angular and Default v2 and Bootstrap v4 in KendoUI for jQuery. We are afraid that there is no update about a new workaround or planning of providing a fix for this moment.

Regards,
Magdalena
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Craig
Top achievements
Rank 1
answered on 19 Dec 2017, 03:43 PM
Just wanted to give an update.  I did in fact go the route of regenerating my Kendo theme with the new builder.  This did seem to work fine in all browsers. One word of warning though if you have CSP policies you will need to update your font-src rule to include "data:" so that CSP will allow the font to be loaded.
0
Dimitar
Telerik team
answered on 21 Dec 2017, 09:19 AM
Hеllo Craig,

Thank you for the feedback provided. I will forward the suggestion to the development team for further discussion.

Regards,
Dimitar
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Ivan Zhekov
Telerik team
answered on 25 Dec 2017, 09:34 AM
Hi, Craig.

I am glad things worked out.

One last thing -- when you said that you needed to tweak the CSP, that rang a bell in a colleague of mine and he referred me to this article: https://docs.telerik.com/devtools/aspnet-ajax/general-information/troubleshooting/content-security-policy. (We'll update the article to include the aforementioned "data:" part, obviously) But I wanted to ask you if the fonts would be loaded if you set the CSP meta tag as in the article?

Regards,
Ivan Zhekov
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Maxime Bellemare
Top achievements
Rank 2
answered on 19 Mar 2018, 02:57 PM
So now knowing this is fixed with an embeded font in SASS theme, could you embed the fonts in LESS too ?

It is not considerable for us to switch from LESS to SASS right now.
0
Ivan Zhekov
Telerik team
answered on 21 Mar 2018, 08:01 AM
Hello, Maxim.

You have a point. While we do have our hands full with features for 2018 R2, we'll do our best to make up some time to embed the fonts.

Regards,
Ivan Zhekov
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Dina
Top achievements
Rank 1
answered on 08 May 2018, 03:41 PM
This situation is a complete disgrace. I have project in production now and many of clients use (and used to) IE 11 and they do not want to change it to chrome. I do receive complains every day
0
Dimitar
Telerik team
answered on 10 May 2018, 11:49 AM
Hello Dima,

We have logged a task concerning the discussed security policy in the Kendo UI GitHub repository - issue #4208. We will update the item with additional details as soon as possible.

In the mean time, there is a provided workaround in the issue that might be used as a temporary solution. 

Regards,
Dimitar
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Tags
General Discussions
Asked by
Telerik Admin
Top achievements
Rank 1
Iron
Answers by
Alan
Top achievements
Rank 1
Ivan Zhekov
Telerik team
EIMCM
Top achievements
Rank 1
Mathews
Top achievements
Rank 1
Maxime Bellemare
Top achievements
Rank 2
Craig
Top achievements
Rank 1
Magdalena
Telerik team
Dimitar
Telerik team
Dina
Top achievements
Rank 1
Share this question
or