Comments 17
Иногда брейкпойнт очень трудно или вовсе невозможно поставить в нужном месте через Dev Tools, если код транспилируется. Watch тоже иногда не работает в таком коде.
debugger
выручает в первом случае, но некоторые баги не воспроизводятся, если выполнение приостанавливается.
Так что console.log иногда самый надёжный метод:)
Есть один не всем знакомый трюк для отладки всяких тонкостей связанных с popover-ми, которые исчезают при потери фокуса:
- открываем консоль
- запускаем
setTimeout('debugger;', 3000);
- успеваем активировать на странице что хотели и ждём
- разбираемся с багом
Попробуйте просто при активном tooltip/popover нажать f8 и остановить исполнение. Popover/tooltip тоже "замерзнет" и его можно будет отладить. Найдено на просторах stackoverflow.
Хороший трюк.
Ещё можно попытаться успеть нажать f8
15 лет назад один мой друг научил меня пользоваться alert()
'ом. Он был старше (senior) и опытнее (experienced) и сказал, что под Windows много лет использует ::MessageBox()
и до сих пор с ним ничего плохого не случилось. Я попробовал и оказалось, что это не так уж страшно. Потом об этом узнало начальство, назвало его (и меня) извращенцем, долго ругалось, рассказало мне про console.log()
и брейкпоинты, но было уже поздно. Я начал писать alert()
'ы, когда думал, что никто не видит и один раз даже по ошибке закоммитил alert()
в продакшен. Было очень стыдно, но я до сих пор не могу побороть этот порок.
Я тоже пользуюсь алертами. Как пошла привычка с начала, так и есть до сих пор
Совет: чтобы дебаггер дружил с транспилированным кодом нужно в конфиге вебпака установить devtool: 'eval'. Так вы будете видеть уже траспилированный код, но с разбивкой по реальным файлам как в файловой системе.
Совет вытекающий из предыдущего совета: чтобы транспилированный код был читаеме нужно в конфиге TS выставить target в ESNext (или сделать аналогичное для Бабеля)
Бонус совет: Остановившись на точке останова вы можете переключится во вкладку девтулзов console и там у вас будет доступ ко всем переменным текущей области видимости
Я всё жду когда разработчики Chrome DevTools сделают так чтобы отладка не зависала во перед и во время брейкпойнта
Швейцарский нож отладки JavaScript