Nowości w Narzędziach deweloperskich: Chrome 127

Sofia Emelianova

Sprawdzanie pozycjonowania elementów zakotwiczenia CSS w panelu Elementy

Aby ułatwić debugowanie funkcji pozycjonowania kotwicy, na karcie Style są teraz połączone jawne identyfikatory kotwic i kotwice domyślne z ich węzłami.

Dodatkowo wartość atrybutu popovertarget jest teraz połączona z elementem popover w DOM.

Ulepszenia w panelu Źródła

Ta wersja wprowadza kilka ulepszeń w panelu Źródła.

Ulepszona funkcja „Nigdy nie wstrzymuj w tym miejscu”

Opcja „Never Pause Here” (Nigdy nie wstrzymuj w tym miejscu) pozwala zapobiec wielokrotnemu wstrzymywaniu działania Debugger w tym samym wierszu. Ułatwia to pracę z nieistotnymi punktami przerwania, które są wywoływane wielokrotnie. Ta wersja rozszerza tę funkcję i działa teraz w przypadku:

• Wyjątki lub odrzucenia obietnic z funkcji wbudowanych.
• Anulowanie punktów przerwania DOM, pobierania/XHR i naruszeń zasad CSP.
• W dezasemblacji Wasm.

Zobacz, jak działa ten proces:

Problem w Chromium: 40924349.

Nowe detektory zdarzeń przyciągania przewijania

Na liście Źródła > Punkty przerwania detektora zdarzeń > Sterowanie pojawią się 2 detektory związane z przyciąganiem przewijania: scrollsnapchange i scrollsnapchanging. Te zdarzenia są wywoływane, gdy przewijasz kontener przewijania w taki sposób, że przyciąga on nowy element.

Problem w Chromium: 40286359.

Ulepszenia panelu Sieć

Ta wersja wprowadza kilka ulepszeń w panelu Sieć.

Zaktualizowane gotowe ustawienia ograniczania wykorzystania sieci

W panelu Sieć zaktualizowaliśmy gotowe ustawienia ograniczania przepustowości: dodaliśmy nowe ustawienie Szybkie 4G, zmieniliśmy nazwę ustawienia Szybkie 3G na Wolne 4G, a ustawienia Wolne 3G na 3G. Jest to bardziej zgodne z ustawieniami wstępnymi Lighthouse.

Problem w Chromium: 342406608.

Informacje o usługach Service Worker w niestandardowych polach formatu HAR

Podczas eksportowania dziennika sieci do formatu HAR możesz teraz wyświetlać informacje związane z service workerami, w tym czasy, jako pola niestandardowe (z prefiksem w postaci podkreślenia). W dzienniku możesz na przykład znaleźć te nowe pola:

...
"response": {
  ...
  "_fetchedViaServiceWorker": true,
  "_responseCacheStorageCacheName": "V1",
  "_serviceWorkerResponseSource": "cache-storage"
}
...
"timings": {
  ...
  "_workerStart": -1,
  "_workerReady": -1,
  "_workerFetchStart": -1,
  "_workerRespondWithSettled": -1
}
...

Problem w Chromium: 342406608.

Wysyłanie i odbieranie zdarzeń WebSocket w panelu Wydajność

Podobnie jak w przypadku innych zdarzeń WebSocket panel Wydajność rejestruje teraz zdarzenia Wyślij wiadomość WebSocket i Odbierz wiadomość WebSocket i wyświetla je w śladzie wydajności. Na przykład:

Problem z Chromium: 40286129.

Różne wyróżnione informacje

Oto kilka ważnych poprawek i ulepszeń w tej wersji:

• Ułatwienia dostępu: czytniki ekranu odczytują teraz treść wiadomości w konsoli podczas przewijania dziennika za pomocą klawiszy strzałek w górę i w dół (344484979).
• Źródła:
  • Strona: opcja menu Zapisz jako zapisuje teraz pliki modułów Wasm jako prawidłowe pliki binarne Wasm zamiast tekstu Base64 (40784130).
  • Stos wywołań: usunięto sufiks (async) z opisów ramek wywołań asynchronicznych i zmieniono wyróżnienie z kursywy na pogrubienie (343750870).
• Pamięć: usunięto niepotrzebny obiekt InternalNodes o rozmiarze zero ze zrzutu sterty Podsumowanie (340200025).
• Sieć: naprawiono błąd, który uniemożliwiał wyświetlanie podglądu treści odpowiedzi przesyłanych strumieniowo w przypadku żądań, które dopiero się rozpoczęły, ale nie otrzymały jeszcze zdarzenia responseReceived (338340752).
• Skuteczność:
  • Statystyki selektora: dodaliśmy etykietkę objaśniającą do kolumny %-of-Slow-Path-Non-Matches (324282954).
  • Tryb konfiguracji ścieżek: przycisk Zakończ konfigurowanie ścieżek został przeniesiony do prawego dolnego rogu (345256274).
• Konsola: naprawiono błąd, który powodował wyświetlanie wielu identycznych komunikatów konsoli podczas nawigacji przy użyciu pamięci podręcznej wstecz/do przodu (40894153).
• Ustawienia: dodaliśmy ikony pomocnicze obok wszystkich kart.

Pobieranie kanałów podglądu

Rozważ używanie Chrome w wersji Canary, deweloperskiej lub beta jako domyślnej przeglądarki do programowania. Te kanały wersji testowych zapewniają dostęp do najnowszych funkcji Narzędzi deweloperskich, umożliwiają testowanie najnowocześniejszych interfejsów API platformy internetowej i pomagają znajdować problemy w witrynie, zanim zrobią to użytkownicy.

Kontakt z zespołem Narzędzi deweloperskich w Chrome

Skorzystaj z tych opcji, aby porozmawiać o nowych funkcjach, aktualizacjach lub innych kwestiach związanych z Narzędziami deweloperskimi.

• Prześlij nam opinię 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.
• Dodawaj komentarze do filmów na YouTube z serii „Co nowego w Narzędziach deweloperskich” lub filmów na YouTube z serii „Wskazówki dotyczące Narzędzi deweloperskich”.

Co nowego w Narzędziach deweloperskich

Lista wszystkich tematów omówionych w serii Nowości w Narzędziach deweloperskich.