Read content of a page and show it in popup (Hi I am new)

It has been a while since I was able to program a Firefox extension. Now that I can find some time, I try to write an extension that can read the content of a page.

I started with the tutorial from Mozilla, with the manifest.json like this:

{
    "browser_action": {
    "browser_style": true,
    "default_icon": {
      "16": "button/bot-16.png",
      "32": "button/bot-32.png"
    },
    "default_title": "Whereami?",
    "default_popup": "popup/config.html"
  },
    "manifest_version": 2,
  "name": "domain",
  "version": "1.0",
  "description": "Adds a red border to all webpages matching mozilla.org.",
  "icons": {
    "48": "icons/bot-48.png"
  },
  "background": {
    "scripts": ["background.js"]
  },
  "content_scripts": [
    {
      "matches": [
        "*://*.domain.nl/*"
      ],
      "js": [
        "javascript.js"
      ]
    }
  ]
}

In this extension I have a popup/config.html file (like this)

<!doctype html>
<html lang="en">
<head>
    <link rel="stylesheet" href="/css/style.css">
</head>
<body>
<div class="menu">
    <h4>Current name</h4>
    <p id="current-name">{{ current name }} </p>
    <button>aaa</button>
</div>
</body>
</html>

afbeelding

I am fairly new to writing javascript for firefox extensions, but is it easy to read an element on a page (which is updated every x seconds) and show it in a popup?

Judging from the following page, no, a script cannot open a toolbar button’s popup automatically without a user action such as a click.

This could be why most extensions tend to send a message from the content script to the background script, and the background script would set or update a badge on the button (typically, these are numbers) to alert you that something interesting is available if you click.

Not sure whether that helps with your use case. If you really need to get the user’s attention, you could send a desktop notification.