Отладка js, изменяющая определенный элемент холста

Я пытаюсь отладить элемент холста с помощью инструментов разработчика Chrome. От этого:
Как проверить рамки холста
Я вижу, что была экспериментальная функция, позволяющая сделать что-то подобное, но она была удалена.

Есть ли способ найти / найти код JS, отвечающий за изменение какого-либо конкретного элемента холста? таким образом, по крайней мере, мы могли бы добавить точки останова в JS

Есть поиск в инструментах chrome dev, это то, что вам нужно?

Helder Sepulveda 10.08.2018 19:16

@HelderSepu да, но действительно сложно найти метод, если есть несколько больших файлов JS (и минифицированных!). Я надеялся, что что-то вроде точки останова прослушивателя событий автоматически обнаружит строку JS при изменении холста.

Enrique 10.08.2018 21:51
3
2
1 317
2
Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Раздел Точки останова прослушивателя событий позволяет делать паузу при создании контекста холста. Но я не вижу точки останова для паузы при изменении холста.

Если холст изменен после загрузки страницы, вы можете запустить что-то вроде этого в консоли:

const context = $("canvas").getContext("2d");
for (const key in context) {
  if (context[key] instanceof Function) {
    // debug() pauses on the first line of the function whenever it's called.
    // This function is only available from the DevTools Console:
    // https://developers.google.com/web/tools/chrome-devtools/console/command-line-reference#debugfunction
    debug(context[key]);     
  }
}

И затем активируйте модификацию.

Если это происходит при загрузке страницы, просто добавьте точку останова где-нибудь в сценарии, который выполняется до изменения холста, запустите приведенный выше код в консоли во время паузы, а затем возобновите выполнение сценария.

Вы можете опробовать рабочий процесс в этой демонстрации: https://51789703.glitch.me/

Ответ принят как подходящий

Я нашел обходной путь: переопределите функцию из CanvasRenderingContext2D и добавьте «отладчик»; строка там, чтобы останавливаться каждый раз, когда вызывается (или добавьте дополнительное условие для остановки)

Другие вопросы по теме