action.js

The script to execute when the action button of the extension is clicked.

app/action.jsx

import { createRoot } from 'react-dom/client';
    
const root = document.createElement('div');

function Action() {
  return '...';
}

document.body.appendChild(root);

createRoot(root).render(<Action />);

Exports

The script exports meta object which contains the metadata like page title and description.

app/action.js

export const meta = {
  title: '...',
  viewport: '...',
  description: '...',
};

Custom Icon

By default the action icon will use the extension icon. But if you want to set custom for action icon, please use app/action-icon.(svg|png|jpg).

Custom HTML

The app/action.html overrides the default HTML template for action.

app/action.html

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <script src="https://cdn.tailwindcss.com"></script>
</head>

<body></body>

</html>