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

Oficjalna kolekcja rozszerzeń Dyktafonu jest dostępna

Oficjalna kolekcja rozszerzeń Dyktafon do eksportowania i ponownego odtwarzania jest już dostępna.

Aby otworzyć kolekcję bezpośrednio z nagrywarki, na pasku czynności u góry panelu Nagrywarka kliknij pobierz Eksportuj > Pobierz rozszerzenia….

Usprawnienia sieci

Ta wersja zawiera wiele ulepszeń panelu Sieć.

W kolumnie Stan znajdziesz powód niepowodzenia.

Kolumna Stan zawsze pokazuje teraz przyczynę niepowodzenia. Wcześniej trzeba było włączyć check_box Wiersze z dużą liczbą zapytań lub wybrać zapytanie w tabeli.

Problemy z Chromium: 1506760.

Ulepszone menu Kopiuj

Menu podrzędnego Kopiuj w prośbie jest teraz lepiej zorganizowane.

Dodatkowo opcja Kopiuj jako cURL pozwala teraz skopiować odpowiednie polecenie do schowka w systemie Windows.

Problemy z Chromium: 1267033, 1276452, 798498.

Poprawa skuteczności

Ta wersja zawiera wiele ulepszeń panelu Wydajność.

Menu nawigacyjne na osi czasu

U góry panelu Skuteczność znajdziesz osi czasu, na której możesz ustawiać ścieżki nawigacyjne i między nimi się przełączać.

Aby ustawić menu nawigacyjne, wybierz zakres na osi czasu, najedź na niego kursorem i kliknij przycisk N ms zoom_in. Możesz utworzyć kilka zagnieżdżonych ścieżek. Aby przechodzić między poziomami powiększenia, kliknij odpowiednie menu nawigacyjne w łańcuchu u góry osi czasu. Aby zobaczyć, jak działają ścieżki, obejrzyj następny film.

Problemy z Chromium: 1467739.

Inicjatorzy zdarzeń na ścieżce głównej

Domyślnie ścieżka Wydajność > Główny zawiera teraz strzałki łączące inicjatory z poniższymi wywołanymi zdarzeniami.

• Nieprawidłowy styl lub układ –> Ponownie oblicz style lub Układ.
• Żądanie klatki animacji -> Uruchomiono klatkę animacji
• Request Idle Callback -> Fire Idle Callback
• Zainstaluj licznik czasu -> Uruchomiono licznik czasu.
• Utwórz WebSocket -> Wyślij… i Otrzymaj uzgodnienie połączenia WebSocket lub Zniszcz WebSocket

Aby zobaczyć strzałki, znajdź takie zdarzenie w logu czasu i kliknij je. Wcześniej ta funkcja była eksperymentem.

Problemy z Chromium: 1434596.

Menu selektora instancji maszyny wirtualnej JavaScript w narzędziach programistycznych Node.js

W panelu Wydajność w Node.js DevTools możesz teraz wybrać instancję maszyny wirtualnej JavaScript w odpowiednim menu na pasku czynności. Podobna funkcja była dostępna w wycofanej niedługo temu profilującej JavaScriptzie.

Problemy z Chromium: 1511813.

Ulepszenia elementów

Ta wersja zawiera wiele ulepszeń panelu Elementy.

Oprócz 2 kolejnych funkcji panel Elementy zapamiętuje teraz ostatnio otwieraną kartę, np. Wynikowy lub Właściwości.

Pseudoelement ::view-transition można teraz edytować w sekcji Styl

Teraz możesz edytować pseudoelementy CSS ::view-transition w sekcji Style za pomocą panelu inspekcji.

Więcej informacji znajdziesz w artykule Płynne i proste przejścia za pomocą interfejsu View Transitions API.

Problemy z Chromium: 1511233.

Obsługa właściwości align-content w przypadku kontenerów blokowych

Usługa align-content działa teraz z dowolnymi kontenerami bloków, w tym z kontenerami table-caption i table-cell. Wcześniej działała tylko z układem siatki i elastycznym.

Problemy z Chromium: 1500511.

Nowy skrót i polecenie w źródłach

Aby utworzyć punkt logowania, naciśnij klawisze Cmd (Mac) lub Ctrl (Win) + Shift i kliknij numer wiersza w sekcji Źródła. Ten skrót jest dodatkiem do już istniejącego skrótu Cmd (Mac) / Ctrl (Win) + kliknięcie w przypadku punktów kontrolnych warunkowych.

W Menu poleceń pojawi się nowe polecenie Pokaż aktywny plik na pasku bocznym nawigacji. Jest ono takie samo jak odpowiednia opcja w menu Edytora.

Problemy z Chromium: 1486933, 1467464.

Obsługa postawy w przypadku emulowanych składanych urządzeń

Tryb urządzenia pozwala teraz ustawić pozycję emulowanego składanego urządzenia: Ciągła lub Złożona. Tryb ciągły oznacza pozycję „płaską”, a po złożeniu tworzy kąt między sekcjami wyświetlacza.

Dodatkowo na liście Urządzenia pojawiło się nowe emulowane urządzenie składane: Asus Zenbook Fold.

Problem z Chromium: 1066842.

dynamiczne motywy

Narzędzia deweloperskie automatycznie dopasowują się teraz do motywu kolorystycznego Chrome. Aby ustawić motyw:

1. Otwórz nową kartę i w prawym dolnym rogu kliknij edytuj Dostosuj Chrome.
2. W sekcji Wygląd wybierz motyw, korzystając z opcji tapeta Zmień motywy lub wybierz paletę kolorów.

Problemy z Chromium: 1483276.

Ostrzeżenia o wycofaniu plików cookie innych firm w panelach Sieć i Aplikacja

W panelach Sieć i Aplikacja wyróżniono i wyświetlono ostrzeżenia obok plików cookie, na które mają wpływ ograniczenia dotyczące plików cookie innych firm z Ochrony przed śledzeniem.

W sekcji Sieć odszukaj prośbę z ikoną ostrzeżenia, kliknij ją i otwórz kartę Pliki cookie.

W sekcji Aplikacja kliknij Pamięć > Pliki cookie i wybierz domenę. Pliki cookie wyróżnione na żółto nie są przechowywane w przeglądarce.

Najedź kursorem na ikonę ostrzeżenia, aby zobaczyć etykietkę z opisem problemów. Kliknij ją, aby otworzyć kartę Problemy z dodatkowymi informacjami.

Oprócz tego pliki cookie w tabeli są teraz domyślnie sortowane według nazwy.

Problemy z Chromium: 1506225, 1503961.

Lighthouse 11.4.0

Panel Lighthouse korzysta teraz z wersji Lighthouse 11.4.0. Zobacz pełną listę zmian. Warto wspomnieć m.in. o nowej wersji kontroli, która pozwala sprawdzić, czy witryna nadal korzysta z plików cookie innych firm.

Podstawy korzystania z panelu Lighthouse w Narzędziach deweloperskich znajdziesz w artykule Lighthouse: optymalizacja szybkości witryny.

Problem z Chromium: 772558.

Ułatwienia dostępu

Ta wersja zawiera następujące ułatwienia dostępu:

• Gdy otworzysz Ustawienia Ustawienia > Eksperymenty, pole Szukaj zostanie automatycznie zaznaczone.
• Teraz można skupić się na przycisku anulowania Wyczyść dane wejściowe w sekcji Sieć > Filtr.
• Drzewo plików w sekcji Źródła > Strona jest teraz wyświetlane prawidłowo w trybie wysokiego kontrastu.
• Czytniki ekranu poprawnie odczytują teraz te elementy:
  • Stan pól wyboru w sekcji Źródła > Punkty graniczne.
  • Pozycja i informacje indeksu na liście sugestii.
  • Rezultat działania przy dodawaniu lub usuwaniu lokalizacji w Ustawieniach Ustawienia > Lokalizacje.
  • Grupy reguł wykluczania (ogólnych lub niestandardowych) w ustawieniach Ustawienia > Lista ignorowanych.

Problemy z Chromium: 1504938, 1499868, 1512161, 1515224, 1515418, 1516998, 1517015.

Inne wyróżnione informacje

Oto kilka istotnych poprawek i ulepszeń w tej wersji:

• Animacje:
  • Usunięto błąd polegający na renderowaniu wyskakującego okienka zrzutu ekranu poza obszarem (1506991).
  • Usunęliśmy błąd polegający na tym, że usunięte węzły animacji nie były oznaczone jako usunięte (1506561).
• Sieć:
  • Zastąpienia nagłówka: naprawiliśmy błąd związany z fałszywą fioletową kropką na karcie Nagłówki (1507856).
  • Podgląd: rozwiązano błąd związany z niepotrzebnym podwójnym dekodowaniem (1509336).
  • Naprawiliśmy błąd, przez który krótkie prośby nie wyświetlały się (1509862).
• Aplikacja > IndexedDB: w celu zapewnienia spójności z innymi panelami przearanżowano przyciski w pasku działań (1393800).
• Czujniki: usunięto błąd powodujący, że nie można było uzyskać informacji o dostępności lokalizacji (1486859).
• Skuteczność:
  • Przycisk Zbierz śmieci ma teraz odpowiednią ikonę – mopa zamiast kosza (1507530).
  • Zrzut wydajności zachowuje teraz dane podczas przechodzenia do about:blank (1509947).

Pobieranie kanałów podglądu

Rozważ użycie przeglądarki Chrome Canary, Dev lub Beta jako domyślnej przeglądarki deweloperskiej. 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

Użyj poniższych opcji, aby omówić nowe funkcje, aktualizacje lub inne informacje związane z Narzędziami deweloperskimi.

• Prześlij nam swoje 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.
• Opublikuj tweeta na stronie @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.