ServiceNow CMS issues in Fuji

If you have upgraded to Fuji you might have discovered that it caused some issues with your CMS portal. The main issues being:

  • A modified version of Twitter Bootstrap is already included
  • Not all UI scripts execute

The version of bootstrap that is included has some changes to it (such as modified media queries) that can cause some negative side effects to your site. The good news is that it can be disabled by creating a system property called “glide.ui.heisenberg.exclude” and setting it to “view_content”. Once set, you will need to include your own version of Bootstrap if needed.

The issue with UI scripts will be fixed in Fuji Patch 2, however the work around is to include empty script tags (<script></script>) in front of all your existing <script> tags. The issue is that it is skipping every odd numbered script tag. Example:

Only alert 2 and 4 would be executed. So until you are able to upgrade to Fuji Patch 2, the solution is to include the extra script tags.

10 comments

  1. Thanks Nathan, I hit both of these issues yesterday. My initial solution was to overwrite the ServiceNow defined media queries but what you’ve proposed here is a much better way of doing things.

    Given that ‘glide.ui.heisenberg.exclude’ is an undocumented, hidden system property I’m wondering if there are any others like it that you could tell us about. It would be great to have some more controls over what system code gets output into our CMS pages.

    Looking forward to Patch 2 to fix that weird script issue.

  2. Hi Nathan,
    I am on Fuji patch 2 and with added property per your suggestion. However, the menus continue to disappear when I click on them. Everything is configured exactly as you have posted on your video. Any ideas why this continues to happen?

    1. Matt, I’m assuming you are referring to a Bootstrap menu. The fixes in this post do not resolve the issue with menu’s disappearing as that is a conflict between jQuery and Prototype.js. The issue is actually nothing specific to ServiceNow either. Checkout out the following links that offer some workarounds:

      http://www.softec.lu/site/DevelopersCorner/BootstrapPrototypeConflict
      http://stackoverflow.com/questions/19139063/twitter-bootstrap-3-dropdown-menu-disappears-when-used-with-prototype-js

      Let me know if that works for you.

      1. Hi Nathan,

        Thanks to you, I have solved a lot of issues with our CMS implementation. The Jquery.Ajax thing worked for us after we followed your approach.

        Now , we have run into issues with Fuji. I have a bootstrap Navbar. The menu items go missing on click and also , the Toggle of the buttons don’t work. Modal windows don’t show up.

        I tried following the instructions on the links provided by you but couldn’t make it work. The Modal window shows up after i added the javascripts provided on the links but it disappears immediately. However, this is a good sign as I wasn’t able to view the modal. Now atleast it comes and then disappears.

        I guess Prototype JS is being called the last and the require.js functionality is negated.

        Let me know, if you can help on this.

        Regards,
        Vijay

        1. Vijay,

          Yeah I’ve been so swamped with the new Service Portal that I haven’t had a chance to look in to this yet. Lemme get through this week and I’ll see what I can do.

  3. Nathan,
    I appreciate your responses and the provided links. I’ve been spending days going through forums and your links with no luck. Something dramatic has changed in fuji which is not making the life easier for us 🙁 I have tried all sort of workaround from Bootstrap friendly Prototype JS to custom fixes, but my menus continue to disappear. Interestingly, if I turn off the SN bootstrap by setting the property you mentioned, the dropdown not only disappear, the nested menus within dropdown don’t work either. Any feedback you can provide is highly appreciated.

  4. We are in the process of upgrading to Geneva and do have an issue with the iframe with id ‘gsft_main’ to load. After debugging, we found out that the class ‘chrome touch_scroll non_standard_lists’ is causing the issue. Removing ‘touch_scroll’ from the class name renders the page properly. Is there a way to overwrite or skip ‘touch_scroll’ class.

    -Aman

    1. I’m not sure, I haven’t run into this issue before. Just off the top of my head; you could write a javascript that removes the class after page load or do a search for “tocuh_scroll” in UI Macros, as the iframes and the content blocks live in UI Macros.

Leave a Reply to Alcides Cancel reply

Your email address will not be published. Required fields are marked *