BuyLog In
Bug Report T950685
Visible to All Users

Icons are incorrectly displayed in DevExtreme components and certain CSS files are not requested

created 4 years ago

Issue: ASP.NET Project Template - Icons do not display correctly in and certain CSS files are not requested
Sample: A project made with our ASP.NET Core project template attached below

To reproduce: Simply run the project. If the issue is not replicated on the first load, refresh the page. The issue occurs more frequently when the browser's DevTools is open.

Actual Behavior:
Icons are not correctly loaded
Clipboard-File-1.png

Expected Behavior: Icons should be loaded correctly.

Comments (2)
DevExpress Support Team 4 years ago

    Hi,

    It looks like the font loading was interrupted. Then, this data got into the browser cache. Could you please clarify if this error appeared after a hard reload and clearing the cache?
    Clipboard-File-1.png

    I look forward to your reply.

    DevExpress Support Team 4 years ago

      Hi,

      As a follow up to this ticket, we've determined that this issue is not related to a browser's cache. It is related to the encoding of our CSS styles. For an immediate workaround, I suggest that you add the following line to the dx.common.css, dx.gantt.css and dx.diagram.css files.

      CSS
      @charset "UTF-8";

      Afterwards, delete the vendor.css file and rebuild the project. Then, issue with icons should be fixed. If you encounter any issues with this workaround, let us know.

      Regards,
      Luis

      Sign in to comment on this post

      Answers approved by DevExpress Support

      created 4 years ago (modified 4 years ago)

      We have addressed the issue described in this ticket and will include a fix in our next maintenance update. Should you need to apply our fix prior to official release, you can request a hotfix here.

      Note: Hotfixes may be unavailable for betas/updates set for release within a week.

      Additional information:

      We researched this issue and found that it relates to the incorrect charset processing by chrome dev. tool.
      To avoid this, we added a new style sheet file to our Visual Studio template.

      To resolve this issue in the existing project, add a new css-file with only one line of code at the top of your css-bundle.

      Charset.css

      Code
      @charset "UTF-8";

      bundleconfig.json

      Code
      {
    "outputFileName": "wwwroot/css/vendor.css",
    "inputFiles": [
        // Adding UTF-8 charset to the top of the bundle
        "wwwroot/css/devextreme/Charset.css",
       ...

      Please contact us if you have additional questions.
      We will do our best to help you.

        Sign in to comment on this post

        Disclaimer: The information provided on DevExpress.com and affiliated web properties (including the DevExpress Support Center) is provided "as is" without warranty of any kind. Developer Express Inc disclaims all warranties, either express or implied, including the warranties of merchantability and fitness for a particular purpose. Please refer to the DevExpress.com Website Terms of Use for more information in this regard.

        Confidential Information: Developer Express Inc does not wish to receive, will not act to procure, nor will it solicit, confidential or proprietary materials and information from you through the DevExpress Support Center or its web properties. Any and all materials or information divulged during chats, email communications, online discussions, Support Center tickets, or made available to Developer Express Inc in any manner will be deemed NOT to be confidential by Developer Express Inc. Please refer to the DevExpress.com Website Terms of Use for more information in this regard.