Cookie Consent by Free Privacy Policy Generator ๐Ÿ“Œ What's New in DevTools (Chrome 111)

๐Ÿ  Team IT Security News

TSecurity.de ist eine Online-Plattform, die sich auf die Bereitstellung von Informationen,alle 15 Minuten neuste Nachrichten, Bildungsressourcen und Dienstleistungen rund um das Thema IT-Sicherheit spezialisiert hat.
Ob es sich um aktuelle Nachrichten, Fachartikel, Blogbeitrรคge, Webinare, Tutorials, oder Tipps & Tricks handelt, TSecurity.de bietet seinen Nutzern einen umfassenden รœberblick รผber die wichtigsten Aspekte der IT-Sicherheit in einer sich stรคndig verรคndernden digitalen Welt.

16.12.2023 - TIP: Wer den Cookie Consent Banner akzeptiert, kann z.B. von Englisch nach Deutsch รผbersetzen, erst Englisch auswรคhlen dann wieder Deutsch!

Google Android Playstore Download Button fรผr Team IT Security



๐Ÿ“š What's New in DevTools (Chrome 111)


๐Ÿ’ก Newskategorie: Programmierung
๐Ÿ”— Quelle: developer.chrome.com

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

No video for this release.

Debugging HD color with the Styles pane

New CSS color types and spaces are coming to the web! It is equally exciting that DevTools introduced new tools to help developers create, convert and debug High Definition color.

The Styles pane now supports 12 new color spaces and 7 new gamuts as outlined in the CSS Color Level 4 specification. See High Definition CSS Color Guide for a comprehensive understanding of color options available on the web.

Here are examples of CSS color definitions with color(), lch(), oklab() and color-mix(). Examples of CSS color definitions.

When using the color-mix() function, you can view the final color output in the Computed pane. color-mix result in the Computed pane.

The color picker supports all the new color spaces with more features. For example, click on the color swatch of color(display-03 1 0 1). A gamut boundary line has also been added, distinguishing between the sRGB and display-p3 gamuts for a clearer understanding of your selected color's gamut. A gamut boundary line.

DevTools supports converting colors between color formats. Use the Change Color Format icon to access the conversion popup, or simply use the Shift + click on a color swatch in the Styles pane. Converting colors between color formats.

When converting, it's important to know if the conversion was clipped to fit the space. DevTools puts a warning icon next to the converted color that alerts you to this clipping. Warning of color clipping.

In addition, you can pick colors from your screen with the new shortcut. Press 'C' to activate the eye dropper and hit Escape to deactivate it. Activate the eye dropper.

Finally, the Color format setting is now deprecated to make room for the new HD color format. Color format setting deprecation.

Chromium issues: 1073895, 1395782, 1408777, 1395782, 1392717, 1382409, 1392054

Enhanced breakpoint UX

The redesigned Breakpoints pane allows you to have quick access to commonly used features, in particular, deactivating, editing, and removing breakpoints.

These are some highlights:

  • Both pause exception options moved to the Breakpoints pane and labeled with text to make it more self-explanatory. Pause exception options.

  • Breakpoints are grouped by file, ordered by line or column numbers, and are collapsible. Group breakpoints by file.

  • There are new options to deactivate, remove, and edit breakpoints when hovering over a breakpoint or file. New options to deactivate breakpoints.

  • Click the edit breakpoint button to open the breakpoint editor. From here, you can enter the breakpoint condition or switch to a logpoint. Breakpoint edit dialog.

See JavaScript debugging reference to learn how to debug with DevTools.

Chromium issues: 1407586, 1402891, 1402893

Customizable Recorder shortcuts

Use keyboard shortcuts to record and replay user flows quicker.

The Recorder introduces a few convenient keyboard shortcuts for faster recording and replaying of user flows.

Donโ€™t remember the shortcuts? No problem, click the ? button to view all the shortcuts at any time. The Recorder shortcuts.

You can even customize these shortcuts via the Settings menu. Customize Recorder shortcuts.

If you're working in a different panel and want to start a user flow recording, use the Create a new recording command from the Command Menu in DevTools to get started. Create a new recording command.

Chromium issue: 1339771

Better syntax highlight for Angular

DevTools enhanced the syntax highlighting for Angular HTML templates, making it easier for you to read code and recognize its structure. Syntax highlighting for the Angular HTML templates.

Chromium issues: 1385374, 1385678

Reorganize caches in the Application panel

The Cache Storage pane can now be found in the Storage section of the Application panel, while the Back/forward cache pane has been moved to the Background Services section. Caches in the Application panel.

Chromium issue: 1407166

Miscellaneous highlights

These are some noteworthy fixes in this release:

  • DevTools has been updated to respect the Disable cache setting when loading sourcemaps. (1407084)
  • The Elements panel now instantly autofocuses on the first matching element in search results. (1381853)
  • Various fixes to improve the sourcemap and breakpoints reliability. (508270, 1403362, 1403432, 1396298, 1395337, 1405134)
  • To better facilitate debugging, DevTools now supports evaluating expressions with private class members. (1381806) Evaluating expressions with private class members.

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.

  • Submit a suggestion or feedback to us via crbug.com.
  • Report a DevTools issue using the More options ย  More ย  > 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 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

...



๐Ÿ“Œ What's New in DevTools (Chrome 111)


๐Ÿ“ˆ 35.87 Punkte

๐Ÿ“Œ Different ways to open Chrome DevTools | DevTools Tips


๐Ÿ“ˆ 33.57 Punkte

๐Ÿ“Œ CVE-2023-1216 | Google Chrome prior 111.0.5563.64 DevTools use after free


๐Ÿ“ˆ 32.94 Punkte

๐Ÿ“Œ CVE-2023-1235 | Google Chrome prior 111.0.5563.64 on KunLun DevTools type confusion


๐Ÿ“ˆ 32.94 Punkte

๐Ÿ“Œ Google Chrome 111.0.5563.110/.111 (Desktop) โ€“ und fรผr Android/iOS


๐Ÿ“ˆ 32.31 Punkte

๐Ÿ“Œ Discover CSS issues with DevTools | DevTools Tips


๐Ÿ“ˆ 29.23 Punkte

๐Ÿ“Œ DevTools Tips: Source maps in DevTools


๐Ÿ“ˆ 29.23 Punkte

๐Ÿ“Œ DevTools Tips: How to emulate CSS user preference media features with DevTools


๐Ÿ“ˆ 29.23 Punkte

๐Ÿ“Œ DevTools Tips: Different ways to open DevTools


๐Ÿ“ˆ 29.23 Punkte

๐Ÿ“Œ DevTools Tips: Faster DevTools navigation


๐Ÿ“ˆ 29.23 Punkte

๐Ÿ“Œ Debugging PWA with DevTools | DevTools Tips


๐Ÿ“ˆ 29.23 Punkte

๐Ÿ“Œ CVE-2015-2550 | Microsoft Windows Vista SP2 up to Server 2012 R2 Kernel access control (MS15-111 / MS15-111)


๐Ÿ“ˆ 27.97 Punkte

๐Ÿ“Œ CVE-2015-2549 | Microsoft Windows Vista SP2 up to Server 2012 R2 Kernel Kernel Memory access control (MS15-111 / MS15-111)


๐Ÿ“ˆ 27.97 Punkte

๐Ÿ“Œ CVE-2015-2554 | Microsoft Windows up to Server 2012 R2 Kernel access control (MS15-111 / MS15-111)


๐Ÿ“ˆ 27.97 Punkte

๐Ÿ“Œ CVE-2015-2553 | Microsoft Windows Vista SP2 up to Server 2012 R2 Kernel input validation (MS15-111 / MS15-111)


๐Ÿ“ˆ 27.97 Punkte

๐Ÿ“Œ Google Chrome prior 48.0.2564.109 Developer Tools chrome-devtools-frontend.appspot.com remoteBase privilege escalation


๐Ÿ“ˆ 23.29 Punkte

๐Ÿ“Œ Google Chrome vor 48.0.2564.109 Developer Tools chrome-devtools-frontend.appspot.com remoteBase erweiterte Rechte


๐Ÿ“ˆ 23.29 Punkte

๐Ÿ“Œ Google Chrome vor 48.0.2564.109 Developer Tools chrome-devtools-frontend.appspot.com remoteBase erweiterte Rechte


๐Ÿ“ˆ 23.29 Punkte

๐Ÿ“Œ Chrome Canary 111.0.5515.0 - Early Google Chrome builds for developers.


๐Ÿ“ˆ 22.66 Punkte

๐Ÿ“Œ Chrome 60 - What's New in DevTools


๐Ÿ“ˆ 21.88 Punkte

๐Ÿ“Œ Chrome 59 - What's New in DevTools


๐Ÿ“ˆ 21.88 Punkte

๐Ÿ“Œ Chrome 75 - Whatโ€™s New in DevTools


๐Ÿ“ˆ 21.88 Punkte

๐Ÿ“Œ Chrome 74 - Whatโ€™s New in DevTools


๐Ÿ“ˆ 21.88 Punkte

๐Ÿ“Œ Chrome 73 - Whatโ€™s New in DevTools


๐Ÿ“ˆ 21.88 Punkte

๐Ÿ“Œ Chrome 72 - Whatโ€™s New in DevTools


๐Ÿ“ˆ 21.88 Punkte

๐Ÿ“Œ Chrome 71 - Whatโ€™s New in DevTools


๐Ÿ“ˆ 21.88 Punkte

๐Ÿ“Œ Chrome 70 - Whatโ€™s New in DevTools


๐Ÿ“ˆ 21.88 Punkte

๐Ÿ“Œ Chrome 68 - What's New in DevTools


๐Ÿ“ˆ 21.88 Punkte

๐Ÿ“Œ Chrome 67 - What's New in DevTools


๐Ÿ“ˆ 21.88 Punkte

๐Ÿ“Œ Chrome 66 - What's New in DevTools


๐Ÿ“ˆ 21.88 Punkte

๐Ÿ“Œ Chrome 65 - What's New in DevTools


๐Ÿ“ˆ 21.88 Punkte

๐Ÿ“Œ Chrome 64 - What's New in DevTools


๐Ÿ“ˆ 21.88 Punkte

๐Ÿ“Œ Chrome 63 - What's New in DevTools


๐Ÿ“ˆ 21.88 Punkte

๐Ÿ“Œ Chrome 62 - What's New in DevTools


๐Ÿ“ˆ 21.88 Punkte

๐Ÿ“Œ Chrome 61 - What's New in DevTools


๐Ÿ“ˆ 21.88 Punkte











matomo