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

Matthias Rohmer

Data publikacji: 25 sierpnia 2026 r.

Chrome 152 wprowadza znaczące ulepszenia debugowania sieci, w tym ponowne wysyłanie żądań i sprawdzanie ładunku binarnego, dekoracje elementów niestandardowych i ulepszone zagnieżdżanie CSS w sekcji Elementy, podstawowe wskaźniki internetowe dotyczące miękkiej nawigacji w sekcji Wydajność – dane na żywo, eksportowanie tabeli strukturalnej w konsoli oraz ulepszenia serwera MCP Narzędzi deweloperskich.

Narzędzia deweloperskie dla agentów

Najnowsza wersja v1.7.0 serwera MCP w Narzędziach deweloperskich w Chrome rozszerza wprowadzone wcześniej funkcje debugowania pamięci dla agentów kodowania, takich jak Antigravity, Claude, Codex i inne:

• Szczegóły obiektu zrzutu sterty (get_heapsnapshot_object_details): sprawdzaj szczegółowe właściwości obiektów JavaScriptu, nazwy klas i ścieżki zachowywania elementów głównych GC bezpośrednio ze zrzutów sterty.
• Filtrowanie kontekstu natywnego V8: filtruj obiekty zrzutu sterty według natywnego kontekstu wykonania i sprawdzaj konteksty natywne w podsumowaniach zrzutów.
• Ulepszenia stabilności i cyklu życia demona: dodano ograniczone przechowywanie żądań sieciowych na potrzeby nawigacji, weryfikację identyfikatora sesji, ostrzeżenia o niezgodności wersji interfejsu CLI i demona oraz płynne zamykanie procesów roboczych po usunięciu kontekstu.

Więcej informacji znajdziesz w repozytorium Narzędzi deweloperskich dla agentów na GitHubie.

Sieć: edytowanie i ponowne wysyłanie żądań, wstępne wczytywanie statystyk i dekodowanie ładunku binarnego

• Ponowne wysyłanie żądań pobierania i XHR: poprzednia opcja menu kontekstowego „Powtórz XHR” to teraz Ponownie wyślij. Obsługuje teraz wszystkie żądania sieciowe, które można pobrać, przekształcając standardowe żądania w wywołania fetch(), zachowując pełną wierność odtwarzania wraz z XHR. Żądania śledzą i wyświetlają też kontekst wykonania oraz źródło w konsoli.
• Kolumna wstępnie wczytana i „Skopiuj jako element wstępnego wczytywania”: nowa kolumna Wstępnie wczytana wskazuje, czy żądanie sieciowe zostało zainicjowane przy użyciu spekulacyjnego wstępnego wczytywania. Możesz też kliknąć prawym przyciskiem myszy dowolne żądanie i wybrać Skopiuj jako element wstępnego wczytywania, aby wygenerować tag <link rel="preload"> gotowy do wstawienia do kodu HTML. Wskazówki Early Hints są teraz przypisane do kolumny Inicjator.
• Przeglądarka binarna ładunków żądań: karta Payload zawiera teraz opcje metody dekodowania (Base64, Hex i UTF-8) dla binarnych i skompresowanych ładunków żądań, podobnie jak karta Response.
• Kolumna Numer przypiętego żądania: kolumna Żądanie # jest teraz przypięta do pierwszej pozycji w siatce danych sieci, co ułatwia odwoływanie się do żądań.
• Filtrowanie hostów w tej samej witrynie: wyszukiwanie domen, nazw hostów lub portów (np. localhost lub example.com) na pasku filtra Sieć teraz dokładnie filtruje żądania z tej samej witryny.
• Domyślne dekodowanie parametrów zapytania: parametry zapytania i formularza na karcie Payload (Ładunek) są teraz automatycznie dekodowane we wszystkich żądaniach.

Problemy z Chromium: 40726969, 41299075, 40138847, 40222701, 525848667, 507077182, 498482622, 520437951, 40267477

Elementy: niestandardowe elementy dekoracyjne, zagnieżdżone interakcje selektora nadrzędnego CSS i wybór pseudoelementu $0

Sprawdzanie i tworzenie komponentów internetowych oraz nowoczesnego kodu CSS jest szybsze i bardziej intuicyjne w panelu Elementy:

• Logo elementu niestandardowego: niestandardowe elementy HTML (identyfikowane przez tagi z łącznikiem lub atrybuty is="..." w przypadku dostosowanych elementów wbudowanych) wyświetlają teraz logo custom-element w konturze drzewa DOM.
• Interakcje z zagnieżdżonymi selektorami nadrzędnymi CSS i ich specyficzność: najechanie kursorem na selektory nadrzędne w zagnieżdżonych regułach CSS i dziedziczonych regułach zagnieżdżonych powoduje teraz wyróżnienie pasujących elementów na stronie i reaguje na filtrowanie w panelu Style. Dodaliśmy etykietki z informacjami o szczegółowości reguł @nested-declarations.
• Wybór pseudoelementów za pomocą $0: wybieranie pseudoelementów, takich jak ::before lub ::after, w drzewie DOM elementów powoduje teraz bezpośrednie powiązanie ich ze zmienną konsoli $0, co umożliwia natychmiastowe sprawdzenie w JavaScript.
• Autouzupełnianie typów text-wrap i <image>: panel Style sugeruje teraz wszystkie wartości słów kluczowych dla text-wrap (wrap, nowrap, balance, pretty, stable) i automatycznie uzupełnia właściwości CSS akceptujące typy danych <image>.
• Pasek przewijania w modelu pudełkowym: diagram danych modelu pudełkowego prawidłowo oblicza i renderuje wymiary pola treści, gdy elementy mają widoczne paski przewijania.

Problemy z Chromium: 367440148, 535517817, 535522242, 535523039, 537724428, 399305533, 334984154, 383355294, 326260752, 389342065

Skuteczność: dane dotyczące miękkiej nawigacji w sekcji Dane na żywo i niestandardowe ustawienia wstępne zrzutów ekranu

• Obsługa wskaźników na żywo w przypadku miękkich nawigacji: widok Wskaźniki na żywo domyślnie rejestruje i raportuje Core Web Vitals (takie jak LCP i INP) w przypadku miękkich nawigacji po stronie klienta w aplikacjach jednostronicowych. Jest to możliwe dzięki uaktualnieniu do wersji web-vitals 6.0.0.
• Niestandardowe ustawienia wstępne przechwytywania zrzutów ekranu: w panelu Wydajność udostępniono konfigurowalne ustawienia wstępne rozmiaru ramki zrzutu ekranu i limitu liczby zrzutów ekranu na potrzeby śledzenia CDP, aby dostosować wierność nagrywania wizualnego w ramach budżetów pamięci.
• console.profileEnd() ujawnianie śladu: wywołanie console.profileEnd() w kodzie lub konsoli automatycznie otwiera i ujawnia zarejestrowany ślad w panelu Skuteczność.
• Podsumowanie niestandardowych ścieżek w interfejsie Extensibility API: podsumowania śledzenia wydajności przetwarzają teraz grupy ścieżek niestandardowych zarejestrowane za pomocą interfejsu Extensibility API i wyświetlają je.

Problemy z Chromium: 514721939, 490140054, 536954453, 535506117

Konsola: eksportowanie tabel jako plików Markdown lub CSV i ochrona przed efektami ubocznymi

• Kopiowanie tabel z konsoli jako Markdown lub CSV: tabele rejestrowane za pomocą console.table() można teraz kopiować bezpośrednio do schowka jako sformatowane tabele Markdown lub dane CSV z menu kontekstowego.
• Ochrona przed oceną efektów ubocznych: ocena po najechaniu kursorem w debuggerze chroni teraz przed wyrażeniami zawierającymi operatory new, oznaczone literały szablonu, dynamiczne operatory import() i delete, zapobiegając przypadkowym mutacjom stanu podczas wstrzymania.

Problemy z Chromium: 40924951,40133606

Inne ciekawe pozycje w menu

Kolekcja ważnych ulepszeń w innych podsystemach Narzędzi deweloperskich:

• Źródła: funkcja Szybkie otwieranie priorytetowo traktuje teraz lokalne pliki obszaru roboczego z dużym wzrostem wyniku, dzięki czemu pliki obszaru roboczego pojawiają się na górze listy przed zasobami sieciowymi. (Problem w Chromium: 40260136)
• Pamięć: widok Podsumowanie zrzutu sterty wyświetla teraz łączną liczbę obiektów wraz z zagregowanymi rozmiarami płytkimi dla wybranych typów i zawiera filtry kontekstu wykonania natywnego. (Problem w Chromium: 497855658)
• Aplikacja: w panelu Reklamy przeniesiono przełącznik Podświetl reklamy bezpośrednio do panelu, dodano klikalne identyfikatory elementów ramki iframe reklamy, aby wyświetlać ramki w hierarchii, oraz wprowadzono tabelę podziału danych według ramki. (Problem w Chromium: 514957134)
• Aplikacja: przeprojektowaliśmy sekcję Wyczyść dane witryny w panelu Pamięć masowa w ujednoliconą, skonsolidowaną grupę (problem w Chromium: 375867286) i rozwiązaliśmy problem z duplikatami wpisów Pamięć podręczna po przywróceniu pamięci podręcznej stanu strony internetowej (problem w Chromium: 484693244).
• Rozszerzenia: metody asynchroniczne w chrome.devtools.panels teraz natywnie zwracają obietnice JavaScriptu, gdy są wywoływane bez wywołania zwrotnego. (Problem w Chromium: 496604551)
• Ustawienia: podziel domyślne gotowe ustawienia ograniczania wykorzystania sieci i niestandardowe konfiguracje ograniczania wykorzystania sieci na osobne sekcje. (Problem w Chromium:342409451)
• Lighthouse: zaktualizowaliśmy dołączony moduł Lighthouse do wersji 13.4.1. (Problem w Chromium: 40543651)
• Problemy: Narzędzia deweloperskie wyświetlają ostrzeżenie, gdy obraz używający loading="lazy" nie ma jawnych wymiarów width ani height.
• Tryb urządzenia: uprościliśmy menu poziomu powiększenia, dodając ujednoliconą opcję Dopasuj do okna, i wyłączyliśmy przełącznik Pokaż ramkę urządzenia, gdy grafika ramki jest niedostępna.

Ulepszenia ułatwień dostępu

Chrome 152 zawiera te ulepszenia ułatwień dostępu:

• Elementy i ułatwienia dostępu: dodaliśmy opcje menu kontekstowego, które umożliwiają płynne przełączanie się między drzewem DOM elementów a widokiem drzewa ułatwień dostępu, a także opcję „Przewiń do widoku” dla węzłów ułatwień dostępu. (Problemy z Chromium: 417929842)
• Ułatwienia dostępu: dodano obsługę kopiowania węzłów drzewa ułatwień dostępu i poddrzew jako zwykłego tekstu za pomocą menu kontekstowego. (Problem w Chromium:417929842)
• Elementy: poprawiono kolory podświetlenia wyszukiwania o niskim kontraście w panelu Elementy podczas korzystania z trybu ciemnego. (Problem w Chromium:491718898)
• Nawigacja: odłączanie Narzędzi deweloperskich do osobnego okna lub ponowne dokowanie ich na karcie nie powoduje już przeniesienia fokusu na przycisk menu głównego.
• Ustawienia: dodano opisowy kontekst ułatwień dostępu do przycisków „Pokaż więcej” i „Pokaż mniej” w ustawieniach AI.