Сценарий содержимого расширения Chrome не может запрашивать элементы внутри теневого DOM на стороннем сайте. ⇐ Html

[Anonymous]

Я создаю расширение Chrome (Manifest V3), которое внедряет скрипт содержимого в https://gradeplanner.osu.edu. Сценарий содержимого должен прочитать информацию о курсе из DOM страницы.
Сценарий содержимого загружается успешно (я вижу свой console.warn в консоли) и могу определить код курса по URL-адресу. Однако я не могу запросить ни один из элементов DOM страницы, поскольку они находятся внутри теневого DOM.
Когда я проверяю элементы в DevTools, я вижу их с их атрибутами data-testid:

Introduction to American Politics
POLITSC 1100

Jiwoo Bae


Но document.querySelector('[data-testid="course-sidebar-name"]') возвращает значение null как из сценария содержимого, так и из консоли DevTools (когда установлено значение «верхний» контекст).
Я попробовал написать рекурсивную функцию для обхода теневых корней:
function deepQuerySelector(selector) {
const result = document.querySelector(selector);
if (result) return result;

const allElements = document.querySelectorAll("*");
for (const el of allElements) {
if (el.shadowRoot) {
const found = el.shadowRoot.querySelector(selector);
if (found) return found;
}
}
return null;
}

Это также возвращает значение null.
Мои вопросы:

• Есть ли способ для сценария содержимого расширения Chrome получить доступ к элементам внутри закрытой теневой модели DOM?
• Если нет, то какие альтернативные подходы я могу использовать? (перехват сетевых запросов, использование MutationObserver на более высоком уровне или внедрение сценария в основной мир страницы?)

Манифест (соответствующие части):
{
"manifest_version": 3,
"content_scripts": [
{
"matches": ["https://degreeplanner.osu.edu/*"],
"js": ["src/content/index.ts"],
"run_at": "document_idle",
"all_frames": true
}
],
"host_permissions": ["https://degreeplanner.osu.edu/*"]
}


Подробнее здесь: https://stackoverflow.com/questions/798 ... m-on-third