Files
webextensions-examples/apply-css
Aad Versteden 4cddd8497c Use URL interface in apply-css example
By using the URL interface, the user is ascertained that the piece of
code does not manipulate the DOM.  Keeping them in the right mental
context for the example.

The apply-css example uses the protocol of the URL of the tab to
determine if a pageAction should be shown.  Any page that is hosted
over http or https will receive the page action.

The former implementation creates an anchor tag, assigns the URL to
that, and fetches the protocol from there.  This PR alters that to
using the URL interface.  This makes it clear to the user that we're
staying in JavaScript land and will not start manipulating the visible
DOM.  I would argue this is cleaner all together, but I'm very open to
learning about a different opinion.

The URL interface is more broadly supported than the
pageAction.setIcon which this example is also dependent on, so this
change should not change compatibility of this Browser Extension.
2020-12-31 10:36:57 +01:00
..

apply-css

This add-on injects CSS into web pages. The addons.mozilla.org domain disallows this operation, so this add-on will not work properly when it's run on pages in the addons.mozilla.org domain.

What it does

This extension includes:

  • a background script, "background.js"
  • a page action

It adds the page action to every tab the user opens. Clicking the page action for a tab applies some CSS using tabs.insertCSS.

Clicking again removes the CSS using tabs.removeCSS.

What it shows

  • some basic page action functions
  • how to apply and remove CSS.