Użyj nowego menu kontekstowego panelu DOM, aby sprawnie edytować węzły. Debuguj instancje robocze usług bezpośrednio w panelu Zasoby. Do wyboru masz wszystkie odcienie Material Design w selektorze kolorów. Biblioteki JS Blackbox.
Nowe, ulepszone menu kontekstowe panelu DOM
Przeanalizowaliśmy najczęściej używane działania w panelu DOM i doszliśmy do wniosku, że menu kontekstowe dostępne po kliknięciu prawym przyciskiem myszy powinno być przejrzyste i uporządkowane.
Dużo łatwiej jest teraz szybko ukryć lub usunąć element, wywołać określony stan, np. :active lub :hover, lub edytować jego kod HTML. A jeśli używasz trackpada i nie chcesz klikać prawym przyciskiem myszy, zamiast tego kliknij 3 kropki obok wybranego elementu.
Debugowanie skryptu service worker za pomocą panelu Zasoby
Skrypty service worker są niesamowite, gdy już je skonfigurujesz, ale czasem trudno jest im zaprzątać sobie głowę na wczesnym etapie. Było to jeszcze gorsze, ponieważ debugowanie wymagało opuszczenia Narzędzi deweloperskich i otworzenia strony chrome://serviceworker-internals/ w nowym oknie przeglądarki.
Już nie. Teraz możesz debugować mechanizmy Service Worker w bieżącej domenie bezpośrednio z panelu Zasoby. Pracujemy nad tym, ale już w porównaniu z poprzednim stanem dużo się zmieniło.
Wszystkie kolory: odcienie Material Design w selektorze kolorów
Kilka tygodni temu dodaliśmy do selektora kolorów paletę Material Design, aby od razu widzieć wyraziste kolory. Aby zaprojektować całą stronę, musisz mieć pełny dostęp do wszystkich odcieni Material Design.
Aby wywołać cienie, naciśnij i przytrzymaj jeden z kolorów podstawowych, a następnie kliknij odcień.
Biblioteki JavaScript Blackbox w ustawieniach ułatwiają
Funkcja Blackboxing w języku JavaScript jest stosowana od dawna, ale jej odkrywanie nie jest tak łatwe. Dzięki tej funkcji możesz dodać do czarnych czarnych pasów skrypt na stronie, aby skupić się tylko na Twoim kodzie (i ukryć cały kod towarzyszący).
Przenieśliśmy je teraz do Ustawień. Wypróbuj tę funkcję:
Najlepsze z pozostałych
- Nie masz dostępu do przełączników renderowania? Ustawienia renderowania zostały przeniesione do menu głównego Narzędzi deweloperskich (w sekcji „Więcej narzędzi”). Oprócz typowych podejrzeń (np. miernika klatek na sekundę) przenieśliśmy do nich również opcję „Emuluj multimedia do druku”.
- Masz dość wpisywania chrome://inspect w omniboksie? Zbadaj urządzenia znajdziesz też teraz w nowym menu głównym, wybierając „Więcej narzędzi”.
- Przypadkowo jedna z tych możliwych do zamknięcia kart panelu (np. Renderowanie lub Wyszukiwanie) Możesz je teraz ponownie otworzyć w nowym menu po lewej stronie.
Jak zawsze, podziel się z nami swoją opinią na Twitterze lub w komentarzach poniżej i prześlij błędy na stronie crbug.com/new.
Do następnego miesiąca.
Paul Bakaus i zespół Narzędzi deweloperskich