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

Jecelyn Yeen

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

Narzędzia deweloperskie identyfikują 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 niej, aby dowiedzieć się, dlaczego reguła nie ma widocznego wpływu.

Problem w Chromium: 1178508

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

Panel Dyktafon obsługuje teraz selektory XPath i tekstu. Zacznij rejestrować wzorzec użytkownika, a rejestrator automatycznie wybierze ścieżkę XPath i najkrótszy unikalny tekst elementu jako selektor, jeśli jest dostępny.

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.

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

Biorąc pod uwagę poniższy kod,

function foo() {}

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

Transpilatory i minifikatorzy mogą przekształcać je w wyrażenia rozdzielane 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

Ulepszone ustawienie listy ignorowanych

Otwórz 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.

Problem w Chromium: 1356517

Różne wyróżnienia

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)

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