scripting.removeCSS()
Removes a CSS stylesheet injected by a call to scripting.insertCSS()
.
Note: This method is available in Manifest V3 or higher in Chrome and Firefox 101. In Safari and Firefox 102+, this method is also available in Manifest V2.
To use this API you must have the "scripting"
permission and permission for the page's URL, either explicitly as a host permission or using the activeTab permission.
This is an asynchronous function that returns a Promise
.
Syntax
js
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. Eithercss
orfiles
must be specified and must match the stylesheet inserted throughscripting.insertCSS()
. files
Optional-
array
ofstring
. The path of a CSS files to inject, relative to the extension's root directory. Eitherfiles
orcss
must be specified and must match the stylesheet inserted throughscripting.insertCSS()
. origin
Optional-
string
. The style origin for the injection, eitherUSER
orAUTHOR
. Defaults toAUTHOR
. Must match the origin of the stylesheet inserted throughscripting.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:
js
// 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
BCD tables only load in the browser
Note: This API is based on Chromium's chrome.scripting
API.