Как изменить класс элемента и запретить серверу его изменять?

Пытаюсь написать Chromne расширение для сайта.

На сайте есть сетка из 20 ячеек, 19 ячеек имеют класс div.grid__cell.grid__cell_active и последняя div.grid__cell.grid__cell_active.grid__cell_disabled, то есть последняя ячека не активна и при клике на нее ничего не происходит.

Пытаюсь просто изменить имя класса на странице

console.log(document.querySelector(".grid__row_wrap:nth-child(11) div.grid__cell:nth-child(19)"));
document.querySelector(".grid__row_wrap:nth-child(11) div.grid__cell:nth-child(19)").className = "grid__cell grid__cell_active";
console.log(document.querySelector(".grid__row_wrap:nth-child(11) div.grid__cell:nth-child(19)"));

класс изменяется и мгновенно меняется обратно. Если ставлю на ячейку MutationObserver и меняю класс после каждого восстановления, страница видимо уходит в бесконечный цикл и зависает.

Собственно вопросы:

  • Как мне узнать как сервер обновляет классы и блокировать его, чтобы ячейка обрабатывалась как активная?
  • Как в целом мониторить общение запросов и ответов? Сейчас я проверяю все только через панель разработчика Chrome f12
  • Можно как-то обойти момент кликанья на ячейки и сразу отправлять нужный запрос на сервер?

Ответы (0 шт):