Nowości w Narzędziach deweloperskich: Chrome 127

Sofia Emelianova
Sofia Emelianova
GitHub

Aby ułatwić debugowanie funkcji pozycjonowania zakotwiczonych, karta Style łączy teraz z ich węzłami jawne identyfikatory zakotwiczonych i niejawne kotwice.

Połączenia jawne i niejawne przed i po połączeniu.

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

Elementy przed i po połączeniu popovertarget z jego elementem popover.

Ulepszenia panelu Źródła

W tej wersji wprowadziliśmy kilka ulepszeń w panelu Źródła.

Ulepszona funkcja „Nigdy nie wstrzymuj”

The 'Never Pause Here' zapobiega ponownemu wstrzymywaniu Debugera w tym samym wierszu. Ułatwia to pracę z nieistotnymi punktami przerwania, które uruchamiają się wielokrotnie. Ta wersja rozszerza tę funkcję i obecnie działa w przypadku:

  • Wyjątki lub obietnice odrzucenia ze względu na funkcje wbudowane.
  • „Anuluję” Punkty przerwania DOM, pobierania/XHR i naruszenia zasad CSP.
  • W demontażu Wasm.

Zobacz, jak wygląda przepływ pracy:

Problem z Chromium: 40924349.

Nowe detektory zdarzeń przewijania

Źródła > Punkty przerwania detektora zdarzeń > Lista kontrolna zawiera 2 detektory powiązane z scroll-snap: scrollsnapchange i scrollsnapchanging. Te zdarzenia są wywoływane, gdy przewijasz kontener przewijania w sposób, który powoduje przyciąganie go do nowego elementu.

Informacje o dodaniu detektorów zdarzeń związanych z przyciąganiem przewijania (przed i po).

Problem z Chromium: 40286359.

Ulepszenia panelu Sieć

W tej wersji wprowadziliśmy kilka ulepszeń w panelu Sieć.

Zaktualizowano gotowe ustawienia ograniczania wykorzystania sieci

W panelu Sieć zostaną zaktualizowane gotowe ustawienia ograniczania: Szybka 4G, Szybka 3G zmieniona na Wolna 4G oraz Zwolna 3G na 3G. To ustawienie lepiej pasuje do gotowych ustawień Lighthouse.

Okresy przed aktualizacją gotowych ustawień ograniczania wykorzystania sieci i po jej zaktualizowaniu.

Problem z Chromium: 342406608.

Informacje o mechanizmie Service Worker w polach niestandardowych formatu HAR

Podczas eksportowania logu sieciowego do formatu HAR możesz teraz wyświetlać informacje związane ze skryptami service worker, w tym czasy, jako pola niestandardowe (poprzedzone podkreśleniami). W logu możesz na przykład zobaczyć te nowe pola:

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

Problem z 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 Odbieraj wiadomość WebSocket w zdarzeniach śledzenia wydajności. Na przykład:

Odbieranie komunikatu WebSocket zdarzenie zarejestrowane w zrzucie wydajności.

Problem z Chromium: 40286129.

Różne wyróżnienia

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łu Wasm jako prawidłowe pliki binarne Wasm zamiast tekstu Base64 (40784130).
    • Stos wywołań: z opisów ramek wywołania asynchronicznego usunięto sufiks (async) i zmieniono wyróżnienie z kursywy na pogrubione (343750870).
  • Pamięć: z Podsumowania zrzutu sterty (340200025) usunęliśmy zbędne pole InternalNodes o zerowym rozmiarze.
  • Sieć: naprawiliśmy błąd, który uniemożliwiał podgląd treści odpowiedzi w odpowiedzi na żądania przesyłania w przypadku żądań, które właśnie się rozpoczęły, ale nie wywołały jeszcze zdarzenia responseReceived (338340752).
  • Skuteczność:
    • Statystyki selektora: dodaliśmy etykietkę objaśniającą dotyczącą kolumny %-of-Slow-Path-Non-Matches (324282954).
    • Tryb konfiguracji ścieżki: przycisk Zakończ konfigurowanie ścieżek został przeniesiony na prawy dolny róg (345256274).
  • Konsola: naprawiliśmy błąd, który powodował wyświetlanie wielu identycznych komunikatów w konsoli podczas nawigacji za pomocą pamięci podręcznej stanu strony internetowej (40894153).
  • Ustawienia: obok wszystkich kart dodaliśmy ikony pomocnicze.

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 w Narzędziach deweloperskich.
  • Opublikuj tweeta na stronie @ChromeDevTools.
  • Napisz komentarz w filmach w YouTube o nowościach w Narzędziach deweloperskich lub o 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.