IE and Portal – Standards/Quirks Mode Evolution (or Love-Hate Relationships)
The newer versions of IE pose many rendering issues/challenges which affect EP rendering. There are so many complications and solutions around this subject that it’s really hard to deal with.
So I decided to learn this subject and make some order in all this mess – so that I’ll know how to handle the variety of issues that come to our door here at support. In this blog I will share some of these issues with you.
I used kind of childish graphics – but I think that they demonstrate my points nicely.
So here’s an historical review of the evolution of the standards/quirks issues:
1. In the beginning –old IE versions
The older versions of IE (such as IE6, IE7) ran only in quirks mode. The portal rendered everything in quirks mode with no issues. Applications running in the portal were not strict about standard syntax and they lived happily within IE – which wasn’t strict about syntax either.
Then IE with standards mode arrived and evolved and the portal had to deal with rendering issues…
2. IE8 presents standards mode
IE8 and above presented standards mode rendering. For IE8 and IE9 the default mode is quirks, but if the administrator configured all the browsers in an organization to run in standards mode, the portal wouldn’t be rendered well.
Enforce IE to run the portal in quirks mode by changing the document mode.
How? We added an iView to all framework pages. The iView adds parameter to the header and tells IE to render in quirks mode.
This iView has to be added to every non-standard framework page for the portal to be rendered correctly.
And peace is restored…
3. SAP presents UI5 applications
In recent years SAP introduced a new UI technology for SAP applications called SAP UI5. UI5 applications are written in standards mode and require standards mode rendering, while the portal runs only in quirks mode. Standards and quirks can’t run together on the same page.
Run standards-mode applications in a separate window which opens in standards mode.
How? Set the “Launch in New Window” property of the iView to “Display in separate headerless portal window (standards mode)”. This navigation mode, as its’ name implies, tells the iView to open in a new window and sets the HTML header to standards.
And the smile is back…
4. IE10 and IE11 presents QME mode – quirks mode is not really quirks anymore
From IE10 the values that were previously used for rendering pages in quirks mode (Emulate IE7/Emulate IE8) are now rendered in QME (Quirks Mode Emulation). In this QME mode there are slight differences in some values that the browser returns and the portal again is not rendered well.
Use another value (IE=5, IE=EmulateIE7 ) to enforce the “old” quirks mode.
How? Change the “Browser Mode” property value of the “Browser Document Mode” iView to IE=5
5. IE11 run in standards mode by default
When a new window is opened by an application in IE11, the new window is opened in standards mode by default (before IE11, the new window was opened according to the parent window’s mode). If the application that is opened in the new window doesn’t support standards mode – it will be rendered incorrectly.
Enforce IE11 to render the newly-opened page in the correct rendering mode.
How? Check the document mode of the parent window before opening the new window, and enforce the parent’s mode on the child.
Note: 1969004 – Open navigation mode 1 (new window) rendering mode according to the parent window rendering mode
This note has a few side effects which were fixed in the following notes:
6. IE11 presents itself as Mozilla
According to Microsoft documentation, the IE11 user agent string was changed to be compatible with modern browsers. It returns the following string: “Mozilla/5.0(Windows NT 6.3; Trident/7.0; rv:11.0) like Gecko.”
This string was not familiar to the portal, and the portal recognized IE11 as if it was Mozilla. Due to that, the X-UA-Compatible string which changes the document mode to quirks was not sent to the browser, causing rendering issues.
Another instance of this problem appears in HTMLB applications.
HTMLB APIs also check for the UserAgent of the browser, and like the Portal – the HTMLB code recognized IE11 as Mozilla, and as a result upload wrong sources to the browser, and the controls don’t function as expected.
Familiarize the portal with the new user agent string as an IE11 user agent.
How? Add this new user agent string to the “user agents” dictionary of the portal.
Note: 1972506 – Cannot access portal with Internet Explorer 11
Fix for HTMLB: note 2000759 – HTMLB Support for IE11
And we’re smiling again…
7. Standards mode Web Dynpro applications
Some WD ABAP/JAVA applications started running standards by default (for example – HCM). Because the Portal enforces quirks mode, these applications have rendering issues when they run in the portal. The result is bad rendering of the applications.
Enforce the application to run in quirks mode.
How? Add a parameter (SAP IE parameter) to the application URL which tells the application in which mode it should run. For quirks it would be ie=EmulateIE8” and for standards ie=Edge”.
This works for all ABAP applications except for SAP Transaction iViews (SAP GUI for HTML) which receive the application parameters in another format, so the sap-ie parameter is not aggregated to the URL as expected.
In newer portal SPs all of this happens automatically (see note 1814711) and the portal knows what to send to every destination.
But! Previous to the versions mentioned in the note, you had to set the SAP IE parameter manually for all applications, and for SAP Transaction iViews you had to do a special configuration according to note 1970427.
Side effect note to 1753544:
8. iViews running in standalone mode (with no framework page)
There are scenarios that Portal AI iViews are opened in new window directly, means: some application navigate to the URL of the iView without using the navigation APIs.
Examples for this are: previewing an iView (from the content management), BI launcher – launches BI iViews directly.
Since there is no framework page – there is no direction for the browser in which document mode to be opened, so the browser opens in the default mode. In IE11 the default mode is “Edge”, and hence there are rendering issues for iView that needs “Quirks” rendering.
Add the meta-tag for document mode indication (either standard or quirks) in the head of the iView HTML
How: The correct value will be detected by a new property on the iView, which indicates whether the iView should be running and quirks mode or standard mode.
I wrote an extensive blog about this topic which explains the issue and the solution for it: Rendering issues when running portal iView with no Portal framework (standalone)
There are few notes for this issue:
These are all of the issues that I’m aware of at the moment. I hope that this blog made some sense in all the confusion around the portal and IE.
I want to end this blog with some good news.
You were probably thinking “why don’t they just adjust the main framework pages in the portal to be compliant with standards mode? This would solve many of the issues mentioned here!”
Well… we are! In the next SPs of 7.31 (SP14) and 7.40 (SP9) the Ajax Framework Page will support standards mode!
You can read the blog that my colleague Matan Mizrahi wrote about the Ajax Standards Framework page: Ajax Framework Page in IE standards mode and the note which describe the framework page is: 2001910 – AFP Standards mode support.
Very good blog with detailed analysis..great work..
Great work!! single place to solve IE rendering issues.
Nice blog, Single stop blog for IE related issues
Well written, and I like the smiley faces. This is something that affects all portals where the users use newer versions of IE (so, officially from 7.40 for IE11!). In our case, we also have a few ABAP WDs that are rendered outside of the portal. For those, the iViews need to have ApplicationParameters of sap-ie=Edge so that they render in standards mode.
Also, I thought the Unified Framework Page was the recommended framework page for the future, why discuss the Ajax Framework Page?
Thank you for the feedback!
You are correct about sap-ie=edge when running standard. As I mentioned - the fix done in note 1814711 will automatically send the correct value according to the document mode of the Portal.
As for UFP - this farmework page indeed support standards mode, but we don't recommend on this framework to customers because it lacks of many features - among them branding of the Portal. That's why we decided to enable standards mode for AFP.
Another interesting development for customers who wants to move forward to the UI5 applications and the new UA experience - in 7.31 SP12/7.40 SP07 we presented the Fiori framework page. You can read more about it in Aviad's Blog: SAP Enterprise Portal 7.4 SP7 – SAP Fiori Launchpad on the SAP Portal and more...
Great Blog Maya! love the images 🙂
Well… we are! In the next SPs of 7.31 (SP14) and 7.40 (SP9) the Ajax Framework Page will support standards mode!
That sounds like very good news!
Awesome 🙂 . And now instead of IE we have Chrome that doesn't respect the standard and will have a quirk mode in the future..... This is so hard.... 🙂
Thank you guys for all the feedbacks!
I'm not that experienced in writing blogs and it's really encouraging to get these kind of feedback! 🙂
Thanks for writing this wonderful blogs with full of smileys 🙂
We are supporting customers and solving their rendering issues with number of notes mentioned in your blog, but this is one place which we can recommend customers to understand the cause for the rendering problem and the solution which will work for customer.
This is really a great blog. I especially like the overview of the SAP notes. And the images 😉
But... Basically the approach is to enforce quirks mode as much as possible and if you really, really need standards mode, use the new window approach. That's not exactly a nice way of doing things in 2014. Most of the time I use custom frameworks with custom branding etc. But even then I often can't choose to go for standards mode because of all of these "legacy" technologies that don't work well (content management tools, especially KM content/applications, Web Page Composer, Web Dynpro etc.). Life would be so much easier if standards mode was supported all the way... I really hope that if the AFP will support standards mode in 7.40 SP9, it doesn't imply a whole bunch of limitations such as don't use this or that type of application (KM, Web Dynpro etc.).
I agree with what you say standards is the way we are going
We must remember, as you say, that we still have many "legacy" application to host in the portal, alongside with the new content (UI5, etc...)
Most of the "end user" FWPs today are standards only (UFP, FFP) and joining soon in the Standards enabled AFP.
If you're using a custom FWP you can set it to enforce Standards mode rather then Quirks just by adding the DocMode iView (mentioned in SAP Note 1458799) to you're FWP and setting it to enforce IE=Edge.
Quirks mode... it gave me a headache for a long time. Nowadays my custom framework runs in standards mode, no more quirks for me. But the problem is the old application that still need the quirksmode, SAP or non-SAP even!
There's a solution for it. As you might now, if the framework runs in standards mode, all iframes will run in standards mode as well. This is causing the compatibility messages. I am pretty sure a lot of applications will move to the standards mode as well, but in the meantime just do the following:
I just edited the blog with a fix (only IE11 and not IE10 renders pages as standard by default) and added another instance for the UserAgent issue in IE11 (see issue number 6)
Maya, this is excellent. Your "childish graphics" are brilliant! Along with the timeline of how things changed, they really help get the point across about how this all fits together, and the struggles we all face, and the collection of Notes to help the poor system administrator make it work are invaluable. Thank you.
Great blog Maya, its very helpful and clear. Thanks
Great overview and insight provided Maya.
Very Informative blog Maya. Thanks
Fantastic blog and job!
Thanks for your blog, very nice explained.
Since I have been struggling around with browser modes as well, there is some additional information:
- IE8 standards mode is not really the standards mode you are looking for - IE8 supports CSS2.1.
- IE8 quirks mode runs in CSS2.1
- IE9 standards mode does support CSS3.0
For SAPUI5 you will need CSS3, that's why you need at least IE9 (standards mode), Chrome or FF.
With the release of IE11 the browser does respond different to the appName, as you mentioned "Note: 1972506 - Cannot access portal with Internet Explorer 11". There will be a patch shortly for the pageSupport.js file in the portal, since resizing iframes in the portal sometimes does not work properly - in my case in my custom framework.
So the AFP framework will support standards mode in the future. Finally I can use Chrome for administration purpose as well 🙂
Thanks a lot for the blog, its a life saver.
Very well explained, thanks a ton.
Nice blog with good use smileys! We have been living through this pain for years now 🙁
Excelente trabajo! (great work!) Thanks!
Excellent summary of the Browser-Chaos and THX for all the work you did to bring us the different solutions to the known problems.
I'd like to also suggest reading the related blog by Andreas about Standards mode enablement of SAP UI technologies (>=IE9) - summary
Very valuable summary of current status of Standards Mode support by SAP UI technologies and UI clients.
Thanks Thomas for this helpful Link too.
Lets see what happens with Spartan 😉
I'm thoroughly confused, despite a good write up here. We are using IE11 and accessing Portal 7.31 SP13 running embedded ABAP Web Dynpro content (NW 7.31 SP9). When logging into this scenario (ESS), we get the message pop up:
"Use the device standards in your application - otherwise the application will not work correctly or visualization errors may occur"
Then my browser freezes up.
We set the browser document mode iview to use ie=5,ie=EmualteIE7, but this still occurs.
If I enable compatibility view for the site (or whole intranet), the error doesn't occur.
So I'm now not sure what the best server side solution is...we need to be able to support the greatest variety of browsers, as users will be accessing this from their own computers as well as company internal PCs (IE 9, IE 11, etc.).
Your issue seems to be related to the last issue described
in this blog (Standard mode WD applications).
The Portal is running in quirks mode and you configured it
correctly – otherwise you’ll have terrible rendering issues with the Portal.
The application on the other hand – requires standard mode
You can solve it in one of the 2 ways:
application to be opened in new portal window – standard mode (you’ll find this
option in the property “Launch in new window” property of the application’s
the application properties and set the value to be EmulateIE8 (see mode details
in note 1753544). This value “tells” the application to run in quirks mode. (the
WD applications have standard mode and quirks mode versions). This will make
the application fit to the quirks mode of the Portal and the application will
be able to run in-place in Portal.
In the past, I had faced the same problem with Standard and quirks mode. I was able to solve it via custom framework adding Browse document into my framework. I had written a blog on this as well. Below is the link. Please go through and your inputs on blog will be highly appreciable.
Launching iView in new window without PORTAL HEADER doesn’t work
I am also very confused. We are upgrading our ECC System to EHP7, NW 7.4 SP8. Our EP is only at NW 7.30 SPS 5. When I execute MSS Reporting from the portal, I get a message pop-up: "The standards mode is not supported for document modes less than 8 (Note 1970689)". I know this is related to the last issue in your blog - Standard Mode WD applications.
The Reports workset contains the Report page with the following iViews: Launchpad (com.sap.pct.erp.common.reportlaunchpadpcd). I have added Application Parameter sap-ie=EmulateIE8 to this iview. We no longer get the pop-up on the launchpad page but when any report link is selected, we get the pop-up before the employee selection page is rendered. Note 1737445 implies that we need to move to a higher NW7.3 patch level but our Basis area does not want to do that at this time as we have an upcoming portal project.
Our Business Process Owner is not open to having the report selection launch in a new window.
Do you have any suggestions as to what we can do as a temporary fix?
We are facing the same problem on our EP/MSS
Could you solve this problem? Would be great if you could share your solution.
We had to make several changes to resolve the "standards mode" popup.
displaying the “Standards Mode” popup. Solution - Add application parameter sap-ie=EmulateIE8 to the MSS Reports iview
Hope this helps you out.
Thank you so much for this awesome reply.
This comment was very helpful. Thank you Maya for creating the post and Joyce for sharing your experience with the parameter tweaks.
Unfortunately my problem was not solved by these configurations.
But I got this error message in NWA logs: "Error getting document mode from iView"
According to SAP Note 2123361 I could solve my problem by patching "EP-Basis" component.
The rendering issues are never-ending and keep pop-uping and new scenarios.
I just updated the blog with a new scenario related to the rendering issues with I (case number 8)
As mentioned – I wrote a separate blog about it (Rendering Issues when Running Portal iViews in Standalone Mode in Internet Explorer (IE)), but since this is another case of rendering issue – I decided to update also this blog.
Thanks for your excellent blog. Can you suggest a solution for an issue wherein the portal screen doesn't show a horizontal scrollbar whenever the zoom level is more than 100% in IE11.
Due to this, the information that flows horizontally couldn't be accessed.
have a look at the following SAP Note.
Also watch out for the High DPI Feature of Microsoft Windows.
Thanks for your reply,
I have read the notes and links provided and it seems SAP netweaver portal 7.4 will work correctly at zoom level 100% only.
The only concern here is the portal works fine for zoom level >100% in Internet explorer 9. It readjusts in a way like no components in the framework goes out of the page(same behaviour when minimizing the portal using browser minimise button).
There are lot of bugs in terms of IE11 behaviour with netweaver portal.
can you advise? I am thinking of any iview property or parameter that can be changed
there is also a SAP Note for older Browser which also advised you to use IE only in 100% Zoom Mode.
There is also a not so well documented iView Setting called "Default Document Rendering Mode" for SAP NW 740 with the following values
a. Quirks ->X-UA-Compatible" content="IE=5, IE=EmulateIE7
b. Standard ->X-UA-Compatible" content="Edge
They are important if you choose a direct call of an iView (like a path out of the PCD or BI Launcher iView) but i dont think they will effect your special case.
I have an issue where the webdynpro abap iviews are not showing scrollbars even when the Window features property has scrollbars=1.
Launch in new window has been set as "Display in a headerless portal window."
I have an browser issue on Portal 7.4 sp09,On ESS --> claims --> after submitting request, while take print out its coming 2 pages insted of 1 page( second page is showing blank) & same thing in google chrome its showing perfectly fine, its displaying one page.
My application is running wdj app.
Kindly suggest where need to settings on IE.
It’s hard to tell why it’s happening without having more information.
There’s one thing that I can suggest: If you’re using classic framework page (or a framework based on it) and the “Calim” application is opened in a new window - you may check if the framework page is loaded twice – in such case you would see on the same window the tool bar of the Portal appearing 2 times.
If this is the case(and there were such cases with some applications) – the code of the application needs to be solved – they’re probably not using the Navigation APIs to navigate in the Portal and this causes the portal to be opened again in the same farme.
Its WDJ application & its related to ESS claims. let me explain complete process,ESS-->claims --> select type--> fill required feilds--> submit, then its generating ESS tracker no then here we have option print button--> it will open complete form on same page--> here again we have print button--> when click on print button, it will open printer options.click on ok --> print will happen with additional blank page.
Same print is perfectly fine in google chrome browser.
The issue here is because of the resolution/rendering difference between the two browsers(IE & Chrome), and because of it some part of the page which forms the border or extra space is making it to print the extra blank page which you can see in IE print.
The Solution to this would be to shorten the view/app page size by either decreasing the spacing between the two elements or decreasing the text size or table size. So basically the adjustment part i leave to you as it depends on what all elements you have used in your View.
Before applying the above solution make sure which browser your target user would be using. In case it's IE & chrome, you can simply apply above solution and shorten the size to make it some on one page. If it's only chrome you may leave it as now as Chrome is working fine for that size.
Test: To test if your issue is because of what i mentioned above you can simply try printing the app and while printing try selecting ony current page in print settings instead of all pages. It would print fine in IE as well. But since this would not be done by all users better adjust the size.
Hope this helps! 🙂
Thanks for your inputs.
Today i have cross checked again on IE 8 browser, its perfectly fine, its giving exact page print,Please suggest me how we can process the same.
Thanks in advance.
Very thorough blog, well-written and organized, pictures are pure ROTFL. 🙂 All SAP employees should make note and follow this excellent and creative example.
Thank you for sharing!
at first thanks for the excellent blog.
We were facing the same Problem that different applications (quirks vs. Standards mode) have to be integrated in our Portal (7.4 SP9).
Our solution was that we customized two Ajax-Framework Pages which looked the same and then added a "Framework switcher" application. This means that for old applications (indicated via a role-property ) which Need quirks mode we reload the Portal and Switch to the quirks-mode-Framework. If the enduser navigates then back to an application which supports Standards mode we reload the Portal again and Switch back to the other Framework. The reload Performance is very good....
Your solution is interesting and creative.
When you switch between the frameworks – does it take you to the node you’ve navigated to?
Now this is what I call creative 🙂 Great job Maya!!!
Being in the process of migrating our SAP Citrix service over to IE 11, this has been invaluable!
I do however have a query about the notes/solution for point 6, IE 11 being treated as Mozilla. We are using SNW 7.40 SP11 and I cannot for the life of me identify the "User Agent" dictionary?
Any advice is greatly appreciated!
It is obvious you are really wxperienced EP consultant. Great.
Thanks for this blog.
Let me explain my problem.
We used to add the URL parameter sap-ie=Emulate IE8 with the Web GUI transactions( opened as standard browser page, not as a Portal IVIEW ). We needed this addition because otherwise it never used to display the Enjoy transactions like (ME21N) properly.
Now that the IE is upgraded to 11, we have all the kinds of issues. The screen does not respond some time, many times it just locks in the screen where we enter the Header Text or when we add attachments.
Can you suggest if I can change the URL Parameter to something like this which may resolve it?
Please suggest if I need to try anything else.
thanks for this nice overview!
Do you know the status on EP 7.5? Does that also still require IE to run in compatibility mode?
7.5 still runs in quirks for administration but we are working hard to have it run all in standards.
It will be in the upcoming SP's.
You might also want to refer to SAP note 2151072 for a fix for the standards mode issue within the Enterprise Portal system. That note interestingly enough has a link to this blog included in it. 🙂
we do have a problem with XML news in our portals (XML Forms). We use NW 7.40 SP12 and news are created via XML Forms. Creating the news happens inplace the portal.
the overview page (an SAP iView - KMNewsDisplay) is also integrated in Portal. So everything is rendered in IE5(Komp) - we use AJAX FWP.
But if an enduser clicks on a news, a new window opens and the content of the news (SHOW part from XML Forms Builder) is rendered in Edge.
the URL to this like this: http://<server>:<port>/irj/go/km/docs/documents/News/6082d932-8cd8-3310-3d93-bf76111b8824.xml
Any ideas how we can force the news to open in same rendering mode as inplace in portal (IE5)?
if we set compatibility mode for portal url in IE11, it works, but we can not set this due to other restrictions (e.g. Fiori iViews, HTML5 apps)
thanks and regards,
You need to add
<meta http-equiv="X-UA-Compatible" content="IE=5">
in order to have it open in quirks.
nearly correct 🙂 .
we have to modify the .xsl file which is used for displaying the xml-form ( xxxx_show.xsl, located in KM under etc/xmlforms/<name_of_xml_form>).
<meta http-equiv="X-UA-Compatible" content="IE=5, IE=EmulateIE7"/>
thanks to Kiril from SAP who told us this solution!
by the way, hopefully soon portals will run completely in EDGE inclusive KM 🙂
I just wanted to say that this blog..... is one of the most useful blogs I ever saw on SDN and well presented, too. Thanks!
It is very interesting and too easy to understand
Thanks for your excellent blog. Can you suggest a solution for an issue wherein the portal screen doesn’t show alle value in table cell for iview in IE11on Laptop screen. Othervis in normal screen showing alle value in cell. Our customer can not see alle the information when they using Laptop.
Thanks for any help
Hello Maya Amit,
Wonderful blog. I have an issue where in while accessing transactions iviews in IE 11 we are getting blank page.
My portal version is 7.0 SP 14. I tried giving the application parameter as sap-ie=EmulateIE8. However it didn't resolve my issue.
I appreciate if you can help me out of this.
the rendering issue are more, when you upgrade from NW 740 to NW 750. even you switch to standard mode, still intermittently giving errors. do we have any document on NW 750 IE rendering issues.
we have quicklinks pointing to ABAP WDs. Now ABAP BAckend was upgraded to NW 7.50, these quicklinks are giving just a blank page in the content area; like Ritesh mentioned above.
These ABAPA WD iviews already have set the NAvMode =10 (open in new headerless portal window (standards mode); but this type only works for normal navigation and not for Quick Links.
Example: iview JohnDoe, points to ABAP WD. NavMode10, quicklink ..../portal/irj/johndoe
Before upgrade of ABAP Backend: due to quicklink bug, WD opens in content area of portal
After upgrade of ABAP Backend: WD would like to be opened in content area, but area stays blank, due to js. errors. In F12 Dev tools you see that the backend delivers some content; so backend does not refrain due to XSRF etc.
Any ideas anyone ?
I have now tried the approach to use the "Ajax Standards mode Framework page".
How: First I changed the master rule collection in "Desktop&Display Rules" by adding a line
if user = myuser then <pcd path of the standards framework page>
When I saw it worked, I have removed it and set for every user.
As a fall back, in case some content would not like this, I have added the portal alias (attention it's not a quicklink!) portal/ajax to still point to the ajax based framework page.