Developer Tools in Internet Explorer 8 Beta 2


In March I wrote about the Developer Tools in Internet Explorer 8 Beta 1 and outlined three key benefits:

  • Integrated and simple-to-use
  • Provide a visual interface to the platform
  • Enable fast experimentation

Internet Explorer 8 Beta 2 brings the Developer Tools closer to realizing the full potential of these benefits with significant improvements to existing features and new functionality meant to make you more productive.

Profiling and Debugging JScript

Beta 1 introduced a JScript debugger that lets you easily debug Jscript within Internet Explorer. In Beta 2, we’ve made a few great improvements: it now supports console.log, just-in-time debugging, and has better usability through changes like an improved file chooser.

File Chooser in IE8 Developer Tools Debugger

However, the debugger only helps get your site working properly and you need to make sure your site works optimally. That’s why Beta 2 includes a built-in JScript profiler. Use it to build high-performance web applications in Internet Explorer by finding hotspots and comparing different design patterns. Simply press ‘Start Profiling’, perform you scenario, and press ‘Stop Profiling’ to view profile data for all JScript, including built-in methods.

JScript Profile Data in IE8 Developer Tools

Keep following the IEBlog for more details about these great features. You can also read our online documentation on script debugging and script profiling.

Working with HTML and CSS

While Beta 1 supported live editing of only HTML attributes, Beta 2 brings this functionality to all of HTML and CSS. With live editing of CSS, just click a property name, value, or selector, type a new value, and press ENTER.

IE8 Live CSS Editing

If you need to change HTML tag names, reorder, or add/remove elements, use full-text editing. Press ‘Edit’ in the toolbar of the HTML tab to make the full HTML editable. Press it again to commit your changes and return to tree view. This uses innerHTML so the same rules about running script apply as if you made the changes through JScript with innerHTML.

IE8 Full Text Editing

Changes made in the tools last only until the page refreshes or you navigate away. While this lightweight editing is helpful, it also makes it easy to lose changes. Beta 2 lets you save the current HTML and CSS to a text file so you have a reference when updating your source. The data in the tools comes from Internet Explorer rather than your source and thus might contain changes beyond edits you made with the tools so the default file format is txt to prevent accidental overwrites of the original source. A good way to identify just your changes is to save the HTML from the page before and after your changes and use a tool like windiff.

Testing Compatibility

The Developer Tools have two menus for compatibility: “Browser Mode” and “Document Mode”. “Browser Mode” lets you modify how IE behaves as well as how it reports its version to servers and web sites.  This lets you use IE8 to test what your site looks like in IE7 and what your site looks like for users in IE8 who pressed “Compatibility View”. “Browser Mode” affects the user agent string, version vector used when evaluating conditional comments, and the rendering mode.

“Document Mode” lets you test what your site would look like if you changed its rendering mode by using a different doctype or the meta tag.

You’ll also notice that the menus always display the current mode so the information’s available with zero clicks.

Simple to Use

From the start, we’ve worked to make the tools user-friendly. We made them part of every IE8 installation so you didn’t have to install anything extra, built per-instance script debugging so you don’t constantly find yourself in the ‘Advanced’ tab of Internet Options, and worked to reduce the clicks needed for common tasks. In Beta 2, we’ve made a few important changes that should make the tools even better.

If you’re like me, you love using the keyboard. Beta 2 adds extensive keyboard shortcuts for frequently-used functionality and uses common keyboard conventions so you become comfortable with the tools quickly. For example, F12 opens the tools, CTRL+E puts focus in the search box, and F3 and SHIFT+F3 cycle through results. Check out the full keyboard reference to learn all the shortcuts.

Besides some polish to make the tools prettier (even devs appreciate a nice design touch here and there), toolbars within the tabs make access to common tasks fast, and syntax-highlighting throughout the tools makes everything easier to read.

You can pin the Developer Tools to the Internet Explorer window as you could with the Internet Explorer Developer Toolbar, but Beta 2 also lets you minimize in window. With the tools pinned, press the ‘Minimize’ button or CTRL+M to reduce the tools to only the menu bar to save screen space while retaining access to the menus and Browser and Document Modes.

IE8 Developer Tools Pinned to the Internet Explorer Window

Internet Explorer Developer Toolbar Features

As promised, we’ve included all the features you’re familiar with from the Internet Explorer Developer Toolbar, including the ‘Attributes’ list view and ‘Resize window’ functionality.

More Information

Keep watching this blog for more about the JScript tools and check out these articles for more information:

John Hrvatin
Program Manager

edit: image resize; Console.log to console.log; search fox to search box

Comments (98)

  1. AdamC says:

    Great job John, just one question: how do I debug this:

    <div id="test"></div>

    t = document.getElementById("test");

    while(true)

    {

     t.innerHTML += "a";

    }

    It blocks the whole of IE, not just one tab. Everything becomes unresponsive.

    I thought IE8 was supposed to solve this problem?

    All tested browsers (Chrome, FF, Opera) deal with this better than IE8 beta 2.

    What am I missing?

  2. Eduardo Valencia says:

    Great guys,but remember! Add Download Manager,spellchecker to internet Explorer 8 !

  3. Rowan says:

    When you inspect a HTML element, why does the CSS pane display every single property of the element’s parents?

    For example, even if you have an innocent SPAN tag selected, the dev tools will show irrelevant properties from they BODY tag.

    It’s also inconsistent when trying to disable certain CSS properties, it seems that some can be disabled (padding) while others can’t (borders).

    And what about adding new properties like in the old dev toolbar?

    Thanks for posting this though.

  4. pavs says:

    ***Off-Topic***

    Just wanted t make an observation with IE8 and Google Chrome. The developers at Google chrome (3guys ?) has been successful in developing such an amazing browser in 2 years, that you guys have failed to achieve for so long.

    I think this is the beginning of the end for IE. I really wanted to help IE 8 team so I subscribed to this blog, downloaded both IE8 betas and tested them. The only reason I wanted to help IE team because previous versions have helped break the web for lack of Standard compliance; as a developer this is very important and frustrating for me. But after using IE8 beta 2 since it’s release, all I can say is that I am hugely disappointing. Bloated, broken, crashes randomly, takes minutes to load… I understand it’s a beta. But so is chrome, have you guys used it? Seriously, please take an hour of your preciously time, sit back and enjoy the browser, and compare it with IE8 beta2.

    I can’t crash Chrome, even if I wanted to…

    I think the only way IE8 will survive, is if it becomes open-source. You guys have already failed, in a major way. This is sad because, I was very attached to IE for the longest time.

    Why is IE always playing catch-up and not leading the browser market with innovations?

    Sorry for the off-topic, but I really badly want to know what you guys think about Chrome. Please, some developer from the team share your opinion about chrome.

    Thanks.

  5. @Pavs: Of course we’ve taken time to look at Chrome as well as the other browsers. If you’ve been a regular reader of the IEBlog, you know we don’t generally comment on the other browsers; most of our readers come here to learn about IE. I will say that we are happy to have more people who love browsing helping to bring good ideas to the table. Competition makes us all better and ultimately improves the internet for users.

  6. pavs says:

    Tony – Thanks for commenting. I understand that it is not appropriate to talk about other browsers in a IE developers blog. But I needed to know this; as for the longest time I had this weird feeling that the IE developers don’t use anything other than their own softwares, so they don’t know how badly IE stands compare to others.

    So it’s good to know that you use/compare IE to other browsers, even if it’s done privately, among your peers. Hopefully chrome will push you guys harder to build a better browser.

    Good luck to you and your team!

  7. erlando says:

    Generally the developer tools in IE8 is great.

    I have noticed one thing though. When using a javascript library (in this case prototype) the HTML view becomes useless because every attribute and function added by the library is being displayed.

    It would be great if there was an option to disable the display of non-HTML attributes on the elements.

    A bit of inspiration for this can be taken from Firebug. It keeps the html-view clean of non-HTML attributes.

  8. hks says:

    Notice a little quirk

    When compatibility mode is on, the user agent string sent is ‘Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 5.1; Trident/4.0; .NET CLR 1.1.4322; .NET CLR 2.0.50727; .NET CLR 3.0.04506.30)

    But the user agent sent during an ajax is ‘Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; .NET CLR 1.1.4322; .NET CLR 2.0.50727; .NET CLR 3.0.04506.30)’

    It’s still sending as MSIE 8.0

    Any way to override user agent strings sent by ajax?

  9. Lionel says:

    Is it possible to edit the tags under <head>?

  10. Mike says:

    @Pavs

    Only three guys worked on Chrome?

    That is truly impressive but it should be pointed out it based on webkit and so not quite three guys.

  11. nikhiljain says:

    chk this.

    Chrome Captures 1% Market Share In Just Nine Hours

    http://marketshare.hitslink.com/report.aspx?sample=21&qprid=43&qpcustom=Chrome+0.2

  12. pavs says:

    @Mike I just double checked – My mistake. There were four developers. (http://www.wired.com/techbiz/it/magazine/16-10/mf_chrome)

    Project started around 2 years ago June 2006. Webkit is the only part of chrome browser that’s not developed by the chrome team. Chrome is more than webkit. I am finding it really hard to go back to FF as my default browser.

  13. snark says:

    pavs, to crash chrome (not just the tab in question, making a mockery of the publicity materials), type

    about:crash%

    into the address bar

  14. Arieta says:

    Chrome = refurbished Webkit.

    If it took them 2 years to do a skin and seperate the tabs to processes, then Chrome is pretty sad.

  15. Stifu says:

    Arieta: it really doesn’t seem like you know what you’re talking about… You’re making it sound much more simple than it is.

    Are you a developer at all?

  16. pavs says:

    Arieta – obviously you don’t know what your are talking about. So no point arguing your claim.

    To go back on topic a little bit (sorry IE team); on it’s first try chrome debugger (developer tools) "almost" puts firebug to shame. This, coming from a heavy firebug user:

    http://farm4.static.flickr.com/3089/2827758630_311c67c93c_o.png

  17. JAB Creations says:

    I really appreciate all the improvements being made in IE8 though why is the JScript blog so quiet? Where can I read about DOM improvements in IE8 compared to IE7? I’m hardly a JavaScript guru though I’ve been getting much better over the past couple of years.

    Support for console.log is interesting.

    Also I wanted to thank you guys for adding border property support for checkboxes! I’ve been getting comfortable with MySQL the past couple of months and IE8B2 supporting :focus on a checkbox makes it so much easier to keep track of which element has focus! :-)

    Frankly I think Chrome severally failed on their release, I blogged about those important points on my site so if you disagree chat there instead please…still it’s nice to have two versions of WebKit available for testing (and makes it easier to test two different versions) just as we can now almost instantly test IE7 and IE8 with a click of a button!

    Also will you guys be blogging about the GUI any time soon? It’s still not customizable though I have noticed some *slight* improvements in the general direction. I was under the impression that the GUI was going to receive a lot of attention for Beta 2?

  18. In March I wrote about the Developer Tools in Internet Explorer 8 Beta 1 and outlined three key benefits

  19. Tim Hettler says:

    Adding the IE6 rending engine to a "developer" version of IE8 would be really amazing. I hope you guys consider doing this.

  20. KristoV says:

    Nice idea but it seems to be a copy of firebug, a webdeveloppement plugin for Firefox, no ?

    https://addons.mozilla.org/fr/firefox/addon/1843

    I hope yours work very well like the open-source one.

  21. @JAB Creations: Thanks for your interest in JScript blog. Details of JScript features in IE8 will roll out shortly both on the IE blog as well as the JScript blog.

  22. Web developer Tools included on IE8 are GREAT! I cannot beat IE will conquer its past users levels but including InPrivate, Tab Process Independence and this new Developer Tools will set new standards on the Web Browser Development… and it seems Google Chrome has implemented this new standards !!!

    Good work, keep doing it so well.

  23. Mitch 74 says:

    @KristoV: I’ll cite a previous IEblog post comment from a MSFT member: "we’ve definitely seen Firebug!".

    I won’t go as far as saying they started the photocopier on that one – if only because there aren’t 20 radically different ways to make a web page debugger – but that was to be expected, considering how many times the IE Developer toolbar team was asked to implement a Firebug equivalent.

    On a side note: Firebug 1.2 is out.

    IE 8 is shaping up to be not as outdated as IE7 was upon release – and for the first time since 1999, will actually innovate – but, frankly, DOM2 events support is getting ever more important.

    A small question about IE8’s development tools: will they be updated along with IE releases only, or can they be updated independently of the browser?

  24. Stifu says:

    Tim: I think it’d just add needless confusion and bloat to the program, not to mention IE6 needs to be completely wiped off the face of the web.

    If you are a web developer and want to check IE6 compatibility, just get IETester.

  25. Ed Burnette says:

    As a developer I understand the feeling that one’s ideas and code are better than everyone else’s. Hubris is almost a job requirement. But there comes a point where you have to look at the bigger picture.

    Would the IE team ever consider the idea of joining forces with one of the open source browser engine teams, for example WebKit, to produce a version of IE that used a common code base for its core functionality?

    Instantly that would remove a whole set of cross-platform compatibility problems that web developers in the trenches have to deal with. And think of the benefit to ordinary consumers who just want to see their favorite sites and conduct their everyday business!

    Given that:

    a) IE has had some great innovations like XMLHttpRequest that changed the web for the better,

    b) Browsers should be interchangeable commodities, uniformly fast, stable, and consistent, and

    c) Differentiating value, if desired, can be added to browsers outside of the core functionality,

    why not hook up with one of these other teams to achieve these goals cooperatively?

  26. Chris says:

    @Tim Hettler

    I think the IE 6 rendering engine is included.

    If you open the Developer Toolbar, and select "Document Mode", you should see "Quirks Mode", which is the IE 6 engine, is it not???

  27. Chrome and Firefox are certainly better at the UI used for remembering passwords. This is a long-time suggestion for Internet Explorer and the team had even said they’d consider it in their technical chats. Please implement the information-bar like UI for passwords instead of the current dialog box.

  28. please fix your typo says:

    That is "console.log" (all lower case) to match with Firebug and similar.

    until I saw the screenshot, I thought for a second you guys tried to re-invent the wheel.

  29. pd says:

    Congrats

    You’re getting closer to Firebug and the Webkit effort to clone Firebug.

    How about a console now?

    Please support the Firebug API like Webkit are doing:

    http://trac.webkit.org/changeset/35676

    http://getfirebug.com/console.html

    http://getfirebug.com/commandline.html

    Having to convert console.log() statements to alert() calls is just giving me yet another reason to still **hate** IE. Please do everyone a favour and implement this before IE8 RTM.

  30. rick says:

    http://www.surveyware.com/report.aspx?qprid=1&qpcustom=595&qps=1&qpcustomb=&qpnoauth=1&qpcustomc=99

    Firefox seems to be kicking IE (as does every other browser) in the "which browser is best" opinion poll.

    Glad to see the dev tools improving for IE.  Its no Firebug/Chrome debugger thats for sure, but it is coming along.

    I love the "same rules as JScript" comment about editing the DOM in real-time.  What a very nice way of saying… tons of stuff won’t work!

    Don’t bother trying to change the .innerHTML on TABLEs, THEADs, TFOOTs, TRs, SELECTs

    etc.

  31. Klimax says:

    To those praising chrome team for only two years of development completly forget that IE team had far more work then Chrome-team.

  32. mikefarinha1 says:

    Chris,

    Quirks mode is the bane of web development. Quirks mode isn’t IE 6 rendering engine. Quirks mode is something that is activated when a web developer creates a web page and doesn’t delcare which standard the browser should used (i.e. HTML4 XHTML1.1, etc.) so the browser tries to ‘guess’ how the page should be rendered. Each browser would guess differently since there was no baseline standard for ‘guessing.’

    !Mucho Problemos!

  33. ~ says:

    so is there another beta coming in november? or its time to RTM now?

  34. @~ says:

    It expected that RTW for IE8 will b drop on 1 Nov..!!

  35. @Rowan

    There are definitely still bugs in the style tracing that we’ll work out for RTW.  If you find specific issues, please file a bug.  Allison posted in July (http://blogs.msdn.com/ie/archive/2008/07/30/wanted-ie8-beta-testers.aspx) about how to join the beta.

    You can still add properties through the ‘Attributes’ pane.  You can also add an attribute to the selected node by pressing ‘+’ in the tree view.  

    John

  36. Stifu says:

    @Chris: IE6 and IE7 both have the same quirks mode (= IE5.5 mode), but IE8 doesn’t have the IE6 "strict" mode. In other words, IE8 can behave like IE5.5, IE7 and IE8, but not like IE6.

    @Klimax: so what? It’s not the amount of time spent on the browser that matters, it’s how good the browser is in the end. Ancient codebases are a pain rather than a blessing, and the fact IE is old isn’t an advantage.

    Besides, "2 years" also happens to be the time spent on IE after the 5-year break taken, as IE6 was supposed to be the last IE version. So Google started working on Chrome around the time the IE team finally resumed work on IE…

  37. fan says:

    Duplicate website could be added in favorite bar which is bad (IE 8 beta 2 rename the same website by adding numbers in the end of website title to differenciate)IE 8 should recognize the website was already added in favorite bar. If the site exist on favorites it should show a floating box to edit the website name, remove button and ability to organize. Just like FF3 bookmark and Google browser bookmark. User prefference to display icon or text only in favorite bar.

  38. @erlando

    Our priority has been to use the tools as a window into IE so we do little to nothing to clean up the tree view or any data we get back from IE as that might cause more confusion.

    Having options for hiding certain attributes or elements so devs can knowingly turn them off is a good suggestion though.

    thanks!

    John

  39. @JAB Creations

    What UI customization are you interested in?

    here are a few available in beta 2:

    – right-click the command bar and unlock the toolbars.  then use the grippers to drag around the favorites bar, command bar, and favorites button.  

    – right-click the command bar and choose customize to move the ‘stop’ and ‘refresh’ buttons to the left of the address bar.

    – resize the search box by dragging the separator between the address bar and the search box.

    John

  40. @hks

    we did work to address this type of issue.  do you have a repro site we can look at?

    thanks!

  41. are you for real? says:

    JohnHrv [MSFT]!!!

    If this is so, why the heck wasn’t this one of the first things posted on the Beta 2 release!

    We’ve been screaming about this loss of functionality since the first public beta of IE7!

  42. doh says:

    false hope.

    You can’t put any toolbars in that HUUUUGE blank spot to the right of the Menu.

    Good news is now you can actually have a full set of tabs on the tab bar.

  43. argh says:

    you can move some stuff, but it is still broken!

    I moved the command bar to the far left… but the menus (safety, tools), still open to the left!!!

    With the command bar in this better spot, you can’t drag any toolbars to be put AFTER this toolbar (e.g. on the right)

  44. still can't says:

    Still cant drag a bookmark into a bookmark folder to place in the right spot.

    You have to drag it over, and drop it.

    Then open the menu, find it near the begining, and drag towards the bottom.

    Fairly counter-intuitive.

  45. also noticed says:

    Zoom in any level on any page (e.g. about:tabs)

    Try to highlight/do anything.

    The page almost hangs trying to handle user-interaction…

    Zoom back to 100%, all is fine again.

    moral of the story? Zoom is still busted in IE8 (but worse than IE7)

  46. frank says:

    Woo Hoo! My RELOAD and STOP buttons are now in the CORRECT location!!! LEFT of the address bar!!! it only took 3+ years!  Way to innovate!

    Any chance this can get back-ported to IE7 so I can fix it too?

  47. tommas says:

    Rendering glitch below tab bar when restoring from a fullscreen view in XP.

  48. baker says:

    less memory usage for IE 8 i have Vista with 1.5gb memory.

  49. JC says:

    You guys and gals really, really need to get your act together with IE8. I’ve been a long time IE user, eschewing FireFox and I am really getting annoyed, tired, and impatient with your lack of getting-it-right each time a new version comes out. How many times are you going to screw up? Every time a new version comes out web designers have to spend COUNTLESS hours re-working code to accommodate your idiotic mistakes. GET IT RIGHT!!!!!!!!!!

  50. Sam Leibowitz says:

    Request for help: I downloaded IE8 Beta 2 and I have many problems. I would like to remove it and reinstall IE7. How can I do that? I am not an expert so please explain in detail.

    Thanks.  

  51. Morten says:

    This is a great improvement, but a thing I really don’t like about the new developer tool is the treeview display of the DOM. It shows way too much information. All I really want to see is the tag type and the ID (it if exists). The rest is already available in the property grid.

    The problem is that the style property is shown first, so it’s impossible to quickly identify a node by ID because you would have to scroll right to see it. I liked much better how this worked for the IE6+7 developer toolbar. Furthermore it’s really sluggish for large DOMs and I suspect all that redundant information is causing it (again the old tool was much faster).

  52. Nick says:

    @Morten I agree the ID could ideally come first, but I’d rather it reflect the TRUE DOM as it was served up. (e.g. If I set class first, that’s what I want to see first.

    Putting everything else in the grid is a bad idea.  It dis-associates the attributes from the nodes.

    Glad to see that the case is fixed though! that UPPER CASE garbage was very hard to read.

    nick

  53. Mr Hrvatin,

    I read carefully your post, tried these new developer tools and I must conclude for now that I disagree with almost everything you wrote.

    First of all, I went to your very own website and then press F12 just to shortly later (or immediately) crash. I tried again (with full reboot, clearing cache, closing all other apps) and got same result (both crash reports were sent): even the os showed clear signs of instability. And that’s not even what caused me to disagree with pretty much everything you posted.

    Ease of use, simple to use

    ————————–

    Difficulty of usage was never the main problem (not even a serious problem) with developer tools or web authoring tools from Microsoft. It’s quite the opposite actually. It is because people have been using, re-using, over-using and abusing tools like Front-Page, MS-Word Export HTML feature during the last 10 years that cause the web to be what it is today. A massive bunch of very poorly edited (bloated) webpages. Several billions of webpages. And none of the presented tools by your post helps in any way reverse the very poor quality of the code (markup, CSS) of these web pages. I have in the past presented alternatives, solutions, features, etc.. but I see none of them being implemented so far. Only the validation one… which is not very convenient as a feature in the interface: it won’t even validate with the CSS 2.1 profile (only 2.0) and it won’t work offline. No documentation on how to upgrade a document, how to understand the most frequently seen error messages on validation, no HTML Tidy, etc,etc,etc.

    In the past, there was a script debugger available for IE 6 and IE 7 and I used it:

    scd10en.exe 653KB

    and it had pretty much (although not as convenient) everything that the new dev. tools are offering today: breakpoints, stack, command window, etc. but the thing is that I knew what I was doing, I understood what I was doing. It seems the trend at Microsoft is to create more powerful, more easy-to-use tools for everyone that does not require the user to understand what he’s really doing.

    Compatibility

    ————-

    Compatibility with previous versions of IE never was considered a problem with IE. In fact, it’s the opposite. Over-excessive defense, care and protection for compatibility with IE-only previous versions becomes a real problem for the web. And your post proposes to "solve" this problem with a simple button. The real solution is not in a meta tag, in a button or triggering a new rendering mode, document mode, IE-only browser mode but into upgrading such documents to meet web standards, to be accessible, to be streamlined. None of your presentation and developer tools address that or meets such huge challenge.

    One quote from you:

    "the debugger only helps get your site working properly and you need to make sure your site works optimally. That’s why Beta 2 includes a built-in JScript profiler. Use it to build high-performance web applications in Internet Explorer"

    Wrong. The first thing to tackle to make a webpage work as efficient, as optimally, without a itch, without problems is to choose a doctype declaring a strict DTD, validate the markup code, separate the presentation from the structure, validate CSS code. It’s widely know that it’s useless to try to debug a webpage or to improve a webpage without first achieving those necessary steps. For hundreds of reasons. None of those tools help in such task.

    Most of the problems experienced by a large majority of webpages involves layout differences due to bugs, most of the time bugs in Internet Explorer. So, profiling Jscript and using a JS debugger won’t change any of that, wouldn’t do anything. And when I speak of IE bugs, you can include in there DOM bugs, DHTML bugs, incorrect implementations of DOM Core, DOM 1 & 2 HTML.

    Another major problem with the web today is over-excessive rigid, contrained and constraining page layout, pixel-perfect layout. Another one is the fantasy pursuit, the illusion that any/all browsers should render the same page layout despite obvious limitations, bugs, many bugs, shortcomings, flaws, incorrect implementations.

    Give your new tools an honest trial. Go to

    blogs.msdn.com/jeffdav/archive/2007/03/01/why-doesn-t-the-favicon-for-my-site-appear-in-ie7.aspx

    at load time, the debugger will report these obscur, vague, undefining error messages:

    Line: 317

    Error: Invalid argument.

    Line: 762

    Error: Object doesn’t support this property or method

    Now, go ahead and try to figure out with such developer tools what exactly is the problems with such webpage and what’s going on at lines 317 and 762. Real, concrete task, challenge. And the owner of that website used to be a Microsoft developer on top of that…

    Regards, Gérard

  54. hks says:

    @JohnHrv [MSFT]

    here’s a test page http://stormkeepers.org/testingua.php

    I’m using prototype.js for ajax stuff

    click the button to update the same page into the red box

  55. JAB Creations says:

    @JohnHrv [MSFT]

    This is what I mean by customizable GUI…

    http://img175.imageshack.us/img175/3019/ie8betterguier2.png

  56. mocax says:

    I think the navigation button, url and search boxes are located in a separate process from the tabs and favorites bars.

    So it’ll be hard to mix elements from different processes together.

    Maybe enable moving the elements in the nav bar horizontally. Personally, I like the back/forward and stop/reload buttons right between the url and search box.

  57. Anonymous says:

    "Wrong. The first thing to tackle to make a webpage work as efficient, as optimally, without a itch, without problems is to choose a doctype declaring a strict DTD, validate the markup code, separate the presentation from the structure, validate CSS code. It’s widely know that it’s useless to try to debug a webpage or to improve a webpage without first achieving those necessary steps. For hundreds of reasons. None of those tools help in such task."

    How does that contradict what he wrote at all?  If it still isn’t performant after that then the first thing you should do is profile the site to see where the problem is.  Just like in native application programming where you make sure your code is well-structured, makes proper use of OO (or functional programming or what-have-you), is clear, etc., etc., and then when it’s not performant you profile it and optimize the slow parts.

  58. Andy says:

    With news like this, I’d actually start getting excited for this browser…if we’d get a fix/workaround for the lack of css opacity for standards mode…

  59. David Martin says:

    Well I like them a lot.

    Would like to be able to view response headers as well.

  60. Mitch 74 says:

    @JABC: still a lot of wasted space:

    – main menu bar: right side, whole line lost (70% toolbar wastage)

    – buttons bar: between buttons and search box (50% line wastage).

    if only the search box or some buttons could be positioned alongside the menu bar… With screens getting wider and wider, it’s quite a waste.

    @Gérard: agreed – however, fulfilling your demand would essentially require MS to include HTMLtidy in IE, and/or (even better) take over the development of Amaya.

    It would be nice, though, to have a ‘super upper standard’ mode in IE (say, 9) that drops the MS proprietary event model for DOM2 events… and SVG and canvas support.

    Naah – that would make Silverlight useless.

  61. pavs:

    The debugger is exactly the one that comes in the WebKit package and so, probably not a Google-built thing. The point is that it was not easily available for Windows PCs and was very much restricted to MacOS users.

  62. Lucas says:

    Love the addition of Profiling in IE, my most wanted aspect from firefox for IE.

    I have noticed several requests for features so please forgive me adding on. Is their any chance of getting a way on the html tab to just open the entire tree structure? Selecting elements is good for looking a one item, but seeing the entire html structure takes a while to have to click on all the ‘+’ buttons.

  63. AngelOchoa says:

    Something has to be done with the suggestions in the address bar, it takes too long to show up in some cases.

  64. Lucas says:

    or the open the entire structure under a selected node

  65. Sameer[MSFT] says:

    @Lucas You can open the entire tree by pressing Shift + (Numpad *).  Works in the HTML Tab as well as the Profiler Call Tree view.

  66. Jana Vasseru says:

    Would you guys (MSFT and IE fans) mind facing a little bit of reality here?

    The IE6 share is roughly about 20-30%, the IE7 share is roughly about 30-40%. Ever wonder why only half of IE users uses the latest version? even when IE7 is priority update? Well perhaps they can’t upgrade – ever heard of an OS called windows 2000, window98 ? You really expect all those people to ditch milions of PCs and buy new ones so that they can run the new shiny windows Vista just to visit a website (maybe you are forgetting that there are not only home PCs, but also PCs in offices, schools, kiosks…)? And i’m talking only about the ‘objective’ reasons here – personally i think that whoever came with the idea that the ‘classic menu’ is below the toolbar must have been really drunk. For example in our company all have IE6 (actually, the default browser is FF anyway as it is much more reliable) since some PCs use w2k and people use different computeres at different times of day and they hate when suddelny they are presented with different UI just because they need to work with different machine. Anyway, let’s have some QA here. Don’t hesitate to correct me if i’am wrong:

    Q: Is IE7 going to be available for w2k, w98, etc.?

    A: Definitely not.

    Q: Is IE8 going to be available for w2k, w98, etc.?

    A: Definitely not.

    Q: Is IE7 going to be available for w2k, w98, etc.?

    A: Definitely not.

    Q: Are any of the IE7 rendering bugs, HTML + CSS specs violations going to be fixed?

    A: Probably not.

    Q: Are any of the IE6 rendering bugs, HTML + CSS specs violations going to be fixed?

    A: Definitely not.

    Q: When will IE8 be available ?

    A: No idea, but let’s be reasonable – it took you 5 years to come up with ie7, so 2010 or late 2009 seems realistic to me.

    Q: When will IE8 have 98% share of IE userbase ?

    A: Probably newer. By the time most of the w2k/w98 users upgrade to vista, there will be another version of IE (with another load of bugs i presume (don’t take this personally, every software has bugs)).

    Q: Will the getElementById function get fixed in IE8?

    A: maybe (yeah, i know it’s written on this blog that it is, but unless i see it in the final i won’t belive it. there are thousands of broken promises on MS blogs)

    Do you have any idea about this bugs? Are you going to fix them in IE6? Are you going to fix them in IE7? Well i guess the answer is very simple ‘no’ – so then can you tell me how can i create a page like this which does work in all other browser and IE6 and IE7 and IE8 and any other version of IE and other browser? And before you say it – no, X-UA-Compatible is not the anwser, since it’s broken in both IE6 and IE7, so i still have to do some sort of workaround here (god help me with that) and when i create the same page in 2012, i would still have to use the workaround since you don’t bother to fix older version and at the same time you do not allow users to upgrade because IE is so tied to the OS. So, again, what exactly are you trying to achieve IE8 – as i see it – if everything goes extremely well, we migt be able to ditch the most horrible IE workarounds somewhere in 2020?

    So until then i’m completely stuck with scd10en.exe which can’t even show linenumbers!

    Regards,

    Jana

  67. Anon says:

    Jana, I, personally,  believe that all those with older computers should upgrade. It would solve a lot of problems.

  68. @Jana,

    Fact: Firefox 3 is not available to Windows 98 users.

    Fact: Safari 3.x for Windows is not available to Windows 98 and Windows 2000 users.

    Fact: Konqueror 4.1 for Windows is not available for Windows 98.

    Even if all those browser versions were available for Windows 98 users and Windows 2000 users, I would certainly invite my friends to upgrade their os or to switch to an os which is still maintained with service packs, security fixes, bug fixes, has regular security updates.

    Will the getElementById function get fixed in IE8?

    Just see for yourself:

    connect.microsoft.com/IE/feedback/ViewFeedback.aspx?FeedbackID=333979

    And such getElementById bug involves a precise code context where name and id attribute values are using, are sharing the same value. Besides such precise code context, I am not aware of any other particular bugs affecting the working order of getElementById in IE 6 or IE 7. Using the same value for id and name gets reported as a warning when using HTML Tidy.

    You don’t like the UI in IE 7+? Deal with it otherwise proceed from it. It won’t change in IE 7. And maybe it’s too late for IE 8… really don’t know.

    Anyone with a PC with modest system resources can switch to Linux Ubuntu, Kubuntu or Xubuntu for free. If the PC system resources were sufficient for Windows 98, then they will have the sufficient system resources for a |K|Xubuntu operating system:

    http://www.whylinuxisbetter.net/items/environment/index.php?lang=

    Fact: Windows 98 and Windows 2000 users represent less than 3% (and declining) of the market today:

    http://www.w3counter.com/globalstats.php

    marketshare.hitslink.com/report.aspx?qprid=10

    "if everything goes extremely well, we migt be able to ditch the most horrible IE workarounds somewhere in 2020"

    Not if you make your webpage comply with basic WCAG guidelines, degrade gracefully, not if you avoid adopting pixel-perfect page layout goals and warn visitors that it is their responsibility to be using a W3C web-standards compliant browser.

    One last thing. This blog post from John Hrvatin was about the new developer tools.

    Regards, Gérard

  69. Jana Vasseru says:

    @anon

    @Gérard

    Saying that people should upgrade is exactly like saying that people shouldn’t produce so much waste.

    The fact the people are using FF2 or whatever different older browsers is not such problem since most of those are still beter with standards support then IE7 and are comparable to IE8.

    @Gěrard

    "And such getElementById bug involves a precise code context where name and id attribute values are using"

    -> And this "precise code context" is very likely to occure when your webapp gets a bit more complex with lots of dynamic (and user controlled) content and then it becomes real hell.

    " gets reported as a warning when using HTML Tidy"

    -> no it doesn’t, there is no reason it should be, it’s perfectly legal construct.

    "One last thing. This blog post from John Hrvatin was about the new developer tools."

    -> yes i know, i was talking about developer tools – i need developer tools for IE6 and IE7, cause that are the browsers which causes trouble. Developer tools for IE8 is a nice academic debate – since no one is using that browser.

    You might say this is shortsighted – but it is not -> look at the stats you sent

    http://www.w3counter.com/globalstats.php

    What is major browser today?

    IE6

    And IE7 is out almost 2 years. Yes, the work IE team has done here is awesome – but it actually doesn’t solve any real world problems – it’s bascially a very nice toy.

    Regards,

    Jana

  70. witgoed says:

    Well, i think this is great. I would see any functions like Total Commander.

    I can dream all night long of illusion functions possible on internet browsers.

  71. @Jana

    My point was that an user should not be using a software (browser, os, applications, whatever) which has no security updates anymore, no maintenance (bug fixes, patches, etc). Regardless of what are the reasons for not upgrading.

    When you mention upgrade in your post, you do not always distinguish what is not upgraded: software or hardware or both.

    Illegal versions of Windows may well be a reason for not upgrading to IE 7. Not everyone knows that IE 6 users can download and install IE 7 even if they have an illegal (piracy) os.

    FF2 is not a good example: after december 2008, it will not be  maintained with security and stability updates.

    > And this "precise code context" is very likely to occure when your webapp gets a bit more complex with lots of dynamic (and user controlled) content (…)

    "If set to ‘no’, any existing name attribute is removed if an id attribute exists or has been added."

    tidy.sourceforge.net/docs/quickref.html#anchor-as-name

    HTML Tidy is a very powerful, versatile tool, often unknown, often underestimated.

    One reason as to why people keep using IE 6 is that web authors want to support all the browsers and browser versions which the users are using, regardless of such browsers’ real and objective (HTML, CSS, DHTML) capabilities. And web authors want to support old, buggy browsers as well as better ones, more recent ones, improved ones …just because they are still in use. That is an error of judgment in my opinion; it’s definitely a circular logic which should be questioned. Once basic WCAG guidelines are met, once reasonable efforts to degrade gracefully have been done, it is up to a web author to invite diplomatically his visitors and to address his website visitors’ intelligence by inviting them to upgrade.

    Microsoft can be criticized for not maintaining its IE 6 browser during years and for not improving its support and compliance (correctness) of web standards; for not caring, not listening, etc.. But web authors are as much, if not more, guilty+responsible for over-coding (extra wrapping, <br>s), for over-declaring (classitis, divitis), creating bloated code full of markup and css errors, for using and relying on hacks of all sorts (mindlessly copied here and there) and using and relying on absolutely bad authoring tools.

    Microsoft can be criticized for its IE browser having lots of bugs… but web authors are more guilty+responsible for resorting/creating/relying/copying so called workarounds or "solutions" which in the end are more damaging then the bugs they were trying to avoid or "fix" in the first place. Incompetence is more grave, and usually more damaging than negligence, carelessness.

    After investigating the bugs in IE 6 and IE 7, I’d say that ~66% of the bugs in IE are harmless, minor and/or can be avoided elegantly and easily (as long as the web author has minimal HTML and CSS knowledge) and would not be detrimental to visitors. The remaining 33% is where things are surprisingly different: crash bugs, hang (cpu) bugs, dataloss, content missing, content moving (even duplicating!), poor or very bad support for properties like float, clear, abs. pos., rel. pos., overflow (which are decisive for CSS columnar webpage templates), inline box model, usability and accessibility bugs (like text not resizable, text not selectable, links not clickable), etc. Some of these bugs can be avoided just by checking the validation reports and validating the markup code and the CSS code (removing, correcting markup and css errors).

    We could discuss each and everyone of your point at length, you know.. but this isn’t the best forum.

    Regards, Gérard

  72. [l] The second beta version of IE8 was released on August 27th. It is working well in testing so far

  73. Kamal says:

    I like to have the Web Developer Toolbar open and docked all the time. I would also like it to remember if I minimized or resized it when I create a new tab or open a new session. Currently it does not do that. I hope this feature will be implemented in the future.

  74. Parce qu&#39;il n&#39;est pas possible d&#39;&#233;crire sur tous les sujets et que d&#39;autres le font

  75. Anton says:

    Before I begin, I’d like to warn you that I may go off on a bit of a tangent but here goes.

    First off, thank you for providing these developer tools for IE – they are much appreciated and I’m sure they will go a long way in making us pull less hair out as we try to make IE render the same as other browsers – this is the step forwards.

    That being said, with regards to standards compliance, the overall result has still been a step backwards in the productivity of developers. I think I speak for many people when I say that looking at this beta I almost wish that there wasn’t another iteration of IE in the pipeline because of this issue. At the company I work for, we do our best to support all versions from IE5.5 onwards – IE6 at worst because in that still holds its fair market share. The trouble is that IE6 and IE7 both render very differently and IE8 renders more differently still in both compatibility mode and standards mode.

    When the news arrived that IE8 would have different rendering modes, my understanding was that the idea would be to support older sites with a rendering mode similar to that of IE7 and allow the developers of current sites to use what they’ve had available to them for a long time in other browsers and invoke this standards rendering mode using a meta tag. Then the news came that it would render in standards mode by default (after the team changed its mind). This was more good news because it would force older sites to start moving over to standards.

    This has not been the result. An Acid3 test score of only 21/100 shows little promise and I’ve had frustrations while testing the latest beta out in both standards and compatibility modes. While Firefox (2 and 3), Opera and Google Chrome render my work in a very similar way, there is HUGE frustration in getting it to display correctly in all these versions of IE.

    I wish the team would spend a couple of extra months on approaching a score on Acid3 closer to 70 in standards mode. I understand that IE has much more responsibility to backwards compatibility than other browsers. If that’s the issue with moving forward then make compatibility mode the default rendering mode and go back to the meta tag for standards mode. But for god’s sake, don’t make our lives more difficult than they already are by releasing another browser that’s completely different in rendering to both its predecessors and its competitors. I assure you that adding the meta tag will be much less painful than having to literally hack CSS like we do now. 3 hours of CSS frustrations and some compromises vs. a 2 minute meta tag is a no-brainer.

    Also, please keep in mind that because of its market share and the propensity of its users not to upgrade, a half baked IE now will hold the web back for 5 years on, not just until you release the next version. Please, please, don’t release IE8 with its rendering as it is.

  76. General Top 10 Things That Annoy Programmers : Kevin Pang has an extremely accurate list of developers’ top annoyances. Handling Passwords : A great article for both the beginner and expert about securing passwords. SQL Server 2008 – Introduction To The

  77. Mikro says:

    recently jscript errors stated popping up on every site I visit already posted in feedback IE 8 b2 has flipped out on me

  78. IEBlog says:

    We’ve been sharing plenty about the work we’ve done in Internet Explorer 8 Beta 2 for browser users;

  79. Matt says:

    As others have pointed out, most of the ideas for the developers tools are obviously borrowed from Firebug, which is fine.  But you don’t even have the common courtesy to mention it in the blog post or link to it?

  80. I think that everyone already has chosen tools to develop Web pages. The proposal, which offers Microsoft is interesting. I think that should be tried.

  81. hks says:

    It appears that most of js errors on many sites I encountered are caused by IE8 blocking google analytics or similar cross site js.

    I dunno if it’s a good or bad thing 😛

  82. IEBlog says:

    One of the key themes for IE8 is developer productivity. IE8 Beta 1 improved developer productivity through

  83. Phylyp says:

    I’m just curious as to why you didn’t consider hosting the IE developer tools in the Visual Studio Shell.

    Granted that the shell would be a separate download about 10 times larger than IE itself but it would give developers a familiar IDE.

  84. IEBlog says:

    Hello! I am Sameer Chabungbam, one of the Program Managers on the JScript Team. The recently released

  85. The recently released Beta 2 of Internet Explorer 8 contains a lot of improvements which are aimed at

  86. As you probably heard, IE8 introduces the Developer Tools. Lots of great features like live HTML and

  87. JScript Blog says:

    In Internet Explorer 8 Beta 2 JScript team has focused on improving developer productivity. You can read

  88. It has been a while since I blogged here (this is an understatement!). Internet Explorer 8 Beta 2 has

  89. IEBlog says:

    Hi, my name is Jatinder Mann and I work on the Internet Explorer Administration Kit (IEAK) and Group

  90. Одним из ключевых направлений развития IE8 является увеличение производительности труда разработчиков.

  91. 真见 says:

    微软宣布InternetExplorer8释放中国-中文简体ForWindowsServer2003http://go.microsoft.com/fwlink/?Lin

  92. Microsoft released the final version of IE8 last week (3.19.2009); your users will soon be automatically upgraded unless auto-updates have been explicitly blocked. Are you ready?…

  93. JScript Blog says:

    During Beta1 and Beta2 pre-releases of IE8, we’ve blogged about the performance optimizations done in

  94. IEBlog says:

    During Beta1 and Beta2 pre-releases of IE8, we’ve blogged about the performance optimizations done in

  95. Myshuiyue says:

    微软宣布InternetExplorer8.0释放中国-中文简体ForWindowsServer2003http://go.microsoft.com/fwlink/?Link