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 efektu. W panelu Style Narzędzia deweloperskie przyciemniają nieaktywne właściwości. Najedź kursorem na ikonę obok niej, aby dowiedzieć się, dlaczego reguła nie ma widocznego efektu.

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

Problem w Chromium: 1178508

Automatyczne wykrywanie selektorów XPath i tekstowych w panelu Rejestrator

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

Selektory XPath i tekstowe w panelu Rejestrator.

Problemy z Chromium: 1327206,1327209

Przechodzenie między wyrażeniami rozdzielonymi przecinkami

Podczas debugowania możesz teraz przechodzić przez wyrażenia rozdzielone przecinkami. Ułatwia to debugowanie skompresowanego kodu.

Przechodzenie przez wyrażenia rozdzielone przecinkami.

Wcześniej Narzędzia deweloperskie obsługiwały tylko przechodzenie przez wyrażenia rozdzielone średnikami.

Biorąc pod uwagę poniższy kod:

function foo() {}

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

Transpilatory i minifikatory mogą przekształcać je w wyrażenia oddzielone przecinkami.

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

Podczas debugowania może to powodować zamieszanie, ponieważ zachowanie podczas przechodzenia krok po kroku jest inne w przypadku kodu zminimalizowanego i kodu źródłowego. Jest to jeszcze bardziej mylące, gdy do debugowania zminimalizowanego kodu w kontekście oryginalnego kodu używa się map źródłowych, ponieważ programista widzi wtedy średniki (które w tle zostały zamienione na przecinki przez łańcuch narzędzi), ale debuger się na nich nie zatrzymuje.

Problem w Chromium: 1370200

Ulepszone ustawienie listy ignorowanych fragmentów kodu

Otwórz Ustawienia > Lista ignorowanych. Narzędzia deweloperskie mają ulepszony interfejs, który ułatwia konfigurowanie reguł ignorowania pojedynczego skryptu lub wzorca skryptów.

kartę Lista ignorowanych fragmentów kodu,

Problem w Chromium: 1356517

Różne wyróżnione informacje

Oto niektóre z najważniejszych poprawek w tej wersji:

  • Automatyczne uzupełnianie nazwy właściwości CSS w panelu Style po naciśnięciu spacji. (1343316)
  • Usuń automatyczne przewijanie w menu nawigacyjnym panelu Element. (1369734)

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.

Co nowego w Narzędziach deweloperskich

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