Cannot use the chrome.action API inside React components

84 views
Skip to first unread message

Hristiyan Maverov

unread,
Sep 1, 2023, 6:20:12 PM9/1/23
to Chromium Extensions
Hi everyone, I am trying to use the chrome.action API to set the badge text of my Chrome extension but I am getting this error:

Cannot read properties of undefined (reading 'setBadgeText')

For some reason, the API is not accessible from React. This is my code:

import { useState, useEffect } from 'react';
import viteLogo from '/vite.svg';
import './App.css';

function App() {
  const [count, setCount] = useState(0);

  useEffect(() => {
    // Use the chrome.action API here, e.g., to set badge text
    chrome.action.setBadgeText({ text: '0' });
  }, []);

  return (
    <>
//...
    </>
  );
}

export default App;

Reply all
Reply to author
Forward
0 new messages