What’s new in DevTools: Chrome 121-123
Channel: Chrome for Developers
Date: 2024-03-20

Let’s dive into what’s new in DevTools for Chrome 121-123. Learn how to debug disappearing elements, navigate performance with breadcrumbs and more!

Chapters:
0:00 Intro
0:14 Emulate a focused page in Styles tab
1:23 Performance: Breadcrumbs in timeline
2:10 Performance: Enhanced Interactions track to debug INP
3:00 Performance: Event initiators in Main track
3:39 New shortcut to set logpoint
4:02 Option to toggle all breakpoints
4:16 Default indentation markers in Editor
4:28 Enhanced source maps to debug source variables
5:19 Bonus tip: Copy URL as Node.js script and more

Resources:
Interaction to Next Paint → https://goo.gle/3tFrvUe  
Chrome 121 → https://goo.gle/495vX0z 
Chrome 122 → https://goo.gle/3PqtruQ 
Chrome 123 → https://goo.gle/43tyQ9Z  

Questions? Tweet to us:
Jecelyn Yeen →  https://goo.gle/jecfish   
Chrome DevTools →  https://goo.gle/chromedevtools   

Watch more What's New in DevTools → https://goo.gle/NewInDevTools  
Subscribe to Chrome for Developers → https://goo.gle/ChromeDevs  

#DevTools #ChromeForDevelopers #Chrome



Speaker: Jecelyn Yeen
Products Mentioned: Chrome