How to bring back "Browser mode" in IE11?

cross-browser ie-developer-tools internet-explorer-11

UPDATE: The old question applies only to IE11 preview; browser mode had returned in final release of IE11. But there is a catch: it is next to useless, because it does not emulate conditional comments. For example, if you use them to enable HTML5 support in legacy IEs, you will no longer be able to debug your site in IE11.

        <!--[if lte IE 8]>
            <script src="html5shiv.js"></script>
        <![endif]-->

Read another StackOverflow question and IE bug tracker issue. Microsoft never responded to this, so it looks like they introduced this bug on purpose to steer people into buying BrowserStack subscriptions. Conditional comment emulation worked just fine in preview release.

https://i.stack.imgur.com/lLJs0.png

https://i.stack.imgur.com/28nFB.png

The only way to bring it back is to uninstall IE11 and reinstall it.

Is there easier way to switch between browser modes in IE11?

This seems like a great question for an MS specific forum (or possibly a bug report!)

@Mathletics - it's not a bug, it's quite deliberate.

How the hell have you managed to get the first screen ? Why i press F12 the SECOND SCREEN comes up.

@Panique - it just was there when I first installed IE11. Probably it is because I always have F12 tool present in IE10, so it somehow migrated this setting. Then I can use F12 key to show and hide it. JUST DON'T GO TO TOOLS MENU. If you want to bring it back, uninstall IE11 update first. Works for me.

Post from Sitepoint.com: IE11: Browser modes return (in Windows 8.1).

Mark Amery

[UPDATE]

The original question, and the answer below applied specifically to the IE11 preview releases.

The final release version of IE11 does in fact provide the ability to switch browser modes from the Emulation tab in the dev tools:

https://i.stack.imgur.com/KJAum.png

Having said that, the advice I've given here (and elsewhere) to avoid using compatibility modes for testing is still valid: If you want to test your site for compatibility with older IE versions, you should always do your testing in a real copy of those IE version.

However, this does mean that the registry hack described in @EugeneXa's answer to bring back the old dev tools is no longer necessary, since the new dev tools do now have the feature he was missing.

[ORIGINAL ANSWER]

The IE devs have deliberately deprecated the ability to switch browser mode.

There are not many reasons why people would be switching modes in the dev tools, but one of the main reasons is because they want to test their site in old IE versions. Unfortunately, the various compatibility modes that IE supplies have never really been fully compatible with old versions of IE, and testing using compat mode is simply not a good enough substitute for testing in real copies of IE8, IE9, etc.

The IE devs have recognised this and are deliberately making it harder for devs to make this mistake.

The best practice is to use real copies of each IE version to test your site instead.

The various compatiblity modes are still available inside IE11, but can only be accessed if a site explicitly states that it wants to run in compat mode. You would do this by including an X-UA-Compatible header on your page.

And the Document Mode drop-box is still available, but will only ever offer the options of "Edge" (that is, the best mode available to the current IE version, so IE11 mode in IE11) or the mode that the page is running in.

So if you go to a page that is loaded in compat mode, you will have the option to switch between the specific compat mode that the page was loaded in or IE11 "Edge" mode.

And if you go to a page that loads in IE11 mode, then you will only be offered the 'edge' mode and nothing else.

This means that it does still allow you to test how a compat mode page reacts to being updated to work in Edge mode, which is about the only really legitimate use-case for the document mode drop-box anyway.

The IE11 Document Mode drop box has an i icon next to it which takes you to the modern.ie website. The point of this is to encourage you to download the VMs that MS are supplying for us to test our sites using real copies of each version of IE. This will give you a much more accurate testing experience, and is strongly enouraged as a much better practice than testing by switching the mode in dev tools.

Hope that explains things a bit for you.

While testing using the free VMs provided by MS is absolutely better it is also more time-consuming. I have to fire up the VM, I have to switch between several different VMs and I have to reinstall the little buggers every time the activation timer runs out as they didn't provide any activation keys. Still, I guess we should be thankful they actually took the trouble of setting these VMs up. You could catch a lot of gotchas with the old F12 compat modes and then verify once using the VMs. But I digress.

I understand why they think it's a good idea to deprecate the Compatibility mode dropdown, but I think it is also a slap in the face to any dev who actually spends time making sure their site works in IE. As others have mentioned, checking for obvious bugs using the compatibility checker worked well. Plus you had the advantage of a halfway decent set of dev tools (compared to the garbage that was the tools in IE7 and even 8.) I make a practice of checking in the VMs also, any good dev would. But this change is just going to mean less devs care about getting things working in old IE.

As an aside, I should not have to load up a full OS in a VM to test a stupid browser. If Microsoft really wanted devs to make sure their stuff works in older versions of IE, they should provide a better FREE option for doing so. Otherwise, it sure seems like they are encouraging devs to just ignore the old versions and only worry about working around the bugs in the newer versions.

Nope...BrowserStack isn't free, VMs are a pain in the butt to use (don't tell me otherwise, I have them all setup, and have to reset them every 3 months, etc...they are a pain). I know all about Modern.ie and Microsoft's offerings. Microsoft is taking away a simple, free method that worked for about 90% of the things most devs need to test, and replacing it with cludgy VMs or pay services. Color me not impressed. And I am one of the Microsoft supporters, work primarily in a .NET shop. And I think this is DUMB.

I see this as: "We screwed up, and we gave you the wrong tools to deal with our mistakes, so now we're going to point you toward tools that give us money."

Evgeny

While using virtual machines is the best way of testing old IEs, it is possible to bring back old-fashioned F12 tools by editing registry as IE11 overwrites this value when new F12 tool is activated.

https://i.stack.imgur.com/jEcE4.png

This works for me (save as .reg file and run):

Windows Registry Editor Version 5.00

[HKEY_CURRENT_USER\Software\Microsoft\Internet Explorer\Toolbar\WebBrowser]
"ITBar7Layout"=hex:13,00,00,00,00,00,00,00,00,00,00,00,30,00,00,00,10,00,00,00,\
  15,00,00,00,01,00,00,00,00,07,00,00,5e,01,00,00,00,00,00,00,00,00,00,00,00,\
  00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,\
  00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,\
  00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,\
  00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,\
  00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,\
  00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,\
  00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,\
  00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,\
  00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,\
  00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,\
  00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,\
  00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,\
  00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,\
  00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,\
  00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,\
  00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,\
  00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,\
  00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,\
  00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,\
  00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,00,\
  00,00,00,69,e3,6f,1a,8c,f2,d9,4a,a3,e6,2b,cb,50,80,7c,f1

I don't know whether to be impressed that someone managed to find a way to hack IE11 to get the old dev tools back, or depressed that they were willing to sacrifice all the amazing new stuff in the IE11 dev tools just for the sake of being able to switch the browser mode. :-(

That has everything to do with Microsoft's legacy of producing non-W3C standard compliant browsers. There is nothing wrong with IE10 or 11 - they are fine modern browser. It's all about 9 and 8 and, until recently 7 and 6. Since it is impossible to install them alongside modern IE in, Windows 8, good emulation tool is needed.

The trick here is interesting, but obviously not supported by Microsoft and could have side-effect that are unintended.

I don't think this is pointless at all. My workflow when testing IE is to first use the F12 compat mode and flesh out any problems I find and THEN I go through the trouble of firing up a VM. This is a lot more efficient than doing all IE testing in (different) VM(s).

To make this reg hack work for me I also had to update the ITBar7Layout64 value. It worked then, however closing and opening F12 tools crashed IE :) Good thing I made a backup of the reg key.

Rajnikanth

You can get this using Emulation (Ctrl + 8) Document mode (10,9,8,7,5), Browser Profile (Desktop, Windows Phone)

https://i.stack.imgur.com/N8xxo.png

Thank you for sharing where to find that, I was stumped! :)

Ray Cheng

Easiest way, especially if in MSDN,,wasted hours of my time, stupid MS

http://support.microsoft.com/kb/2900662/en-us?sd=rss

Open the Developer Tools pane. To do this, press F12. Open the Emulation screen. To do this, press Ctrl+8. On the Document mode list under Mode, click 9. On the User agent string list under Mode, click Internet Explorer 9.

Just a courteous FYI, try to include the details of the resolution, rather than simply providing a link. If the link ever goes down, then the answer is useless to a person in the future. The link is helpful, but keep it as a linked reference to the information you include in your detailed answer.

mendezcode

You can work around this by setting the X-UA-Compatible meta header for the specific version of IE you are debugging with. This will change the Browser Mode to the version you specify in the header.

For example:

<meta http-equiv="X-UA-Compatible" content="IE=9" />

In order for the Browser Mode to update on the Developer Tools, you must close [the Developer Tools] and reopen again. This will switch to that specific version.

Switching from a minor version to a greater version will work just fine by refreshing, but if you want to switch back from a greater version to a minor version, such as from 9 to 7, you would need to open a new tab and load the page again.

Here's a screenshot:

https://i.stack.imgur.com/nmCwv.png

Lingaraj R M

https://i.stack.imgur.com/jehdu.jpg

That just changes the user agent string; it doesn't change how the browser behaves. It's completely useless for compatibility testing.

pedram

How to bring back “Browser mode” in IE11?

Easy way to bring back is just go to Emulation (ctrl +8)

and do change user agent string. (see attached image)

https://i.stack.imgur.com/cbHRn.png

That just changes the user agent string; it doesn't change how the browser behaves. It's completely useless for compatibility testing. Also, your example is using X-UA-Compatible.

Zenexer

Microsoft has a tool just for this purpose: Microsoft Expression Web. There's a free version with a bunch of FrontPage/Dreamweaver-like garbage that nobody wants. What's important is that it has a great browser testing feature. I'm running Windows 8.1 Pro (final release, not preview) with Internet Explorer 11. I get these local browsers:

Internet Explorer 6

Internet Explorer 7

Internet Explorer 11 /!\ Unsupported Version (can't use it; big whoop, I have the browser)

Then I get a Remote Browsers (Beta) option. I'm supposed to sign up with a valid e-mail, but there's an error communicating with the server. Oh well.

Firefox used to be supported, but I don't see it now. Might be hiding.

I can compare side-by-side between browser versions. I can also compare with an image, or apparently, a PSD file (no idea how well that works). InDesign would be nice, but that's probably asking for too much.

I have the full version of Expression partially installed as well due to Visual Studio Ultimate being on the same computer, so I'd appreciate someone confirming in a comment that my free installation isn't automatically upgrading.

Update: Looks like the online service was discontinued, but local browsers are still supported. You can also download just SuperPreview, without the editor garbage. If you want the full IDE, the latest version is Microsoft Expression Web 4 (Free Version). Here's the official list of supported browsers. IE6 seems to give an error on Windows 8.1, but IE7 works.

Update 2014-12-09: Microsoft has pretty much given up on this. Don't expect it to work well.

Last time I looked Expression Web / Super Preview only provide static snapshots of a page in various browers. Whilst this is what pixel-perfect web designers want, its not what devs want - we want to interact with pages, debug js and CSS and manipulate the DOM, and that's where the IE developer tools come in.

@saille I don't have it in front of me at the moment, but I'm pretty sure it's interactive.

How to bring back "Browser mode" in IE11?

Follow WeChat

Want to stay one step ahead of the latest teleworks?

相似问题

Platform

Support

Links

Contact US