Есть задача: написать себе юзезрстиль для изменения внешнего вида неких элементов сайта. Исходники сайта недоступны, доступа к серверу нет.
Проблема в том, что эти элементы, которые хочется поменять, являются динамическими. Они появляются на долю секунды, максимум секунду, и потом исчезают или заменяются другими элементами. Мне физически не хватает времени кликнуть в веб-отладчике кнопку селектора, потом на сам элемент и потом ещё увидеть в дереве, как этот элемент задаётся.
Существует ли какая-то возможность записывать изменения DOM и просматривать изменения, или, скажем, по нажатию какой-то волшебной кнопки замораживать состояние сайта (или отображающегося в веб-отладчике дерева этого сайта) на текущий момент? Я порылся в разных панелях, предоставляемых хромоотладчиком (браузер Vivaldi, если это существенно), но не смог найти ничего подходящего (возможно, не разобрался; я в этой области, в общем-то, нуб и многих фич отладчика не понимаю). Есть какой-то инструмент Changes, но он открывает пустую панель, которая так и остаётся пустой с надписью "No changes", чтобы ни происходило на сайте.
Здравствуйте, CaptainFlint, Вы писали:
CF>Они появляются на долю секунды, максимум секунду, и потом исчезают или заменяются другими элементами.
Это что за элементы такие появляющиеся на долю секунды, для чего они?
CF>Проблема в том, что эти элементы, которые хочется поменять, являются динамическими. Они появляются на долю секунды, максимум секунду, и потом исчезают или заменяются другими элементами. Мне физически не хватает времени кликнуть в веб-отладчике кнопку селектора, потом на сам элемент и потом ещё увидеть в дереве, как этот элемент задаётся.
Вероятно следует поставить event listener breakpoint на DOM Mutation и включить Log там же.
(это на примере Mozilla Firefox). Встать на паузу и пройтись пошагово в отладчике тоже можно.
Здравствуйте, rFLY, Вы писали:
CF>>Они появляются на долю секунды, максимум секунду, и потом исчезают или заменяются другими элементами. FLY>Это что за элементы такие появляющиеся на долю секунды, для чего они?
Разные ситуации. Например, на IMDB регулярно само вылогинивает, а потом начинает задалбывать всплывашкой "а не хотите ли обратно залогиниться?", которая выскакивает как раз поверх рейтинга, закрывая его собой.
Или на Discord'е когда всякие внутричатовые картинки-видео грузятся, на их месте первым делом отрисовывается какой-то ядерно-кислотный плейсхолдер, который потом заменяется на подгрузившуюся картинку; раздражает такая цветоввая гамма, хочу прибить плейсхолдер, чтобы вместо него был обычный белый или серый фон.
Здравствуйте, m2user, Вы писали:
M>Вероятно следует поставить event listener breakpoint на DOM Mutation и включить Log там же. M>(это на примере Mozilla Firefox). Встать на паузу и пройтись пошагово в отладчике тоже можно.
С Firefox пока не пробовал смотреть. Надо глянуть, может, там есть что-то более подходящее.
Конкретно mutation в моём случае не подходит, так как для этого этот listener уже должен существовать. (Хотя, может, в Firefox можно свои добавлять с нуля... Но даже если так, это, скорее всего, будет не то; см. дальше.) Я нашёл рядом другой инструмент: DOM Breakpoints, это уже гораздо ближе к тому, что надо, но всё-таки тоже не совсем то, поскольку в нём приходится продираться через громадное количество шагов интерактивной отладки скриптов. И к тому же возникло подозрение, что в моём конкретном случае это ещё и сбивает воспроизводимость ситуации из-за отличающихся таймингов, искомый плейсхолдер просто не появляется совсем. Предполагаю, что пока я тыкаю этот злосчастный F8 тридцать раз, загрузка картинки где-то там уже успевает в фоне завершится, и движок вместо использования плейсхолдера, который я хочу спрятать, берёт и сразу подставляет готовую картинку. Если это так, то никакие Breakpoints не подойдут. Ну разве что я смогу случайно найти точку в коде, которая отвечает ровно за эту функциональность, но если бы я мог её сам найти, мне бы уже не нужна была вся эта возня.
Здравствуйте, CaptainFlint, Вы писали:
CF>Разные ситуации. Например, на IMDB регулярно само вылогинивает, а потом начинает задалбывать всплывашкой "а не хотите ли обратно залогиниться?", которая выскакивает как раз поверх рейтинга, закрывая его собой.
Этот просто скрывается. Вот его селектор:
Замени класс navbar__coachmark--hide, который его скрывает, на navbar__coachmark--fadeIn и элемент появится. Обычно такие элементы расположены либо внутри элемента на который они указывают или за ним.
Здравствуйте, rFLY, Вы писали:
CF>>Разные ситуации. Например, на IMDB регулярно само вылогинивает, а потом начинает задалбывать всплывашкой "а не хотите ли обратно залогиниться?", которая выскакивает как раз поверх рейтинга, закрывая его собой. FLY>Этот просто скрывается. Вот его селектор:
Этот — возможно. Но на Discord элемент именно уничтожается. Пару раз я успел тыкнуть по нему, пока светилась заглушка, и заметил, как она подсветилась в дереве элементов, и прежде чем я успел среагировать, удалилась, и вместо неё появился новый элемент с картинкой. Один раз даже заскриншотить успел, и на основе этого скрина написал-таки стиль. Но несколько дней назад они у себя что-то поменяли и стиль больше не работает, а каждый раз повторять эту гимнастику мне не хочется, хочется выяснить, есть ли более разумные способы ловли таких исчезающих элементов.
Здравствуйте, CaptainFlint, Вы писали:
CF>Конкретно mutation в моём случае не подходит, так как для этого этот listener уже должен существовать.
я вот тут