🧩 Plasmo Developers•16mo ago

How do I access the current website URL from Plasmo popup?

Hey all, I'm trying to access the active tab URL from Plasmo popup. I'm already using storage and I need to store the url to have the extension disabled for the current website. How would I get the website URL using Plasmo?

1 Reply

notdevkeyOP•16mo ago

just found the solution, for anyone wondering

const [currentTab, setCurrentTab] = useState("");

  useEffect(
    () =>
      chrome.tabs.query(
        {
          active: true,
          currentWindow: true,
        },
        function (tabs) {
          const tab = tabs[0];
          if (tab.url) {
            setCurrentTab(tab.url);
          }
        },
      ),
    [chrome],
  );

  return (
    <Switch
      className="data-[state=checked]:bg-green-500"
      checked={!settings.disabledHosts.includes(currentTab)}
      onCheckedChange={(isChecked) =>
        isChecked
          ? setSettings((prev) => ({
              ...prev,
              disabledHosts: settings.disabledHosts.filter(
                (host) => host !== currentTab,
              ),
            }))
          : setSettings((prev) => ({
              ...prev,
              disabledHosts: [...settings.disabledHosts, currentTab],
            }))
      }
    />
  )

const [currentTab, setCurrentTab] = useState("");

  useEffect(
    () =>
      chrome.tabs.query(
        {
          active: true,
          currentWindow: true,
        },
        function (tabs) {
          const tab = tabs[0];
          if (tab.url) {
            setCurrentTab(tab.url);
          }
        },
      ),
    [chrome],
  );

  return (
    <Switch
      className="data-[state=checked]:bg-green-500"
      checked={!settings.disabledHosts.includes(currentTab)}
      onCheckedChange={(isChecked) =>
        isChecked
          ? setSettings((prev) => ({
              ...prev,
              disabledHosts: settings.disabledHosts.filter(
                (host) => host !== currentTab,
              ),
            }))
          : setSettings((prev) => ({
              ...prev,
              disabledHosts: [...settings.disabledHosts, currentTab],
            }))
      }
    />
  )

and also add

"permissions": [
      "activeTab",
      "tabs"
    ],

"permissions": [
      "activeTab",
      "tabs"
    ],

to manifest in package.json this is a quick and ugly looking code, but it works RainbowRoach

Gaming

Programming

How do I access the current website URL from Plasmo popup?