Nowości w Narzędziach deweloperskich (Chrome 94)

Jecelyn Yeen

Używanie Narzędzi deweloperskich w wybranym języku

Narzędzia deweloperskie w Chrome obsługują teraz ponad 80 języków, dzięki czemu możesz pracować w wybranym przez siebie języku.

Otwórz Ustawienia, a następnie w menu Preferencje > Język wybierz preferowany język i załaduj ponownie Narzędzia deweloperskie.

Ustawienia" width="800" height="494">

Problem z Chromium: 1163928

Nowe urządzenia Nest Hub na liście urządzeń

Możesz teraz symulować wymiary urządzeń Nest Hub i Nest Hub Max w trybie urządzenia.

Kliknij Toggle Device Toolbar   Przełącz pasek narzędzi urządzenia  , a potem pod listą urządzeń wybierz Nest Hub lub Nest Hub Max.

Urządzenie Nest Hub w trybie urządzenia

Problem z Chromium: 1223525

Wersje próbne punktu początkowego w widoku szczegółów ramki

Informacje o testach origin w witrynie znajdziesz teraz w widoku szczegółów ramki w panelu Aplikacje.

Wersje próbne origin zapewniają dostęp do nowej lub eksperymentalnej funkcji, która umożliwia tworzenie funkcji, które Twoi użytkownicy mogą wypróbować przez ograniczony czas, zanim staną się dostępne dla wszystkich.

Otwórz stronę z testami origin (np. stronę demonstracyjną). W panelu Aplikacja przewiń w dół do sekcji Klatki i wybierz górną ramkę.

Wersje próbne punktu początkowego w widoku szczegółów ramki

Problem z Chromium: 607555

Nowa plakietka zapytań dotyczących kontenerów CSS

Obok elementów kontenera (elementów nadrzędnych, które pasują do kryteriów określonych w regułach @container) dodawana jest nowa plakietka kontenera. Kliknij plakietkę, aby przełączyć wyświetlanie na stronie nakładki wybranego kontenera i wszystkich jego elementów podrzędnych.

Plakietka zapytań dotyczących kontenerów CSS

Problem z Chromium: 1146422

Nowe pole wyboru do odwracania filtrów sieci

Aby odwrócić filtry w panelu Sieć, użyj nowego pola wyboru Odwróć.

Możesz np. wpisać „kod-stanu: 404”, aby odfiltrować żądania sieciowe o stanie 404. Zaznacz pole wyboru Odwróć, aby wykluczyć filtr (pokaż wszystkie żądania sieciowe, które nie mają stanu 404).

Odwróć filtry sieci

Problem w Chromium: 1054464

Niedługo wycofamy pasek boczny konsoli

Pasek boczny konsoli zostanie usunięty, a interfejs filtrów zostanie przeniesiony na pasek narzędzi. Czy masz jakieś uwagi lub chcesz podzielić się opinią? Poinformuj nas o tym za pomocą tego narzędzia do śledzenia problemów.

Komunikat o wycofaniu paska bocznego konsoli

Problem z Chromium: 1232937

Wyświetlaj nieprzetworzone nagłówki Set-Cookie na karcie Problemy i panelu Sieć

Narzędzia deweloperskie wyświetlają teraz na karcie Problemy nieprzetworzone nagłówki Set-Cookie.

Wcześniej Narzędzia deweloperskie nie wyświetlały w panelu Network nieprawidłowych plików cookie (nieprawidłowego nagłówka Set-Cookie). Po dodaniu w panelu Sieć nowego filtra response-header-set-cookie użytkownicy mogą filtrować nieprzetworzoną odpowiedź nagłówka Set-Cookie. Narzędzia deweloperskie połączą nieprzetworzone nagłówki Set-Cookie na karcie Problemy z panelem Sieć.

Nieprzetworzone nagłówki „Set-Cookie” na karcie Problemy i panelu Sieć

Problem z Chromium: 1179186

Spójne akcesoria wyświetlania natywnego jako właściwości w konsoli

Konsola spójnie wyświetla teraz natywne metody dostępu jako własne właściwości.

Na przykład podczas oceny wyrażenia new Int8Array([1, 2, 3]) w konsoliKonsoli natywne metody dostępu, takie jak length, byteOffset, nie były wyświetlane w podglądzie. Dzięki tej najnowszej aktualizacji natywne akcesory są wyświetlane w podglądzie, a po rozwinięciu ich wartości są szybko oceniane.

Spójne akcesoria wyświetlania natywnego jako właściwości w konsoli

Problemy z Chromium: 1076820, 1199247

Prawidłowe zrzuty stosu błędów dla wbudowanych skryptów z #sourceURL

Narzędzia deweloperskie poprawnie interpretują wbudowane skrypty za pomocą funkcji #sourceURL i wyświetlają prawidłowe zrzuty stosu błędów na potrzeby debugowania.

Wcześniej w Narzędziach deweloperskich wyświetlała się nieprawidłowa lokalizacja skryptów w tekście z elementem #sourceURL – względem otaczającego dokumentu, a nie otwierającego tagu <script>.

Prawidłowe zrzuty stosu błędów dla wbudowanych skryptów z #sourceURL

Problemy z Chromium: 1183990, 578269

Zmień format koloru w panelu Obliczone

Możesz teraz zmienić format koloru dowolnego elementu w panelu „Obliczony” przez naciśnięcie klawisza Shift i kliknięcie podglądu koloru.

Shift + kliknij podgląd koloru, aby zmienić format koloru

Problem z Chromium: 1226371

Zastępowanie etykiet niestandardowych etykietkami natywnymi HTML

Narzędzia deweloperskie wykorzystują teraz natywne etykietki HTML we wszystkich komponentach. Narzędzia deweloperskie od dawna miały implementację niestandardowej etykietki ze względu na brak stylu natywnej etykietki HTML.

Niestety obsługa niestandardowej etykietki jest skomplikowana i regularnie napotykamy skomplikowane błędy.

Po zmianie wagi rozwiązań niestandardowych okazało się, że etykietki natywnego kodu HTML są wystarczające w Narzędziach deweloperskich, a ich zastosowanie zapobiega wielu problemom, z którymi mierzą się użytkownicy.

Etykietka narzędzi deweloperskich

Problem z Chromium: 1223391

[Funkcja eksperymentalna] Ukryj problemy na karcie Problemy

Włącz eksperyment z menu ukrywania problemów, aby ukryć problemy na karcie Problemy. Dzięki temu możesz skupić się na ważnych dla Ciebie kwestiach.

Aby go ukryć, na karcie Problem najedź kursorem na problem, kliknij menu problemów Więcej po prawej stronie i wybierz Ukryj problemy tego typu.

Eksperymentalne menu kontekstowe ukrywania problemu

Problem z Chromium: 1175722

Pobierz kanały podglądu

Zastanów się, czy nie ustawić Chrome w wersji Canary, Dev lub beta jako domyślnej przeglądarki do programowania. Te kanały wersji testowej dają dostęp do najnowszych funkcji Narzędzi deweloperskich, umożliwiają testowanie najnowocześniejszych interfejsów API platformy internetowej i wykrywanie problemów w witrynie, zanim użytkownicy ją zobaczą.

Kontakt z zespołem ds. Narzędzi deweloperskich w Chrome

Skorzystaj z poniższych opcji, aby porozmawiać o nowych funkcjach i zmianach w poście lub o innych kwestiach związanych z Narzędziami deweloperskimi.

  • Prześlij nam sugestię lub opinię na crbug.com.
  • Aby zgłosić problem z Narzędziami deweloperskimi, kliknij Więcej opcji   Więcej   > Pomoc > Zgłoś problemy z Narzędziami deweloperskimi.
  • Opublikuj tweeta na stronie @ChromeDevTools.
  • Napisz komentarz pod filmem dotyczącym nowości w Narzędziach deweloperskich w Narzędziach deweloperskich w YouTube lub filmach w YouTube ze wskazówkami dotyczącymi Narzędzi deweloperskich.

Co nowego w Narzędziach deweloperskich

Lista wszystkich tematów, które zostały omówione w serii Co nowego w Narzędziach deweloperskich.

Chrome 127

Chrome 126

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 został anulowany.

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