Jak nowy pasek boczny punktów przerwania ułatwia debugowanie

Kim-Anh Tran
Kim-Anh Tran
Vaatika Dabra Groth
Vaatika Dabra Groth

Stary i nowy panel punktu przerwania obok siebie.

Jeśli korzystasz z Chrome 111 lub nowszej wersji, możesz już zauważyć, że zmieniliśmy wygląd paska bocznego punktów przerwania. W przeglądarce Chrome 113 nowy pasek boczny całkowicie zastępuje stary. Celem tej zmiany było usprawnienie przepływu pracy punktów przerwania przez:

zapewnienie lepszego przeglądu wszystkich ustawionych punktów przerwania, Łatwiejsze korzystanie z punktów przerwania w typowych przepływach pracy i łatwiejsze i w bardziej intuicyjny. Uwidacznianie istniejących funkcji punktów przerwania.

W tym poście zakładamy, że wiesz już, jak debugować za pomocą punktów przerwania. Jeśli nie korzystasz jeszcze z punktów przerwania, przejdź do tego przeglądu punktów przerwania i dowiedz się więcej o tym, jak używać tych punktów do debugowania kodu.

Przyjrzyjmy się teraz nowym funkcjom i zobaczmy, jak możesz skorzystać z nowego paska bocznego. Uwaga: koncentrujemy się na tym, aby dotychczasowe funkcje były bardziej intuicyjne w obsłudze i łatwiejsze w obsłudze, a nie dodawanie nowych.

Wstrzymuj działanie wyjątków, aby sprawdzić, dlaczego kod powoduje błąd

Wstrzymaj przy wykrytych i niewykrytych wyjątkach.

Czy Twój kod zgłasza wyjątek? Nie ma mowy! W Narzędziach deweloperskich w Chrome możesz wstrzymywać działanie wyjątków, aby zatrzymać wykonywanie w momencie jego zgłoszenia. Pomoże Ci to zbadać i lepiej zrozumieć okoliczności, w których Twój kod generuje błąd. Możesz określić, czy chcesz wstrzymać odtwarzanie przy wykrytych wyjątkach, niewykrytych wyjątkach czy obu tych przypadkach, zaznaczając odpowiednie pola wyboru na pasku bocznym.

Zarządzaj punktami przerwania: rozwijaj odpowiednie grupy punktów przerwania i zwijaj pozostałe, aby skupić się na tym, co istotne

zwijać i rozwijać grupy punktów przerwania,

Punkty przerwania mogą być rozłożone w kilku plikach. Pasek boczny punktów przerwania grupuje punkty przerwania według pliku, do którego należą. Skoncentruj się tylko na tych grupach, które mają znaczenie w bieżącej sesji debugowania, rozwijając odpowiednie grupy punktów przerwania i zwijając pozostałe.

Zarządzanie punktami przerwania: jedno kliknięcie pozwala przejść do kodu, usunąć albo włączyć lub wyłączyć te punkty

Pasek boczny punktów przerwania umożliwia wykonywanie typowych zadań jednym kliknięciem. Oto omówienie, w jaki sposób możesz ...

Przejdź do lokalizacji punktu przerwania w edytorze kodu. Usuń jeden lub wszystkie punkty przerwania w pliku. Włącz lub wyłącz jeden lub wszystkie punkty przerwania w pliku.

I to wszystko za jednym kliknięciem! W menu kontekstowym są też dostępne te opcje:

Przejdź do lokalizacji punktu przerwania, klikając fragment kodu punktu przerwania

Przejdź do lokalizacji kodu źródłowego w edytorze kodu.

Czy chcesz sprawdzić, w którym miejscu kodu masz ustawiony punkt przerwania, i przeanalizować otaczający go kod? Wystarczy kliknąć fragment kodu punktu przerwania na pasku bocznym, aby otworzyć lokalizację kodu w edytorze kodu.

Usuń pojedynczy punkt przerwania lub wszystkie punkty przerwania w pliku, klikając przycisk usuwania.

Usuń pojedynczy punkt przerwania lub wszystkie punkty przerwania w pliku.

Najedź kursorem na punkt przerwania lub grupę punktów przerwania, aby wyświetlić przycisk usuwania, który po kliknięciu usuwa pojedynczy lub wszystkie punkty przerwania z pliku.

Wyłączanie jednego lub wszystkich punktów przerwania w pliku

Włącz lub wyłącz pojedynczy lub wszystkie punkty przerwania w pliku.

Zaznacz lub odznacz pole wyboru obok punktu przerwania, aby go włączyć lub wyłączyć.

Aby włączyć lub wyłączyć wszystkie punkty przerwania w pliku, najedź kursorem na grupę punktów przerwania i zaznacz lub odznacz pole wyboru obok nazwy pliku.

Wykorzystaj te mniej znane cechy punktów przerwania: warunkowe punkty przerwania i punkty logowania

Edytuj warunki punktu przerwania lub zmień log punktu logowania, edytując punkt przerwania

Edytuj warunki punktu przerwania lub logi punktu logowania.

Aby edytować warunek lub dziennik punktu przerwania, najedź kursorem na punkt przerwania i kliknij przycisk edytuj, który się wtedy pojawi. Otworzy się okno, w którym możesz zmienić jego typ i szczegóły.

Aby otworzyć okno edytowania punktu przerwania, możesz też wybrać wiersz punktu przerwania w edytorze kodu i nacisnąć Control+Alt+B w systemie Linux lub Command+Alt+B na Macu.

Możesz też szybko dokładnie sprawdzić stan lub dziennik punktu logowania, najeżdżając kursorem na punkt przerwania na pasku bocznym:

Wyświetl dziennik warunku lub punktu logowania.

Podsumowanie

Przeprojektowaliśmy pasek boczny punktów przerwania, aby ułatwić debugowanie za pomocą punktów przerwania. Przede wszystkim zależało nam na tym, aby materiały były bardziej uporządkowane, a także łatwiej dostępne i zrozumiałe. Mamy nadzieję, że te usprawnienia pomogą Ci podczas następnej sesji debugowania.

Jeśli masz sugestie dotyczące dalszych ulepszeń, daj nam znać, zgłaszając błąd.

Pobieranie kanałów podglądu

Jako domyślnej przeglądarki dla programistów możesz używać Chrome Canary, Dev lub Beta. Te kanały podglądu dają dostęp do najnowszych funkcji Narzędzi deweloperskich, umożliwiają testowanie najnowocześniejszych interfejsów API platform internetowych oraz wykrywanie problemów w witrynie, zanim zdołają zrobić użytkownicy.

Kontakt z zespołem Narzędzi deweloperskich w Chrome

Użyj poniższych opcji, aby omówić nowe funkcje i zmiany w poście lub wszelkie inne kwestie związane z Narzędziami dla deweloperów.

  • Prześlij nam sugestię lub opinię na stronie crbug.com.
  • Aby zgłosić problem z Narzędziami deweloperskimi, kliknij Więcej opcji   Więcej   > Pomoc > Zgłoś problemy z Narzędziami deweloperskimi.
  • zatweetuj na @ChromeDevTools.
  • Napisz komentarz o nowościach w filmach w YouTube dostępnych w Narzędziach deweloperskich lub z poradami dotyczącymi narzędzi dla deweloperów w filmach w YouTube.