Задать вопрос

Как с помощью девтулзов определить что меняет текст HTML элемента?

Допустим у нас есть страница на гитхабе:
https://github.com/nulldg/DiscordChatExporterPlus/...

На ней есть окошко с кодом. Первая строка этого кода:
using System;

Я хочу с помощью девтулзов так поменять HTML текст страницы что бы на экране вместо строки
using System;
отображалась строка
using MySystem;

Казалось бы, задача простая: нужно выделить текст using System;, нажать ПКМ -> Inspect, найти этот текст в инспекторе и поменять на желаемый.

Я открываю инспектор и у меня автоматически выделяется элемент textarea в котором находится нужный мне текст. Я нахожу строку using System;, меняю её на using MySystem;, однако на экране не происходит никаких изменений. При клике в рабочую область браузера только что изменённый текст откатывается обратно до using System;.

Ладно, видимо в этом textarea текст не хранится, а только показывается. Разработчики где то сохранили текст using System; и постоянно синхронизируют текст HTML элемента textarea с этим сохранённым текстом.

Я попробовал нажать CTRL+F в инспекторе, найти все вхождения using System; (их там 2) и заменить их на using MySystem;. Результат тот-же: визуальных изменений нет, а при клике в рабочую область браузера изменения мнгновенно откатываются.

Хорошо, давайте попробуем определить что именно "синхронизирует" текст в textarea с изначальным текстом. Если я смогу найти строку JS кода которая устанавливает текст в textarea то я смогу пройтись по этому коду вверх и понять где хранится "source of truth" кода. Я нажимаю на элементе textarea ПКМ -> Break On, выбираю все пункты (subtree modification, attribute modification, node removal) и снова провожу описанные процедуры. Текст в textarea снова сбрасывается до изначального, однако никакого break не происходит.

Как мне понять где хранится "source of truth" этого текста? У меня уже нет идей.
  • Вопрос задан
  • 322 просмотра
Подписаться 3 Простой 1 комментарий
Пригласить эксперта
Ответы на вопрос 1
@its2easyy
Если в инспекторе удалить textarea, то можно увидеть что блок с кодом со страницы не пропал. Если это повторить ещё несколько раз, каждый раз тыкая в то место, где визуально находиться элемент, то можно дойти до .react-code-lines где и лежат блоки с текстом. А через поиск они не находятся, потому что они не идут одной непрерывной строкой
670e7aa26dea8421875672.png
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы