Chrome extension get element.data

Question

i have problem, because i cannot get element.data. Its always undefined, when i try to use it in extension, but when i paste the same code in console on youtube (developer mode) its working, In manifest version 2 i inject this code in content script but in version 3 its inpossible.

First: console.log(el) => works Second: console.log(el.data) => undefined

Manifest version 3 service_worker

function injectFc() {
  document.querySelectorAll('yt-live-chat-text-message-renderer:not([profile-link])').forEach(el => {
    console.log(el)
    console.log(el.data)
  })
}

setInterval(() => {
   let queryOptions = { active: true, currentWindow: true };
  chrome.tabs.query(queryOptions, (tb) => {
    var actTid = tb[0]
    chrome.scripting.executeScript(
    {
      target: {tabId: actTid.id, allFrames: true},
      func: injectFc,
    },
    () => {
        console.log(123);
    };
   });
}, 20000);

Add `world: 'MAIN'` to executeScript parameters. – wOxxOm Mar 20 '22 at 03:26 — wOxxOm, Mar 20 '22 at 03:26

score -1 · Answer 1 · answered Mar 19 '22 at 21:10

In Chrome extension manifest v3 you still use the content script. The content script allows you to set it to a specific domain, such as www.youtube.com. Please check you are using the correct matches.

manifest.json

{
  "name": "Inject Code",
  "action": {},
  "manifest_version": 3,
  "version": "0.1",
  "description": "Inject the code from content script",
  "content_scripts": [
    {
      "matches": ["https://www.youtube.com/*"],
      "js": ["main.js"],
      "run_at": "document_end",
      "all_frames": true
    }
  ],
  "permissions": ["activeTab"],
  "host_permissions": ["https://www.youtube.com"]
}

main.js

console.log("start the script");

function injectFc() {
  console.log("run injectFc");
  document.querySelectorAll('yt-live-chat-text-message-renderer:not([profile-link])').forEach(el => {
    console.log(el);
    console.log(JSON.stringify(el.data));
  })
}

window.setInterval(function () { injectFc(); }, 20000);

To collect the Live stream messages please check the official Live Streaming API.

Chrome extension get element.data

1 Answers1