Google Developers Logo

Progressive Web App Road Show 2016

Stopping in New York, Chicago, Austin, Toronto, Mountain View and Seattle. Learn more and sign up now.

Remote Debugging

Check your site's responsive layouts and performance on real devices.

  1. Remote Debugging
  2. Remote Debugging Android Devices
  3. Access Local Servers
  4. Remote Debugging WebViews

Run snippets of code from any page

Snippets are small scripts that you can author and execute within the Sources panel of Chrome DevTools. You can access and run them from any page. When you run a snippet, it executes from the context of the currently open page.

  1. Run snippets of code from any page

Debug Obfuscated Code

Use server-side or build processes to automatically compress your code, then use Source Maps or DevTools' prettifier to debug it effectively.

  1. Debug Obfuscated Code
  2. Make JavaScript Look Pretty
  3. Map Preprocessed Code to Source Code

Debug Progressive Web Apps

Use the Application panel to inspect, modify, and debug web app manifests, service workers, and service worker caches.

  1. Debug Progressive Web Apps

Debug with Breakpoints

Chrome DevTools includes powerful breakpoint features that help you find and fix logic errors in your JavaScript code.

  1. Debug with Breakpoints
  2. How to set breakpoints
  3. How to step through your code

Understand security issues

Use the Security Panel to ensure that all resources on your site are protected with HTTPS.

  1. Understand security issues

Using the Console

The Chrome DevTools Console panel is your focal point for direct interaction with a page in real time.

  1. Using the Console
  2. Navigating the Console
  3. Diagnose and Log to Console
  4. Compare Similar Data Objects
  5. Measure and count executions
  6. Exception and Error Handling
  7. Console API Reference

Interact from Command Line

The console is a full-fledged terminal you can use to interact with your page during development.

  1. Interact from Command Line
  2. Evaluate Expressions
  3. Monitor Events
  4. Command Line API Reference

Watch variables in Sources

Chrome DevTools allows you to easily see multiple variables throughout your application.

  1. Watch variables in Sources

Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 3.0 License, and code samples are licensed under the Apache 2.0 License. For details, see our Terms of Service.