Third-party cookie phaseout
Your site may use third-party cookies and it's time to take action as we approach their deprecation. To learn what to do about affected cookies, see
Preparing for the end of third-party cookies
.
The
Include third-party cookie issues
checkbox has been enabled by default for all Chrome users, so the
Issues
tab now warns you about the cookies that will be affected by the upcoming deprecation and phaseout of third-party cookies. You can clear the checkbox at any time to stop seeing these issues.
Chromium issue:
1466310
.
The
Privacy Sandbox Analysis Tool
extension for DevTools is under active development with the latest pre-release
version of 0.3.2
. The tool lets you understand how your website uses cookies and provides guidance on the new privacy-preserving Chrome APIs.
To analyze your cookies:
- Install the extension
in Chrome.
- Open your website in a single tab for best analysis.
- Open DevTools
and navigate to the
Privacy Sandbox
panel. This panel might be hidden behind the
drop-down button at the top.
- Open the
Cookies
section and click
Analyze this tab
. If the tool didn't find any cookies, try reloading the page.
For more information on how to use the
Privacy Sandbox Analysis Tool (PSAT)
, see the following:
Moreover, see guidance on
Reporting issues
.
Enhanced ignore listing
Default exclusion pattern for
node_modules
This version enables the default regular expression as a custom exclusion rule in
Settings
>
Ignore List
. To help you focus on only your code, the
Debugger
will now skip scripts from
/node_modules/
and
/bower_components/
by default. You can disable this rule in settings at any time.
Chromium issue:
1496301
.
Exceptions now stop execution if caught or passing through non-ignored code
When you debug code with
Pause on caught exceptions
checked, the
Debugger
now stops the execution on the following caught exceptions, both synchronous and asynchronous:
- Exceptions caught in non-ignored frames in the call stack.
- Caught exceptions that pass through non-ignored frames in the call stack. For example, see the screenshot.
To test this behavior, open
this demo page
:
- Open DevTools >
Sources
, add the
hidden
folder to the ignore list
, and check
Pause on caught exceptions
.
- On the page, under the "Caught" list of scenarios, click the different buttons and see the execution paused in the mentioned cases.
To pause execution on caught and/or uncaught exceptions (when checked) in asynchronous calls, the
Debugger
looks for rejection handlers across promises. Starting with this version, the
Debugger
no longer predicts that
Promise.finally()
will catch an exception, similar to how the
try...finally
block doesn't catch any.
Chromium issues:
1489312
,
1291064
.
x_google_ignoreList
renamed to
ignoreList
in source maps
The
source maps specification
has
adopted
the
ignoreList
field instead of
x_google_ignoreList
and DevTools now supports the new name with a fallback for the old one. Frameworks and bundlers can now use the new field name.
Source maps let you debug the code you wrote rather than minified code served by your website.
For more information on source maps, see:
You can now toggle between touch and mouse input when debugging a Chrome tab remotely. For example, when you run a Chrome instance with the
--remote-debugging-port=<port>
and connect to this network target via
chrome://inspect/#devices
.
Watch the video to see input mode toggling in action.
Chromium issue:
1410433
.
The Elements panel now shows URLs for
#document
nodes
To let you debug iframes easier, the
Elements
panel now displays
documentURL
next to
#document
nodes.
Chromium issue:
1376976
.
Effective Content Security Policy in the Application panel
You can now view the
Content Security Policy (CSP)
details of an inspected frame. To view the details, navigate to
Application
>
Frames
, select a frame and scroll down to the
Content Security Policy (CSP)
section.
Chromium issue:
1424714
.
Improved animation debugging
In the
Animations
tab, you can now:
- Click anywhere on the timeline header to set the playhead. The animation continues to play if it was already playing and stops otherwise. Previously, you had to drag it.
- Resize the name column to see the full animation names.
Chromium issues:
1492460
,
1489721
.
'Do you trust this code?' dialog in Sources and self-XSS warning in Console
The
Show warning about Self-XSS when pasting code
experiment
has been enabled by default. Self-XSS (self cross-site scripting) is an attack that tricks you into pasting malicious code into DevTools and lets an attacker gain control of your web accounts and personal information.
If you are a new DevTools user and you attempt to paste code, the
Sources
panel now shows you the
Do you trust this code?
dialog and the
Console
now displays a similar warning. Paste only the code that you understand and have reviewed yourself. To paste, type
allow pasting
when prompted. Once pasting has been allowed once, the warning will never be shown again.
Chromium issue:
345205
.
Event listener breakpoints in web workers and worklets
When you set an event breakpoint in
Sources
>
Event Listener Breakpoints
, in addition to pausing on this event on your website, the
Debugger
now also pauses when the corresponding event happens in a
web worker
or
worklet
of any type, including the
Shared Storage Worklet
.
Chromium issue:
1445175
.
You can now enable the new media badge for
<audio>
and
<video>
elements in the
Elements
panel. When you click the badge, it takes you to the
Media
panel
, so you can debug these elements.
This feature is under development and will be further improved. The DevTools team would like to express gratitude to
Junseo (Jeremy) Yoo
for landing this improvement.
Chromium issue:
1448214
.
Preloading renamed to Speculative loading
To avoid overusing the previous term and better reflect the behavior,
Application
>
Preloading
has been renamed into
Speculative loads
.
Speculative loading
allows a
near-instant page load
based on speculation rules that
you can define
for your website to prerender and prefetch most navigated-to pages.
Chromium issue:
1478888
.
Lighthouse 11.2.0
The
Lighthouse
panel now runs Lighthouse 11.2.0. See the
full list of changes
.
This update includes an overhaul to the performance category. Performance insights are now scored and prioritized based on their estimated impact to the performance metrics. Additionally, the performance score gauge includes more detailed information about how each metric affects the score.
To learn the basics of using the
Lighthouse
panel in DevTools, see
Lighthouse: Optimize website speed
.
Chromium issues:
772558
.
Accessibility improvements
This version has the following accessibility improvements:
- Screen readers will now announce the status (checked or unchecked) of checkboxes under
Sources
>
Breakpoints
.
- You can now access the
Hide issues like this
drop-down menu with the keyboard.
Chromium issues:
1488645
,
1484918
.
Miscellaneous highlights
These are some noteworthy fixes and improvements in this release:
- Performance
: Fixed the sometimes missing LCP indicator in the recording (
1487136
).
- Speculative loads: Fixed the full URLs for targets in the drop-down menu in the
Network
panel (
1471020
).
- Coverage
:
- Fixed line-by-line coverage for pretty-printed code (
1464974
).
- The coverage information now updated on page reload (
1494457
).
- Console
:
- Fixed partial text selection in messages (
1487449
).
- Fixed the flickering of autocomplete drop-down (
1487453
).
- Supported parentheses in stack paths and URLs in stack traces (
1473926
).
- Sources
: Supported the syntax highlighting of the TypeScript
using
keyword (
1490515
).
- Quick Open
menu now shows private methods (
1492957
).
- Application
>
Background services
: The top action bar now wraps text when resizing (
1487276
).
- Elements
>
Styles
:
- Fixed the resolution of the inherited CSS variables for slotted elements (
1492162
).
- When disabling a CSS property, its comments are now stripped to fix syntax breaks (
1101224
).
- Network
: The
Priority
column now shows a tooltip with information on initial priority (the same is shown when
Big request rows
is checked) (
1495735
).
- Deprecations:
- The
Color format
setting has been disabled in previous versions and is now removed.
- The Delete all overrides option in
Sources
is now removed due to low usage after the
streamlining of overrides
(
1473681
).
Download the preview channels
Consider using the Chrome
Canary
,
Dev
or
Beta
as your default development browser. These preview channels give you access to the latest DevTools features, test cutting-edge web platform APIs, and find issues on your site before your users do!
Use the following options to discuss the new features and changes in the post, or anything else related to DevTools.
- Submit a suggestion or feedback to us via
crbug.com
.
- Report a DevTools issue using the
More options
>
Help
>
Report a DevTools issues
in DevTools.
- Tweet at
@ChromeDevTools
.
- Leave comments on our What's new in DevTools
YouTube videos
or DevTools Tips
YouTube videos
.
What's new in DevTools
A list of everything that has been covered in the
What's new in DevTools
series.
Chrome 125
Chrome 124
Chrome 123
Chrome 122
Chrome 121
Chrome 120
Chrome 119
Chrome 118
Chrome 117
Chrome 116
Chrome 115
Chrome 114
Chrome 113
Chrome 112
Chrome 111
Chrome 110
Chrome 109
Chrome 108
Chrome 107
Chrome 106
Chrome 105
Chrome 104
Chrome 103
Chrome 102
Chrome 101
Chrome 100
Chrome 99
Chrome 98
Chrome 97
Chrome 96
Chrome 95
Chrome 94
Chrome 93
Chrome 92
Chrome 91
Chrome 90
Chrome 89
Chrome 88
Chrome 87
Chrome 86
Chrome 85
Chrome 84
Chrome 83
Chrome 82
Chrome 82 was cancelled
.
Chrome 81
Chrome 80
Chrome 79
Chrome 78
Chrome 77
Chrome 76
Chrome 75
Chrome 74
Chrome 73
Chrome 72
Chrome 71
Chrome 70
Chrome 68
Chrome 67
Chrome 66
Chrome 65
Chrome 64
Chrome 63
Chrome 62
Chrome 61
Chrome 60
Chrome 59