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

Jecelyn Yeen

Wskazówki dotyczące nieaktywnych właściwości CSS

Narzędzia programistyczne rozpoznają teraz style CSS, które są prawidłowe, ale nie mają widocznego wpływu. W panelu Style Narzędzia deweloperskie zanikają nieaktywne właściwości. Najedź kursorem na ikonę obok niego, aby dowiedzieć się, dlaczego reguła nie ma żadnego widocznego wpływu.

Wskazówki dotyczące nieaktywnych właściwości CSS.

Problem z Chromium: 1178508

Automatycznie wykrywaj ścieżki XPath i selektory tekstu w panelu Dyktafon

Panel Dyktafon obsługuje teraz selektory XPath i tekstowe. Rozpocznij nagrywanie ścieżki użytkownika, a rekorder automatycznie wybierze XPath i najkrótszy unikalny tekst elementu jako selektor, jeśli jest dostępny.

XPath i selektory tekstu w panelu Dyktafon.

Problemy z Chromium: 1327206,1327209

Przejdź przez wyrażenia rozdzielane przecinkami

Podczas debugowania możesz teraz używać wyrażeń rozdzielanych przecinkami. Zwiększa to możliwość debugowania zminifikowanego kodu.

Przejdź przez wyrażenia rozdzielone przecinkami.

Wcześniej w Narzędziach deweloperskich można było używać tylko wyrażeń rozdzielanych średnikami.

W przypadku kodu poniżej

function foo() {}

function bar() {
  foo();
  foo();
  return 42;
}

Kompilatory i kompresory mogą przekształcać je w wyrażenia rozdzielone przecinkami.

function bar(){return foo(),foo(),42}

Powoduje to dezorientację podczas debugowania, ponieważ działania krokowe różnią się w przypadku kodu zminifikowanego i tworzonego. Jeszcze bardziej komplikuje się, gdy używasz map źródłowych do debugowania zminifikowanego kodu w kontekście oryginalnego kodu, ponieważ deweloper sprawdza wtedy średniki (które zostały przekształcone przez łańcuch narzędzi w przecinki), ale debuger ich nie zatrzymuje.

Problem z Chromium: 1370200

Ulepszona lista ignorowanych

Kliknij Ustawienia > Lista ignorowanych. Narzędzia deweloperskie poprawiają wygląd, aby pomóc Ci skonfigurować reguły w taki sposób, aby ignorowały pojedynczy skrypt lub wzorzec skryptów.

Karta Lista ignorowanych

Problem w Chromium: 1356517

Inne najciekawsze momenty

Oto kilka ważnych poprawek w tej wersji:

  • Autouzupełnianie nazwy właściwości CSS w panelu Style po naciśnięciu spacji. (1343316).
  • Usunąć autoprzewijanie w menu nawigacyjnym panelu Element. (1369734)

Pobieranie kanałów podglądu

Rozważ użycie przeglądarki Chrome Canary, Dev lub Beta jako domyślnej przeglądarki dla programistów. Te kanały podglądu dają Ci 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 zrobią to użytkownicy.

Kontakt z zespołem Narzędzi deweloperskich w Chrome

Aby omówić nowe funkcje i zmiany w poście lub cokolwiek innego związanego z Narzędziami deweloperskimi, skorzystaj z podanych niżej opcji.

Co nowego w Narzędziach deweloperskich

Lista wszystkich tematów omawianych w cyklu artykułów Co nowego w Narzędziech deweloperskich.