Как да отстранявам грешки и да проверявам неща, които се променят в отговор на щраквания с мишката или промени във фокуса?

В момента си играя с някои полета на формуляр за автоматично попълване и ми е много трудно да проверявам генерираните падащи елементи. Веднага след като щракна върху бутона „инспектиране на елемент“ или се опитам да щракна с десния бутон върху падащите менюта, първоначалният вход за автоматично довършване стартира събитие onclick (или нещо, което задейства промяна на фокуса) и скрива, изтрива или модифицира по друг начин елемента, който бях опитвайки се да инспектирам.

Има ли начин да работя с дебъгера, така че кликванията на мишката и другите команди, които му давам, да не бъдат прихванати от скрипта, който се опитвам да отстраня?

В момента имам такъв проблем както във Firebug, така и в инспектора на Chrome. Единственото решение, за което се сещам в момента, е да задам някои интелигентни точки на прекъсване в съответните манипулатори на събития, но това е трудно да се направи, ако не знам какви манипулатори на събития да търся или къде са скрити в оригиналния код...


javascript google-chrome-devtools firebug
person hugomg    schedule 08.11.2012    source източник
comment
Изпитвам същия проблем, затова създадох crbug.com/160510   -  person NVI    schedule 12.11.2012

Отговори (6)


arrow_upward
5
arrow_downward

Можете да зададете точка на прекъсване и да проверите, след като бъде задействана, забелязах, че замразява DOM.

person Asad Saeeduddin    schedule 08.11.2012
comment
Както бе споменато във въпроса, задаването на точки на прекъсване е досадно, ако трябва да го правя няколко пъти или ако не знам структурата на кода, който отстранявам грешки. Има ли по-директен начин за замразяване на DOM? - person hugomg; 09.11.2012
comment
@missingno бихте могли например да прикачите фиктивен манипулатор на събития към всички елементи при задържане, след което да зададете точка на прекъсване вътре в него. Би било досадно да продължавате изпълнението всеки път, но точките на прекъсване могат да бъдат условни. - person Asad Saeeduddin; 09.11.2012
comment
Той замразява DOM, но също така деактивира щракването с десния бутон, така че не можете да използвате Inspect Element. Все пак можете да изследвате в изглед Elements, ако знаете какво търсите. Поне по този начин можете да го видите подчертано, когато задържите курсора на мишката върху него в Elements, което всъщност не можете да направите на живо за неща, които изчезват, когато преместите мишката от тях. - person Mu Mind; 01.02.2014

arrow_upward
2
arrow_downward

Трябва да използвате точки на прекъсване. Що се отнася до проследяването на това какво се случва къде, прозорецът „Call Stack“ на Chrome може да бъде много полезен.

наздраве

person Madbreaks    schedule 08.11.2012
comment
Задаването на точки на прекъсване обаче е трудно да се направи, ако не съм написал скрипта и не знам къде да поставя точките на прекъсване. Има ли начин просто да поставя на пауза изпълнението на скрипта като цяло без точките на прекъсване? - person hugomg; 09.11.2012
comment
Ако не сте ги използвали, прочетете за XHR Breakpoints и Event Listener Breakpoints на Chrome, може да успеете да използвате едното/и двете... зависи от ситуацията. - person Madbreaks; 09.11.2012

arrow_upward
2
arrow_downward

Във Firebug имате Break on next елемент в Script панел. От Firebug 1.10 има клавишна комбинация за това: Ctrl+Alt+B в Windows (работи дори ако фокусът е в страницата, а не във Firebug).

Вероятно ще трябва да имате панел Script, фокусиран във Firebug, тъй като това е споделен пряк път за Break on..., който се различава във всеки панел.

Обикновено замразява DOM, въпреки че не е 100% надежден.

Освен това не е идеален, защото ще спре при всяко изпълнение на JavaScript и няма да бъде от полза, ако има някакво агресивно анкетиране във фонов режим или глобално улавяне на събития от клавиатурата. Както и да е, пак е по-добре от нищо.

person jakub.g    schedule 15.11.2012

arrow_upward
2
arrow_downward

Chrome поставя на пауза изпълнението на Javascript на F8; отне малко повторение, но натискането на F8 в точното време попречи на JS да разфокусира елемента.

person Chris    schedule 08.03.2018
comment
Това работи изненадващо добре, когато работите със списък с резултати, който изчезва от DOM и нямате контрол върху 1. намирането на компилирания JS и 2. добавянето на допълнителен вграден JS - person Ben Sewards; 20.11.2018

arrow_upward
0
arrow_downward

Ако имате проблем с избирането на елемента, можете да опитате cmd + shift + c на Mac, за да изберете елемента, без да щракнете с десния бутон върху него.

Ако има проблем с манипулирането на DOM, можете да опитате да принудите състоянието на входния елемент, като щракнете с десния бутон върху елемента в панела с елементи и зададете принудително състояние на фокус.

person resting    schedule 09.11.2012

arrow_upward
0
arrow_downward

  1. Първо отворете закрепените DevTools (подходът без закачане няма да работи поради ограниченията на операционната система.)
  2. След като се покаже полето за автоматично попълване, щракнете с десния бутон върху него и изберете „Проверка на елемента“ в контекстното меню. Фокусът ще се премести към DevTools, но полето за автоматично довършване все още ще се показва (това работи за мен на Linux, tip-of-tree Chromium, M25. Вашият пробег може да варира.)
person Alexander Pavlov    schedule 16.11.2012