Version 1 (modified by Jon Davis, 7 years ago) (diff)


  • Web Inspector turned 10 years old this year.
  • Evolution of the web inspector:
    1. Very basic, show DOM tree, floating HUD window. Limited: no debugger, couldn't show source, etc.
    2. Debugger in separate application. But still limited.
    3. Resources view.
    4. Integrated debugger into actual inspector.
    5. Introduced the timeline view into inspector.
    6. Current web inspector: Tab bar UI. Like this UI because it scales well to newer features/designs.
  • Debugger improvements:
    • Many changes are in Safari Technology Preview.
    • New global breakpoint for console.assert
    • When stopped on a breakpoint, highlight the expression that is about to execute.
    • Can also go up the call chain to see how we got to the top frame. Show caller with highlighting.
    • Can now set breakpoints on comments/empty lines and it will slide to next statement to execute.
    • (Questions on how default parameter values interact with the debugger.)
  • Splitting type profiler from code coverage profiler
    • Used to just be the type profiler to toggle both
    • Now we have individual buttons for each profiler
    • In Safari Technology Preview.
  • Heap map view:
    • Idea to highlight where time is spent.
  • Web Inspector Testing:
    • Test suite for writing async inspector tests.
    • New top-level uncaught exception view in engineering builds for inspector. Easily create bugzilla from call trace.
    • Wanting to be able to inspect layout tests.
    • UI testing for the inspector:
      • Need some isolation between tests and how the inspector is implemented.
      • Ideas: Every view in the inspector has a wrapper object. Must be able to simulate user interaction that isn't tied to the DOM layout.
      • Wrapper objects that wrap UI widgets. Allows for a simplified UI.
      • Clicks/typing will re-use ability added for web driver to simulate actions as if it was a user doing it.