Nowości w Narzędziach dla deweloperów (Chrome 113)

Sofia Emelianova

Jecelyn Yeen

Zastąp nagłówki odpowiedzi sieci

Możesz teraz zastąpić nagłówki odpowiedzi w panelu Sieć. Dotychczas w celu eksperymentowania z nagłówkami odpowiedzi HTTP trzeba było mieć dostęp do serwera WWW.

Dzięki zastąpieniu nagłówka odpowiedzi możesz lokalnie prototypować poprawki różnych nagłówków, w tym:

• Nagłówki CORS
• Permissions-Policy Headers (Nagłówki zasad uprawnień)
• Nagłówki izolacji z różnych domen

Aby zastąpić nagłówek, przejdź do sekcji Sieć > Nagłówki > Nagłówki odpowiedzi, najedź kursorem na wartość nagłówka, kliknij i edytuj ją.

Możesz też dodać niestandardowe nagłówki.

Aby edytować wszystkie zastąpienia w jednym miejscu, edytuj plik .headers w sekcji Źródła > Zastąpienia. Możesz tam też kliknąć Dodaj regułę zastępowania, aby zastąpić wiele żądań przy użyciu symboli wieloznacznych (*).

Problem z Chromium: 1288023.

Ulepszenia debugowania Nuxt, Vite i Rollup

Aby pomóc w szybszym wykrywaniu problemów podczas debugowania, ulepszony zrzut stosu ukrywa teraz ramki pochodzące ze źródeł wygenerowanych przez Nuxt 3.3 lub nowszą wersję. Narzędzia deweloperskie pomijają takie klatki:

• W śladach Konsoli pod linkiem Pokaż więcej ramek.
• W sekcji Źródła > Stos wywołań w sekcji Pokaż klatki z listy ignorowanych.

Aby wprowadzić te ulepszenia, zespoły Narzędzi deweloperskich, Nuxt, Vite i Rollup nawiązały współpracę, aby wdrożyć rozszerzenie mapy źródłowej (x_google_ignoreList):

• Wersja Nuxt 3.3
• Opcje serwera Vite
• Opcje konfiguracji podsumowania

Zespół narzędzi deweloperskich chce podziękować zespołom Nuxt, Vite i Rollup za umożliwienie tego osiągnięcia. Dziękujemy za współpracę i współpracę, które miały kluczowe znaczenie dla powodzenia tej implementacji. Jeszcze raz dziękujemy za publikowane przez Ciebie rzeczy.

Ulepszenia CSS w Elementach > Style

Nieprawidłowe właściwości i wartości CSS

Aby przyspieszyć diagnozowanie problemów z usługą porównywania cen, panel Style jest teraz przekreślony:

• Cała deklaracja CSS (właściwość i wartość), gdy właściwość CSS jest nieprawidłowa.
• To tylko wartość, jeśli właściwość CSS jest prawidłowa, ale wartość jest nieprawidłowa.

Zespół Narzędzi deweloperskich chce podziękować Yisi(제丝) za wprowadzenie tej zmiany.

Linki do klatek kluczowych we właściwości skróconej animacji

Skrócona właściwość CSS animation zawiera teraz linki do odpowiednich reguł @keyframes, dzięki czemu możesz szybciej poruszać się po panelu Style.

Problem z Chromium: 1420656.

Nowe ustawienie konsoli: autouzupełnianie po naciśnięciu klawisza Enter

Od poprzedniej wersji (112) możesz skonfigurować konsolę Narzędzi deweloperskich w taki sposób, aby po naciśnięciu Enter była stosowana sugestia autouzupełniania.

Domyślnie, aby zaakceptować sugestię autouzupełniania, naciśnij Tab lub Arrow right. Aby też korzystać z autouzupełniania za pomocą funkcji Enter, włącz Ustawienia > Konsola > Zaakceptuj sugestię autouzupełniania naciśnięciem klawisza Enter

Dodatkowo tekst innego ustawienia jest teraz bardziej przyjazny dla użytkownika: Traktuj ocenę kodu jako działanie użytkownika.

Problem z Chromium: 1276960.

Menu poleceń wyróżnia utworzone pliki

Okno szybkiego otwierania w menu poleceń wyszarza teraz pliki innych firm znajdujące się na liście ignorowanych, aby podkreślić utworzone przez Ciebie pliki.

Problem z Chromium: 1424345.

Wycofanie programu profilującego JavaScript: etap drugi

Już w Chrome 58 zespół Narzędzi deweloperskich planował ostatecznie wycofać narzędzie JavaScript Profiler, a deweloperzy korzystający z Node.js i Deno mogli korzystać z panelu Performance (Wydajność) do profilowania wydajności procesora JavaScript.

W Narzędziach deweloperskich w wersji 113 rozpoczyna się drugi etap wycofywania czterofazowego narzędzia JavaScript Profiler. Na tym etapie możesz nadal otworzyć panel, ale jego interfejs nie będzie już dostępny.

Aby profilować wydajność procesora, kliknij Otwórz panel Wydajność.

Problem z Chromium: 1354548.

Różne wyróżnienia

Oto kilka ważnych poprawek w tej wersji:

• Naprawiliśmy błąd, który powodował nieprawidłowe drukowanie tekstu w panelu Źródła w celu nieprawidłowej obsługi nazw zmiennych zawierających znaki Unicode (1425055).
• Na karcie Problemy dodaliśmy nowy komunikat o problemach z autouzupełnianiem dotyczących niestandardowych wartości HTML (1399414).

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.