Azerty Posts - Answer Overflow

Azerty

•Created by Azerty on 3/26/2025 in #🔰newbie

Get data from tab

I discover plasmo and extension dev, i wanted to know how to get a button and click it, get a specific text and write something in input field. I tried this for get button :

import React from 'react';

const Popup: React.FC = () => {

  const handleOpen = () => {
    chrome.tabs.create({ url: "https://www.example.com/", active:true, pinned:true}, (tab) => {
      chrome.scripting.executeScript({
        target: {tabId:tab.id},
        func: () => {
          const tag = document.querySelector("a");
          console.log(tag);
          console.log("test");
          
        }
      })
    });
  };

  return (
    <div style={{ padding: '20px' }}>
      <button onClick={handleOpen}>Open link</button>
    </div>
  );
};

export default Popup;

import React from 'react';

const Popup: React.FC = () => {

  const handleOpen = () => {
    chrome.tabs.create({ url: "https://www.example.com/", active:true, pinned:true}, (tab) => {
      chrome.scripting.executeScript({
        target: {tabId:tab.id},
        func: () => {
          const tag = document.querySelector("a");
          console.log(tag);
          console.log("test");
          
        }
      })
    });
  };

  return (
    <div style={{ padding: '20px' }}>
      <button onClick={handleOpen}>Open link</button>
    </div>
  );
};

export default Popup;

and my package.json :

"manifest": {
  "host_permissions": [
    "https://*/*"
  ],
  "permissions": [
    "scripting",
    "tabs",
    "webNavigation"
  ]
}

"manifest": {
  "host_permissions": [
    "https://*/*"
  ],
  "permissions": [
    "scripting",
    "tabs",
    "webNavigation"
  ]
}

but this don't work, nothing is printed in console

2 replies

Gaming

Programming