Internet Explorer 11 Gets Enhanced Developer Tools In Windows 10 - A Technical Preview
With Windows 10 technical preview out and the actual OS coming out soon, speculations and rumours have been a constant surrounding the product. Putting an end to some of the speculations, IE development team yesterday in a #-Link-Snipped-# have said that the much talked about new browser 'Project Spartan' will be the default browser for Windows 10 and as far as IE is concerned, there will be an option present with the user to enable or disable it as per their requirement.
Besides all this, the IE developer team introduced the several updates they have put in the developer tools of IE 11. Following are the details of the same.
User Interface and Debugger
In the F12 tools, the icons of tools have been removed and have been replaced with tool names to eliminate confusion while using them. Besides that, now the developers can zoom in or out using the CTRL + + and CTRL + - as the keyboard shortcuts while the zoom level can be reset using CTRL + 0. In the debugger, with popular demand, there is now an option to add XHR breakpoints on the code wherever required directly from the Breakpoints pane. Once the breakpoint is reached, how the call stack looks at that moment of execution can be seen the call stack pane as shown below.
.jpg)
In the UI designing, one common problems that the designers face when they use LESS or SASS files is that the developer tools does not show those files directly, but instead displays the generated CSS file. This, however, won’t be a problem with IE11. The developers will be able to see the LESS or SASS file directly under the DOM Explorer Tool. The IE team said that it was possible to show the files directly because they took the path of the file from the sourcemap’s path present in the generated CSS file.
.jpg)
UI responsiveness and Network Inspector tools
The #-Link-Snipped-# and UI responsiveness have been brought together unlike IE’s previous versions. The Profiler tool is present under the UI responsiveness tab as ‘JavaScript call stacks’. Only the position and name of Profiler tool has been changed while the functionality remains the same.
.jpg)
If the developer wishes to find out the details like what CSS is applied to which element, they can right click on that element and select ‘Show in DOM Explorer’ to navigate to the element in DOM Explorer tool.
.jpg)
The Network Inspector has been updated and the IE developers have considered the requests of many developers and have provided features like auto-start capturing and content type filtering. The IE developers said that the other features that will be implemented in the future are response payload, timing information etc.
.jpg)
They have encouraged the developers to use the tool and inform them about the bugs and suggest new features that they wish to see in the F12 tools to make the process of development easier.
Source: #-Link-Snipped-#
Besides all this, the IE developer team introduced the several updates they have put in the developer tools of IE 11. Following are the details of the same.
User Interface and Debugger
In the F12 tools, the icons of tools have been removed and have been replaced with tool names to eliminate confusion while using them. Besides that, now the developers can zoom in or out using the CTRL + + and CTRL + - as the keyboard shortcuts while the zoom level can be reset using CTRL + 0. In the debugger, with popular demand, there is now an option to add XHR breakpoints on the code wherever required directly from the Breakpoints pane. Once the breakpoint is reached, how the call stack looks at that moment of execution can be seen the call stack pane as shown below.
In the UI designing, one common problems that the designers face when they use LESS or SASS files is that the developer tools does not show those files directly, but instead displays the generated CSS file. This, however, won’t be a problem with IE11. The developers will be able to see the LESS or SASS file directly under the DOM Explorer Tool. The IE team said that it was possible to show the files directly because they took the path of the file from the sourcemap’s path present in the generated CSS file.
UI responsiveness and Network Inspector tools
The #-Link-Snipped-# and UI responsiveness have been brought together unlike IE’s previous versions. The Profiler tool is present under the UI responsiveness tab as ‘JavaScript call stacks’. Only the position and name of Profiler tool has been changed while the functionality remains the same.
If the developer wishes to find out the details like what CSS is applied to which element, they can right click on that element and select ‘Show in DOM Explorer’ to navigate to the element in DOM Explorer tool.
The Network Inspector has been updated and the IE developers have considered the requests of many developers and have provided features like auto-start capturing and content type filtering. The IE developers said that the other features that will be implemented in the future are response payload, timing information etc.
They have encouraged the developers to use the tool and inform them about the bugs and suggest new features that they wish to see in the F12 tools to make the process of development easier.
Source: #-Link-Snipped-#
Replies
You are reading an archived discussion.
Related Posts
YouTube videos will now be streamed using the latest HTML5 technology instead of the age old 'Flash'. YouTube official Richard Leider wrote on the official blog post that given the...
After introducing the new variant of immensely popular Zenfone 5 last week, Asus has now unveiled another Zenfone series smartphone named Zenfone C ZC451CG. A variant of Zenfone 4, the...
Back in November 2014, Twitter officials presented their ideas about product improvements to Twitter in the months to come. While last year saw the arrival of the feature that lets...
Hello,
I am Graduate Mechanical Engg pass out from Mumbai Uni. And currently i am doing ME (Heat Power Engg) from Pune University.
What is the scope if i make...
Hi i am new to drupal and was installing it now in my system windows 7 64bit, its asking for creating database in 3 choices in the step2 of installation...