{"id":9076,"date":"2022-11-17T03:46:31","date_gmt":"2022-11-17T11:46:31","guid":{"rendered":"https:\/\/blog.mozilla.org\/addons\/?p=9076"},"modified":"2023-07-05T12:18:18","modified_gmt":"2023-07-05T19:18:18","slug":"unified-extensions-button-and-how-to-handle-permissions-in-manifest-v3","status":"publish","type":"post","link":"https:\/\/blog.mozilla.org\/addons\/2022\/11\/17\/unified-extensions-button-and-how-to-handle-permissions-in-manifest-v3\/","title":{"rendered":"Extensions button and how to handle permissions in Manifest V3"},"content":{"rendered":"

Manifest V3 (MV3) is bringing new user-facing changes to Firefox, including an extensions button to manage installed and enabled browser extension permissions (origin controls), providing Firefox users control over extension access to their browsers. The first building blocks of this button were added to Nightly in Firefox 107 and will become available with the general release of MV3 in Firefox 109.<\/p>\n

Extensions button<\/h2>\n
\"\"<\/a>

The extensions button will give Firefox users direct control over website specific extension permissions.<\/p><\/div>\n

In MV2, host permissions are granted by the user at the time of install and there\u2019s no elegant way for the user to change this setting (short of uninstalling\/reinstalling and choosing different permissions). But with the new extensions button in MV3 in Firefox, users will have easy access and persistent control over which extensions can access any web page, at any time. Users are free to grant ongoing access to a website, or make a choice per visit. To enable this, MV3 treats host permissions (listed in the extension manifest) as opt-in.<\/p>\n

The button panel will display the user\u2019s installed and enabled extensions and their current permission state. In addition to managing host permissions, the panel also allows the user to manage, remove, or report the extension. Extensions with browser actions will behave similarly in the toolbar as in the panel.<\/p>\n

Manifest V2 (MV2) extensions will also display in the panel; however users can\u2019t take actions for MV2 host permissions since those were granted at installation and this choice cannot be reversed in MV2 without uninstalling the extension and starting again.<\/p>\n

You can also find more information about the extensions button from support.mozilla.org<\/a><\/p>\n

How to deal with opt-in permissions in extension code<\/h2>\n

The Permissions API<\/a> provides a way for developers to read and request permissions.<\/p>\n

With permissions.request()<\/a>, you can request specific permissions that have been defined as optional permissions in the manifest:<\/p>\n

const permissionsToRequest = {\r\n  permissions: [\"bookmarks\", \"history\"],\r\n  origins: [\"https:\/\/developer.mozilla.org\/\"]\r\n}\r\n\r\nasync function requestPermissions() {\r\n  function onResponse(response) {\r\n    if (response) {\r\n      console.log(\"Permission was granted\");\r\n    } else {\r\n      console.log(\"Permission was refused\");\r\n    }\r\n\r\n    return browser.permissions.getAll();\r\n  }\r\n\r\n  const response = await browser.permissions.request(permissionsToRequest);\r\n  const currentPermissions = await onResponse(response);\r\n\r\n  console.log(`Current permissions:`, currentPermissions);\r\n}<\/code><\/pre>\n
This is handy when the request for permissions is tied to a user action<\/a> like selecting a context menu item. Note that you cannot request for a permission that is not defined in the manifest.<\/p>\n
Other times, you\u2019ll want to react to a permission being granted or removed. This can be done with permissions.onAdded<\/a> and permissions.onRemoved<\/a> respectively.<\/p>\n
\r\nfunction handleAdded(permissions) {\r\n  console.log(`New API permissions: ${permissions.permissions}`);\r\n  console.log(`New host permissions: ${permissions.origins}`);\r\n}\r\n\r\nbrowser.permissions.onAdded.addListener(handleAdded);\r\n<\/code><\/pre>\n
Finally, you can check for already existing permissions in two different ways: permissions.getAll()<\/a> returns a list of all granted permissions and permissions.contains(permissionsToCheck)<\/a> checks for specific permissions and resolves to true if, and only if, all checked permissions are granted.<\/p>\n
\r\n\/\/ Extension permissions are:\r\n\/\/ \"webRequest\", \"tabs\", \"*:\/\/*.mozilla.org\/*\"\r\n\r\nlet testPermissions1 = {\r\n  origins: [\"*:\/\/mozilla.org\/\"],\r\n  permissions: [\"tabs\"]\r\n};\r\n\r\nconst testResult1 = await browser.permissions.contains(testPermissions1);\r\nconsole.log(testResult1); \/\/ true\r\n\r\n<\/code><\/pre>\n
We always encourage feedback from our developer community, so don\u2019t hesitate to get in touch:<\/code><\/p>\n