scripting.removeCSS()

Syntax

await browser.scripting.removeCSS(
  details       // object
)

Parameters

details

An object describing the CSS to remove and where to remove it from. It contains the following properties:

css Optional

string. A string containing the CSS to inject. Either css or files must be specified and must match the stylesheet inserted through scripting.insertCSS().

files Optional

array of string. The path of a CSS files to inject, relative to the extension's root directory. Either files or css must be specified and must match the stylesheet inserted through scripting.insertCSS().

origin Optional

string. The style origin for the injection, either USER or AUTHOR. Defaults to AUTHOR. Must match the origin of the stylesheet inserted through scripting.insertCSS().

target

scripting.InjectionTarget. Details specifying the target to remove the CSS from.

Return value

A Promise that fulfills with no arguments when all the CSS is removed. If any error occurs, the promise is rejected. Attempts to remove non-existent stylesheets are ignored.

Examples

This example adds some CSS using scripting.insertCSS, then removes it again when the user clicks a browser action:

// Assuming some style has been injected previously with the following code:
//
// await browser.scripting.insertCSS({
//   target: {
//     tabId: tab.id,
//   },
//   css: "* { background: #c0ffee }",
// });
//
// We can remove it when a user clicked an extension button like this:
browser.action.onClicked.addListener(async (tab) => {
  try {
    await browser.scripting.removeCSS({
      target: {
        tabId: tab.id,
      },
      css: "* { background: #c0ffee }",
    });
  } catch (err) {
    console.error(`failed to remove CSS: ${err}`);
  }
});

Browser compatibility