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….

Ulepszenia sieci

Ta wersja zawiera wiele ulepszeń panelu Sieć.

W kolumnie Stan znajdziesz powód niepowodzenia.

W kolumnie Stan zawsze jest teraz widoczna przyczyna niepowodzenia. Wcześniej trzeba było włączyć check_box Wiersze prośby o przetwarzanie dużych danych lub wybrać prośbę 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 kopiuje teraz prawidłową komendę do schowka w 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 przełączać się między poziomami powiększenia, kliknij odpowiedni link na liście na górze osi czasu. Aby zobaczyć, jak działają ścieżki, obejrzyj następny film.

Problemy z Chromium: 1467739.

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

Na ścieżce Skuteczność > Główna domyślnie wyświetlają się teraz strzałki łączące inicjatory z wywołanymi przez nich kolejnymi zdarzeniami.

• Odrzucenie stylu lub układu –> Ponownie oblicz style lub Układ.
• Żądanie klatki animacji -> Uruchomiono klatkę animacji
• Request Inactive Callback -> Fire Inactive Callback
• Zainstaluj licznik czasu -> Uruchomiono licznik czasu
• Utwórz WebSocket -> Wyślij… i Otrzymanie uzgodnienia połączenia WebSocket lub Zniszcz WebSocket

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

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, kliknij w Źródłach Cmd (Mac) lub Ctrl (Windows) + Shift + numer wiersza. Ten skrót jest dodatkiem do już istniejącego Cmd (Mac) / Ctrl (Win) + kliknięcie w przypadku punktów kontrolnych warunkowych.

Menu poleceń zawiera nowe polecenie Pokaż aktywny plik na pasku bocznym nawigacji, które działa tak samo jak odpowiednia opcja w menu Edytor.

Problemy z Chromium: 1486933, 1467464.

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

Tryb urządzenia umożliwia teraz ustawienie pozycji 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 Aplikacje

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 wyświetlić poradnik opisujący problemy, a potem kliknij ikonę, aby otworzyć kartę Problemy z dodatkowymi informacjami.

Dodatkowo 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. Jedną z ciekawych zmian jest nowy audyt, który pozwala wykryć, czy Twoja witryna nadal używa 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 będzie 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.
  • Wynik działania polegający na dodaniu lub usunięciu lokalizacji w ustawieniach Ustawienia > Lokalizacje.
  • Grupy reguł wykluczenia (ogólnych lub niestandardowych) w sekcji Ustawienia Ustawienia > Lista ignorowania.

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

Inne najciekawsze momenty

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: rozwiązano błąd związany z błędną ikoną fioletowej kropki na karcie Nagłówki (1507856).
  • Podgląd: rozwiązano błąd związany z niepotrzebnym podwójnym dekodowaniem (1509336).
  • Naprawiono błąd, który powodował, że krótkie żądania nie były wyświetlane (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).
  • Śledzenie wydajności zapisuje teraz dane podczas przechodzenia do about:blank (1509947).

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.