Hot Posts

6/recent/ticker-posts

Hints for inactive CSS properties

muslimofficials.blogsopt.com March 28, 2023

 Skip to content

What's New In DevTools (Chrome 108)

Published on 

Translated to: Español, Português, 한국어, 中文, Pусский, 日本語

Jecelyn Yeen
Jecelyn Yeen

Developer advocate working on Chrome DevTools at Google.

WebsiteTwitterGitHub

Interested in helping improve DevTools? Sign up to participate in Google User Research here.

#Hints for inactive CSS properties

DevTools now identifies CSS styles that are valid but have no visible effect. In the Styles pane, DevTools fades out the inactive properties. Hover over the icon next to it to understand why the rule has no visible effect.

Hints for inactive CSS properties.

Chromium issue: 1178508

#Auto-detect XPath and text selectors in the Recorder panel

The Recorder panel now supports XPath and text selectors. Start recording a user flow and the recorder automatically picks the XPath and shortest unique text of an element as selector if available.

XPath and text selectors in the Recorder panel.

Chromium issues: 1327206,1327209

#Step through comma-separated expressions

You can now step through comma-separated expressions during debugging. This improves the debuggability of minified code.

Step through comma-separated expressions.

Previously, DevTools only supported stepping through semicolon-separated expressions.

Given the code below,

function foo() {}

function bar() {
  foo();
  foo();
  return 42;
}

Transpilers and minifiers may turn them into comma-separated expressions.

function bar(){return foo(),foo(),42}

This creates confusion during debugging because the stepping behavior is different between minified and authored code. It is even more confusing when using source maps to debug the minified code in terms of the original code, as the developer is then looking at semicolons (which were under the hood turned into commas by the toolchain) but the debugger doesn't stop on them.

Chromium issue: 1370200

#Improved Ignore list setting

Go to Settings > Ignore List. DevTools improves the design to help you configure the rules to ignore a single script or pattern of scripts.

The Ignore List tab.

Chromium issue: 1356517

#Miscellaneous highlights

These are some noteworthy fixes in this release:

#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!

#Getting in touch with the Chrome DevTools team

Use the following options to discuss the new features and changes in the post, or anything else related to DevTools.

#What's New in DevTools

A list of everything that has been covered in the What's New In DevTools series.

#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

Updated on  • Improve article

muslimofficials.blogsopt.com

Posted by muslimofficials.blogsopt.com

Post a Comment

0 Comments

Post a Comment