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

Jecelyn Yeen

Korzystanie z Narzędzi deweloperskich w wybranym języku

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

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

Preferences" width="800" height="494">

Problem z Chromium: 1163928

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

Teraz możesz symulować wymiary Nest Hub i Nest Hub Max w trybie urządzenia.

Kliknij Przełącz pasek narzędzi urządzenia    , a następnie na liście urządzeń wybierz Nest Hub lub Nest Hub Max.

Problem z Chromium: 1223525

Testy pochodzenia w widoku Szczegóły ramki

Informacje o próbach pochodzenia witryny możesz teraz uzyskać w widoku szczegółów ramki w panelu Aplikacja.

Weryfikacja origin daje dostęp do nowej lub eksperymentalnej funkcji, aby umożliwić użytkownikom wypróbowanie jej przez ograniczony czas, zanim stanie się ona dostępna dla wszystkich.

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

Problem z Chromium: 607555

Nowa plakietka zapytań dotyczących kontenera usługi porównywania cen

Obok elementów kontenera (elementów nadrzędnych, które spełniają kryteria reguł at-rules @container) dodawany jest nowy znacznik container. Kliknij plakietkę, aby przełączyć wyświetlanie nakładki wybranego kontenera i wszystkich jego potomków, którzy wysyłają zapytania na stronie.

Problem z Chromium: 1146422

nowe pole wyboru umożliwiające odwrócenie działania filtrów sieci;

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

Aby na przykład odfiltrować żądania sieci o stanie 404, możesz wpisać „kod stanu: 404”. Aby odwrócić działanie filtra (wyświetlić wszystkie żądania sieci, które nie mają stanu 404), zaznacz pole wyboru Odwróć.

Problem z Chromium: 1054464

Wycofanie paska bocznego konsoli

Pasek boczny konsoli zostanie usunięty, a interfejs filtra przeniesiony na pasek narzędzi. Czy masz jakieś pytania lub wątpliwości? Poinformuj nas o tym za pomocą tego śledzika problemów.

Problem z Chromium: 1232937

Wyświetlanie surowych nagłówków Set-Cookie na karcie Problemy i w panelu Sieć

Na karcie Problemy narzędzia DevTools wyświetlają teraz nagłówki Set-Cookie w postaci surowych danych.

Wcześniej w panelu Sieć narzędzia DevTools nie wyświetlały nieprawidłowo sformułowanych plików cookie (z nieprawidłowym nagłówkiem Set-Cookie). Dzięki nowemu filtrowi response-header-set-cookie dodanego w panelu Sieć użytkownicy mogą filtrować nieprzetworzoną odpowiedź nagłówka Set-Cookie. Narzędzia deweloperskie połączą nagłówki Set-Cookie w postaci nieprzetworzonej na karcie Problemy z panelem Sieć.

Problem z Chromium: 1179186

wyświetlanie w Konsoli obiektów dostępnych natywnych jako własnych usług,

Konsola wyświetla teraz natywnych akcesorów jako własne usługi.

Na przykład podczas obliczania wyrażenia new Int8Array([1, 2, 3]) w Konsoli, na podglądzie nie były wyświetlane natywnych funkcji dostępu, takich jak length czy byteOffset. W tej najnowszej aktualizacji w podglądzie wyświetlane są natywne metody dostępu, a wartości są oceniane po rozwinięciu.

Problemy z Chromium: 1076820, 1199247

Prawidłowe ścieżki stosu błędów w przypadku skryptów wbudowanych z adresem URL źródłowym #sourceURL

Narzędzia deweloperskie poprawnie rozwiązują teraz skrypty wbudowane za pomocą #sourceURL i wyświetlają odpowiednie ścieżki błędów w ramach debugowania.

Wcześniej w Narzędziach deweloperskich wyświetlano nieprawidłową lokalizację skryptów wstawianych za pomocą tagu #sourceURL w stosunku do otaczającego dokumentu, a nie do otwierającego tagu <script>.

Problemy z Chromium: 1183990, 578269

Zmiana formatu kolorów w panelu Obliczenia

Teraz możesz zmienić format koloru dowolnego elementu w panelu Obliczenia, klikając Shift + klikając podgląd koloru.

Problem z Chromium: 1226371

Zastępowanie niestandardowych etykiet narzędzia natywnymi etykietami narzędzia w kodzie HTML

Narzędzie DevTools używa teraz natywnych etykiet HTML we wszystkich komponentach. Ze względu na brak stylizacji natywnego tooltipa HTML narzędzia deweloperskie od dawna używają niestandardowych tooltipów.

Utrzymywanie niestandardowej implementacji dymka jest skomplikowane i regularnie napotykamy skomplikowane błędy.

Po ponownym przeanalizowaniu zalet niestandardowych implementacji doszliśmy do wniosku, że na potrzeby DevTools wystarczające są natywne etykiety HTML, a ich wdrożenie zapobiegnie wielu problemom użytkowników.

Problem z Chromium: 1223391

[Experimental] Ukrywanie problemów na karcie Problemy

Aby ukryć problemy na karcie Problemy, włącz eksperyment Ukryj menu problemów. Dzięki temu możesz skupić się na ważnych kwestiach.

Na karcie Problem najedź kursorem na problem, kliknij menu problemu   po prawej stronie i wybierz Ukryj podobne problemy, aby go ukryć.

Problem z Chromium: 1175722

Pobieranie kanałów podglądu

Rozważ użycie jako domyślnej przeglądarki deweloperskiej wersji Canary, Dev lub Beta przeglądarki Chrome. Te kanały wersji wstępnej zapewniają dostęp do najnowszych funkcji DevTools, umożliwiają testowanie najnowocześniejszych interfejsów API platformy internetowej i pomagają znaleźć problemy w witrynie, zanim zrobią to użytkownicy.

Kontakt z zespołem Narzędzi deweloperskich w Chrome

Aby omówić nowe funkcje, aktualizacje lub inne kwestie związane z Narzędziami deweloperskimi, skorzystaj z tych opcji.

• Przesyłaj opinie i prośby o dodanie funkcji na stronie crbug.com.
• Zgłoś problem z Narzędziami deweloperskimi, klikając more_vert Więcej opcji > Pomoc > Zgłoś problem z Narzędziami deweloperskimi w Narzędziach deweloperskich.
• Wyślij tweeta do @ChromeDevTools.
• Dodaj komentarze do filmów w YouTube z serii „Co nowego w Narzędziach deweloperskich” lub Wskazówki dotyczące Narzędzi deweloperskich.

Co nowego w Narzędziach deweloperskich

Lista wszystkich tematów omawianych w cyklu artykułów Co nowego w Narzędziach deweloperskich.