Announcement

Collapse
No announcement yet.
X
  • Filter
  • Time
Clear All
new posts

    Problem with rendering of Ribbon Bar items using the latest Chrome v78.0.3904.70

    v11.1p_2019-08-17/LGPL, Chrome v78.0.3904.70, using the Enterprise skin.

    Since Chrome has been updated to v78.0.3904.70 we've noticed a problem with the rendering of Ribbon Bar items, in that item titles are now wrapped below any icon whereas before they were inline with the icon. This is not apparent when running through Firefox Quantum 69.0.3, the item titles are inline with the icon. This is demonstrated by the following test case :

    Code:
    <!DOCTYPE html>
    <html>
    <head>
        <script type="text/javascript">var isomorphicDir = "/isomorphic/";</script>
        <link rel='stylesheet' type='text/css' href="/isomorphic/skins/Enterprise/skin_styles.css" />
        <script type="text/javascript" src="/isomorphic/system/modules-debug/isc_core.js"></script>
        <script type="text/javascript" src="/isomorphic/system/modules-debug/isc_foundation.js"></script>
        <script type="text/javascript" src="/isomorphic/system/modules-debug/isc_containers.js"></script>
        <script type="text/javascript" src="/isomorphic/system/modules-debug/isc_grids.js"></script>
        <script type="text/javascript" src="/isomorphic/system/modules-debug/isc_forms.js"></script>
        <script type="text/javascript" src="/isomorphic/system/modules-debug/isc_databinding.js"></script>
        <script type="text/javascript" src="/isomorphic/system/modules-debug/isc_richtexteditor.js"></script>
        <script type="text/javascript" src="/isomorphic/system/modules-debug/isc_drawing.js"></script>
        <script type="text/javascript" src="/isomorphic/skins/Enterprise/load_skin.js"></script>
    </head>
    <body>
    <script>
        isc.RibbonBar.create({
            top: 0,
            members: [
                isc.RibbonGroup.create({
                    title: "File",
                    controls: [
                        isc.IconButton.create({
                            title: "Edit",
                            icon: "[SKIN]/actions/edit.png"
                        })
                    ]
                })
            ]
        });
    </script>
    </body>
    </html>
    If the output of this is compared between Chrome and Firefox it can be seen that the title "Edit" is below the icon in Chrome but inline with the icon in Firefox.

    An observation, if the line <!DOCTYPE html> is removed then Chrome behaves correctly and shows the item titles inline.

    Would appreciate if someone could take a look at this please.

    Thanks,
    David.

    #2
    This is due to a change in handling of nowrap and &nbsp; in Chrome 78 - we're looking into it and will update here when we have more information.

    Comment


      #3
      Interestingly the problem does not appear to replicate in chrome dev v79.0.3945.8 or chrome canary v80.0.3948.

      Comment


        #4
        Thank you

        Comment


          #5
          There is an open Chromium thread on this native bug here: https://bugs.chromium.org/p/chromium...ail?id=1017465
          Given the visibility of this bug and the fact it appears to be well understood we anticipate a public fix fairly quickly.

          In the meantime we are auditing and working around cases where this causes broken display in the framework, so users aren't stuck waiting on Chrome.
          (The IconButton wrapping issue visible in RibbonBars will be fixed in the next nightly build)

          Regards
          Isomorphic Software

          Comment


            #6
            Thank you,

            Can confirm that the nightly build dated 25-10-2019 has fixed the wrapping title problem in Ribbon bar items.

            Regards,
            David.

            Comment

            Working...
            X