Opera Extensions

https://help.opera.com/en/extensions
Admin
Opera Extensions are small code packages that extend browser functionality, allowing developers to...
Tokens:48,738
Snippets:424
Trust Score:10
Update:10 months ago
Show doc for...
Tokens:
Raw
### Install Opera Extension using installExtension

Source: https://help.opera.com/en/extensions/addons-api

The `installExtension` method initiates the installation of an Opera extension. It requires the extension's ID and provides callbacks for success and error handling. The success callback is invoked without arguments upon successful installation, while the error callback receives an error message string if the installation fails.

```javascript
opr.addons.installExtension(
	"extension_id",
	function() { /* success */ },
	function(errorMessage) { /* error */ }
);
```

--------------------------------

### Install Extension

Source: https://help.opera.com/en/extensions/addons-api

Installs an extension using its ID and provides callbacks for success and error.

```APIDOC
## installExtension

### Description
Installs an extension using its ID and provides callbacks for success and error.

### Method
JavaScript API

### Endpoint
N/A (Client-side API)

### Parameters
#### Path Parameters
None

#### Query Parameters
None

#### Request Body
None

### Request Example
```javascript
// Example usage:
opr.addons.installExtension(
	"extension_id",
	function() {
		console.log("Extension installed successfully!");
	},
	function(errorMessage) {
		console.error("Error installing extension: " + errorMessage);
	}
);
```

### Response
#### Success Response (Callback)
The `success_callback` function is called upon successful installation.

#### Response Example
```javascript
function() {
  // Code to execute on success
}
```

#### Error Response (Callback)
The `error_callback` function is called upon installation failure, receiving an error message.

#### Response Example
```javascript
function(errorMessage) {
  // Code to execute on error
  console.log("Error: " + errorMessage);
}
```
```

--------------------------------

### Search Existing Downloads with Downloads API

Source: https://help.opera.com/en/extensions/downloads

Searches existing downloads using the `chrome.downloads.search()` function with various criteria. This example demonstrates how to retrieve the last 5 downloads in descending order by start time and log their filenames. Other search criteria like URL, filename, and file size are also supported.

```javascript
chrome.downloads.search({
	orderBy: ['-startTime'],
	limit: 5
}, function (downloadedItem) {
	for (var i =0; i < downloadedItem.length; i++){
		console.log('URL is: ' + downloadedItem[i].filename);
	}
});
```

--------------------------------

### Starting a New Download

Source: https://help.opera.com/en/extensions/downloads

Initiate a new download using the `chrome.downloads.download()` function. You can specify the URL, filename, and whether to prompt the user with a 'Save As' dialog.

```APIDOC
## Starting a New Download

### Description
The `download()` function initiates a new download. It accepts an options object and an optional callback function that receives the download ID.

### Method
`chrome.downloads.download(options, callback)`

### Parameters
#### Request Body
- **options** (object) - Configuration for the download.
  - **url** (string) - The URL of the file to download.
  - **filename** (string, optional) - The desired filename for the downloaded file.
  - **saveAs** (boolean, optional) - If true, prompts the user with a 'Save As' dialog. Defaults to false.

#### Callback Function
- **callback** (function, optional) - A function to be called after the download is initiated.
  - **downloadId** (integer) - The ID of the initiated download. Returns `undefined` if an error occurred.

### Request Example
```javascript
chrome.downloads.download({
  url: 'http://example.org/example.zip',
  filename: 'download.zip',
  saveAs: true
}, function(downloadId) {
  if (typeof downloadId !== 'undefined') {
    console.log('Download initiated, ID is: ' + downloadId);
  } else {
    console.log('Error initiating download.');
  }
});
```
```

--------------------------------

### Invalid Match Pattern Examples

Source: https://help.opera.com/en/extensions/match-patterns

Highlights common mistakes and invalid formats when constructing match patterns, explaining why each example is incorrect according to the defined syntax rules.

```plaintext
http://www.google.com
http://*foo/bar
http://foo.*.bar/baz
http:/bar
foo://*

```

--------------------------------

### Include Local Script in HTML

Source: https://help.opera.com/en/extensions/architecture-overview

This example demonstrates how to properly reference a locally stored JavaScript file within an HTML page, such as a popup. This is the recommended approach to avoid issues with inline JavaScript and externally hosted scripts.

```html
<script src="scripts/jquery-1.9.1.min.js"></script>
```

--------------------------------

### Match Pattern Examples

Source: https://help.opera.com/en/extensions/match-patterns

Illustrates various valid match patterns and explains what types of URLs they will match, covering different schemes, host variations, and path specifications. This includes special patterns like '<all_urls>'.

```plaintext
http://*/*
http://*/foo*
https://*.google.com/foo*bar
http://example.org/foo/bar.html
file:///foo*
http://127.0.0.1/*
*://mail.google.com/*
chrome-extension://*/*
<all_urls>

```

--------------------------------

### Define Opera Extension Manifest (JSON)

Source: https://help.opera.com/en/extensions/basics

The manifest.json file defines the extension's metadata, version, background scripts, permissions, and browser action. It's crucial for the extension's core functionality and browser integration. This example specifies permissions for 'tabs' and configures a browser action with an icon and title.

```json
{
	"manifest_version": 2,

	"name": "Opera Extensions — Getting Started",
	"description": "Sample extension for the “Making your first extension” article",
	"version": "1.0",
	"background": {
		"scripts": ["background.js"]
	},

	"permissions": ["tabs"],
	"browser_action": {
		"default_icon": "icon.png",
		"default_title": "Go to help.Opera!"
	}
}
```

--------------------------------

### Creating a Context Menu Item

Source: https://help.opera.com/en/extensions/context-menus

This example demonstrates how to create a new context menu item using the `chrome.contextMenus.create()` function, specifying its title, contexts, and click handler.

```APIDOC
## Creating a Context Menu Item

### Description
Creates a context menu item that appears when text is selected and triggers a search on Google in a new tab when clicked.

### Method
`chrome.contextMenus.create()`

### Endpoint
`background.js` (or relevant script)

### Parameters
#### Request Body
- **title** (string) - Required - The text displayed for the menu item. `%s` is a placeholder for selected text.
- **contexts** (array of strings) - Required - Specifies the conditions under which the menu item appears. Can include 'selection', 'image', 'video', 'page', 'link', 'editable', 'all', etc.
- **onclick** (function) - Required - The function to execute when the menu item is clicked.

### Request Example
```javascript
chrome.contextMenus.create({
	title: 'Look up: %s',
	contexts: ['selection'],
	onclick: searchText
});
```

### Response
#### Success Response (200)
N/A (This is an API call to create a menu item, not a request/response)

#### Response Example
N/A
```

--------------------------------

### Define Custom Command Shortcut in Manifest

Source: https://help.opera.com/en/extensions/commands

This JSON example demonstrates defining a custom command named 'test' in the manifest.json file. It includes a suggested key for both default and Mac platforms, along with a descriptive string for the command's purpose.

```json
'commands': {
	'test': {
		'suggested_key': {
			'default': 'Ctrl+Shift+J',
			'mac': 'Command+Shift+J'
		},
		'description': 'Test alert function'
	}
}
```

--------------------------------

### Monitor Download State Changes with Downloads API

Source: https://help.opera.com/en/extensions/downloads

Uses the `onChanged` event from the Downloads API to monitor download progress and state changes. This example specifically checks if a download has completed and logs a message indicating the completion of a download by its ID.

```javascript
chrome.downloads.onChanged.addListener(function (e) {
	if (typeof e.state !== 'undefined') {
		if (e.state.current === 'complete') {
			console.log('Download ID ' + e.id + ' has completed');
		}
	}
});
```

--------------------------------

### Opera Extension Manifest Structure (JSON)

Source: https://help.opera.com/en/extensions/manifest

This JSON snippet illustrates the general structure of the manifest.json file for Opera extensions. It includes examples of required, recommended, and optional fields. The manifest version is critical for compatibility.

```json
{
	"name": "My Extension",
	"version": "versionString",
	"manifest_version": 2,

	"description": "A plain text description",
	"developer": { ... },
	"icons": { ... },
	"default_locale": "en",

	"browser_action": { ... },
	"page_action": { ... },

	"background": { "persistent": false, ... },
	"background": { "persistent": true, ... },
	"content_scripts": [ ... ],
	"content_security_policy": "policyString",
	"homepage_url": "http://path/to/homepage",
	"incognito": "spanning", // or "split"
	"key": "publicKey",
	"minimum_opera_version": "versionString",
	"options_page": "aFile.html",
	"permissions": [ ... ],
	"requirements": { ... },
	"update_url": "http://path/to/updateInfo.xml",
	"web_accessible_resources": [ ... ],
	"sandbox": [ ... ]
}
```

--------------------------------

### Programmatic Injection Permissions (JSON)

Source: https://help.opera.com/en/extensions/content-scripts

This example shows how to use the `permissions` field in the extension manifest to enable programmatic injection of code into web pages. This approach is used when code injection should not occur automatically but rather be triggered by specific events or user actions.

```json
{
	"name": "My extension",
	"permissions": [
		"tabs", "http://www.google.com/*"
	]
}
```

--------------------------------

### Configure Sidebar Action in Manifest

Source: https://help.opera.com/en/extensions/sidebar-action-manual

Defines the basic configuration for a sidebar action in the extension's manifest file, including the default icon, tooltip title, and the panel HTML file. This is a required setup for any sidebar extension.

```json
{
	"sidebar_action": {
		"default_icon": "icon.png",
		"default_title": "My Sample Extension",
		"default_panel": "panel.html"
	}
}
```

--------------------------------

### Securely Scheduling Function Execution in Content Scripts

Source: https://help.opera.com/en/extensions/content-scripts

This example demonstrates the secure method for scheduling function execution using `window.setTimeout` within a content script. It highlights the risk of using string literals for timeouts, which can lead to script injection, and promotes the use of a closure function as a safer alternative.

```javascript
_// contentscript.js_
var elmt_id = …
_// WARNING! elmt_id might be '); … evil script … '!
window.setTimeout('animate(' + elmt_id + ')', 200);

_// contentscript.js_
var elmt_id = …
_// The closure form of setTimeout does not evaluate scripts_
window.setTimeout(function() {
	animate(elmt_id);
}, 200);

```

--------------------------------

### Set Opera Setting Value with Control Check (JavaScript)

Source: https://help.opera.com/en/extensions/privacy

This example shows how to change an Opera setting, like autofillEnabled, ensuring your extension has control over it. It first uses `get()` to check `levelOfControl` and then calls `set()` only if the extension is controllable. It includes error handling for the `set()` operation.

```javascript
chrome.privacy.services.autofillEnabled.get({}, function(details) {
	if (details.levelOfControl === 'controllable_by_this_extension') {
		chrome.privacy.services.autofillEnabled.set({ value: true }, function() {
			if (chrome.runtime.lastError === undefined) {
				console.log('Hooray, it worked!');
			} else {
				console.log('Sadness!', chrome.runtime.lastError);
			}
		});
	}
});
```

--------------------------------

### Opera Extension Background Script (JavaScript)

Source: https://help.opera.com/en/extensions/basics

The background.js script handles browser interactions, such as responding to user actions. This example uses the Chrome Extension APIs (compatible with Opera) to listen for clicks on the browser action button. Upon click, it opens a new tab with a specified URL.

```javascript
chrome.browserAction.onClicked.addListener(function() {
	chrome.tabs.query({
		currentWindow: true,
		active: true
	}, function(tab) {
		chrome.tabs.create({
			"url": "http://help.opera.com"
		});
	});
});
```

--------------------------------

### Declare Options Page in Manifest

Source: https://help.opera.com/en/extensions/architecture-overview

This JSON snippet shows how to specify an options page for your extension in the manifest file. This provides users with a dedicated page to manage extension preferences.

```json
"options_page": "options_page.html"
```

--------------------------------

### Initiate a Download with Downloads API

Source: https://help.opera.com/en/extensions/downloads

Initiates a new download using the `chrome.downloads.download()` function. The basic usage requires a URL. More options like `filename`, `saveAs`, and a callback function can be provided for advanced control and error handling.

```javascript
chrome.downloads.download({
	url: 'http://example.org/example.zip'
});
```

```javascript
chrome.downloads.download({
	url: 'http://example.org/example.zip',
	filename: 'download.zip',
	saveAs: true
}, function(downloadId) {
	// If 'downloadId' is undefined, then there is an error
	// so making sure it is not so before proceeding.
	if (typeof downloadId !== 'undefined') {
		console.log('Download initiated, ID is: ' + downloadId);
	}
});
```

--------------------------------

### Getting Privacy Setting Values

Source: https://help.opera.com/en/extensions/privacy

You can retrieve the current value of a privacy setting and your extension's level of control using the `get()` method.

```APIDOC
## Usage - Getting a Setting
Reading the current value of an Opera setting is straightforward. You’ll first need to find the property you’re interested in, then you’ll call `get()` on that object in order to retrieve its current value and your extension’s level of control. For example, to determine if the browser’s autofill feature is enabled, you’d write:
```javascript
chrome.privacy.services.autofillEnabled.get({}, function(details) {
	if (details.value) {
		console.log('Autofill is on!');
	} else {
		console.log('Autofill is off!');
	}
});
```
```

--------------------------------

### Manifest File Configuration for Commands API

Source: https://help.opera.com/en/extensions/commands

This section details how to declare commands and their suggested keyboard shortcuts within the extension's manifest file.

```APIDOC
## Manifest File Configuration for Commands API

### Description
Configure keyboard shortcuts and custom commands within your extension's `manifest.json` file.

### Method
Manifest File Declaration

### Endpoint
N/A

### Parameters
#### Path Parameters
N/A

#### Query Parameters
N/A

#### Request Body
```json
{
  "commands": {
    "_execute_browser_action": {
      "suggested_key": {
        "windows": "Ctrl+Shift+Y",
        "mac": "Command+Shift+Y"
      }
    },
    "_execute_page_action": {
      "suggested_key": {
        "default": "Ctrl+Shift+X",
        "mac": "Command+Shift+X"
      }
    },
    "your_custom_command": {
      "suggested_key": {
        "default": "Ctrl+Shift+J",
        "mac": "Command+Shift+J"
      },
      "description": "Optional description for your command"
    }
  }
}
```

### Request Example
N/A

### Response
#### Success Response (200)
N/A

#### Response Example
N/A
```

--------------------------------

### Native Messaging

Source: https://help.opera.com/en/extensions/message-passing

Enables communication between extensions and native applications installed on the user's system.

```APIDOC
## Native Messaging

### Description
Extensions can exchange messages with native applications. This requires a native messaging host registered by the application.

### Extension Manifest Permission
Declare `nativeMessaging` permission in `manifest.json`.

```json
"permissions": [ "nativeMessaging" ]
```

### Native Messaging Host Manifest
An application must provide a manifest file to define the native messaging host.

#### Example Manifest File
```json
{
  "name": "com.my_company.my_application",
  "description": "My Application",
  "path": "C:\\Program Files\\My Application\\chrome_native_messaging_host.exe",
  "type": "stdio",
  "allowed_origins": [
    "chrome-extension://knldjmfmopnpolahpmmgbagdohdnhkik/"
  ]
}
```

#### Manifest Fields
- **name** (string) - Required - Name of the native messaging host.
- **description** (string) - Optional - Short application description.
- **path** (string) - Required - Path to the native messaging host binary.
- **type** (string) - Required - Communication interface type, usually `stdio`.
- **allowed_origins** (array of strings) - Required - List of extensions permitted to access the host.

### Host Manifest Location
- **Windows:** Registry key `HKEY_LOCAL_MACHINE\SOFTWARE\Google\Chrome\NativeMessagingHosts\<name>` points to the manifest file.
- **OSX:** `~/Library/Application Support/Google/Chrome/NativeMessagingHosts/`
- **Linux:** `/etc/opt/chrome/native-messaging-hosts/`

### Communication Protocol
Messages are serialized using JSON, UTF-8 encoded, and preceded by a 32-bit message length in native byte order.

### API Usage
- **Extension:** Use `runtime.connectNative` or `runtime.sendNativeMessage`.
- **Native Host:** Communicates via `stdin` and `stdout`.
```

--------------------------------

### Sidebar Action: Get Panel

Source: https://help.opera.com/en/extensions/sidebar-action-api

Retrieves the HTML document currently set as the panel for the sidebar action.

```APIDOC
## GET /sidebarAction/getPanel

### Description
Gets the HTML document set as the panel for this sidebar action.

### Method
GET

### Endpoint
/sidebarAction/getPanel

### Parameters
#### Path Parameters
- None

#### Query Parameters
- **details** (object) - Optional - Specifies the tab to get the panel from. If no tab is specified, the non-tab-specific panel is returned.
  - **tabId** (integer) - Optional - The ID of the tab.

#### Request Body
- None

### Request Example
```json
{
  "tabId": 12345
}
```

### Response
#### Success Response (200)
- **result** (string) - The HTML document path set as the panel.

#### Response Example
```json
{
  "result": "/panels/my_panel.html"
}
```
```

--------------------------------

### Sidebar Action: Get Badge Text

Source: https://help.opera.com/en/extensions/sidebar-action-api

Retrieves the current badge text displayed on the sidebar action icon.

```APIDOC
## GET /sidebarAction/getBadgeText

### Description
Gets the badge text of the sidebar action. If no tab is specified, the non-tab-specific badge text is returned.

### Method
GET

### Endpoint
/sidebarAction/getBadgeText

### Parameters
#### Path Parameters
- None

#### Query Parameters
- **details** (object) - Optional - Specifies the tab to get the badge text from. If no tab is specified, the non-tab-specific badge text is returned.
  - **tabId** (integer) - Optional - The ID of the tab.

#### Request Body
- None

### Request Example
```json
{
  "tabId": 12345
}
```

### Response
#### Success Response (200)
- **result** (string) - The current badge text.

#### Response Example
```json
{
  "result": "NEW"
}
```
```

--------------------------------

### Sidebar Action: Get Badge Background Color

Source: https://help.opera.com/en/extensions/sidebar-action-api

Retrieves the current background color of the sidebar action's badge.

```APIDOC
## GET /sidebarAction/getBadgeBackgroundColor

### Description
Gets the background color of the sidebar action.

### Method
GET

### Endpoint
/sidebarAction/getBadgeBackgroundColor

### Parameters
#### Path Parameters
- None

#### Query Parameters
- **details** (object) - Optional - Specifies the tab to get the badge background color from. If no tab is specified, the non-tab-specific badge background color is returned.
  - **tabId** (integer) - Optional - The ID of the tab.

#### Request Body
- None

### Request Example
```json
{
  "tabId": 12345
}
```

### Response
#### Success Response (200)
- **result** (ColorArray) - The background color of the badge.

#### Response Example
```json
{
  "result": [255, 0, 0, 255]
}
```
```

--------------------------------

### Sidebar Action: Get Title

Source: https://help.opera.com/en/extensions/sidebar-action-api

Retrieves the title of the sidebar action. This title is displayed to the user in the extension's UI.

```APIDOC
## GET /sidebarAction/getTitle

### Description
Gets the title of the sidebar action.

### Method
GET

### Endpoint
/sidebarAction/getTitle

### Parameters
#### Path Parameters
- None

#### Query Parameters
- **details** (object) - Optional - Specifies the tab to get the title from. If no tab is specified, the non-tab-specific title is returned.
  - **tabId** (integer) - Optional - The ID of the tab.

#### Request Body
- None

### Request Example
```json
{
  "tabId": 12345
}
```

### Response
#### Success Response (200)
- **result** (string) - The title of the sidebar action.

#### Response Example
```json
{
  "result": "My Extension Title"
}
```
```

--------------------------------

### WebNavigation API - Transition Types and Qualifiers

Source: https://help.opera.com/en/extensions/web-navigation

Describes the `transitionType` and `transitionQualifiers` properties of the `onCommitted` event, which provide details about how a navigation was initiated.

```APIDOC
## Transition Types and Qualifiers

The `onCommitted` event in the `webNavigation` API includes `transitionType` and `transitionQualifiers` properties. These properties describe the nature of the navigation, similar to the History API.

**Transition Qualifiers:**
Several qualifiers can be returned to further define the navigation:

*   **`client_redirect`**: Indicates one or more redirects occurred due to client-side actions like JavaScript or meta refresh tags.
*   **`server_redirect`**: Indicates one or more redirects were caused by server-side HTTP headers.
*   **`forward_back`**: Signifies that the user employed the browser's Forward or Back buttons to initiate the navigation.
*   **`from_address_bar`**: Denotes that the user typed the URL directly into the address bar or initiated the navigation from there.
```

--------------------------------

### Define Background Page in Manifest

Source: https://help.opera.com/en/extensions/architecture-overview

This JSON snippet shows how to declare a background page script in the extension's manifest file. The browser automatically generates the corresponding page for the specified JavaScript file.

```json
"background": {
	"scripts": ["background.js"]
}
```

--------------------------------

### WebNavigation API vs. WebRequest API

Source: https://help.opera.com/en/extensions/web-navigation

Clarifies the relationship and differences between WebNavigation and WebRequest events, particularly concerning ordering and user visibility.

```APIDOC
## Relation to `webRequest` Events

There is no guaranteed ordering between events from the `webRequest` API and the `webNavigation` API. It's possible for `webRequest` events to be received for frames that have already begun a new navigation, or for a navigation to proceed only after network resources have finished loading.

Generally, `webNavigation` events reflect the navigation state visible in the browser's UI, while `webRequest` events correspond to the state of the network stack, which is typically hidden from the user.
```

--------------------------------

### messages.json for Spanish Locale

Source: https://help.opera.com/en/extensions/internationalization

An example of a `messages.json` file for the Spanish locale (`es`). It defines key-value pairs for translated strings, where the key is a message name and the value contains the translated message.

```json
{
	"extensionName": {
		"message": "Hola Mundo!"
	},
	"extensionDescription":{
		"message": "Esta es una extensión de la muestra."
	}
}

```

--------------------------------

### Define `_execute_browser_action` Shortcut in Manifest

Source: https://help.opera.com/en/extensions/commands

This snippet shows how to define a keyboard shortcut for the reserved `_execute_browser_action` command in the manifest.json file. This command opens the browser action's popup page. Suggested keys for Windows and Mac platforms are provided.

```json
'commands': {
	'_execute_browser_action': {
		'suggested_key': {
			'windows': 'Ctrl+Shift+Y',
			'mac': 'Command+Shift+Y'
		}
	}
}
```

--------------------------------

### Download Events

Source: https://help.opera.com/en/extensions/downloads

Monitor download creation and changes using the `chrome.downloads.onCreated` and `chrome.downloads.onChanged` events.

```APIDOC
## Working with Events

### Description
The Downloads API provides events to monitor download activities. `onCreated` fires when a download is initiated, and `onChanged` fires when a download's state or properties change.

### Event: `onCreated`
#### Listener
`chrome.downloads.onCreated.addListener(callback)`

#### Callback Function
- **callback** (function)
  - **downloadItem** (DownloadItem object) - The `DownloadItem` object representing the newly created download.

#### Example
```javascript
chrome.downloads.onCreated.addListener(function (downloadItem) {
  console.log(
    'New Download created. ID: ' + downloadItem.id + ', ' +
    'URL: ' + downloadItem.url + ', ' +
    'file size: ' + downloadItem.fileSize
  );
});
```

### Event: `onChanged`
#### Listener
`chrome.downloads.onChanged.addListener(callback)`

#### Callback Function
- **callback** (function)
  - **delta** (object) - An object containing information about the changes to the download item.
    - **id** (integer) - The ID of the download item that changed.
    - **state** (object, optional) - Contains the new state of the download.
      - **current** (string) - The current state ('in_progress', 'complete', 'interrupted', 'cancelled').
    - Other properties like `bytesPerSec`, `fileSize`, `filename`, `paused`, `progress`, `receivedBytes` may also be present if they have changed.

#### Example
```javascript
chrome.downloads.onChanged.addListener(function (delta) {
  if (typeof delta.state !== 'undefined' && delta.state.current === 'complete') {
    console.log('Download ID ' + delta.id + ' has completed');
  }
});
```
```

--------------------------------

### Declare Extension Permissions in Manifest

Source: https://help.opera.com/en/extensions/declare-permissions

Permissions for an Opera extension are declared within its manifest file. This example shows how to list required permissions such as 'tabs', specific host permissions, and URL patterns.

```json
"permissions": [
	"tabs",
	"https://www.opera.com/",
	"http://*.example.org/"
]

```

--------------------------------

### Get Sidebar Panel HTML

Source: https://help.opera.com/en/extensions/sidebar-action-api

Retrieves the HTML document currently set as the panel for the sidebar action. Similar to `getTitle`, it accepts an optional `tabId` and a callback function to process the returned panel path.

```javascript
opr.sidebarAction.getPanel(
	object details,
	function callback
)
```

--------------------------------

### DevTools Extension Manifest Configuration

Source: https://help.opera.com/en/extensions/dev-tools

To create a DevTools page for your extension, you need to add the 'devtools_page' field in the extension's manifest.json file, pointing to the HTML file that will serve as the DevTools page.

```APIDOC
## DevTools Extension Manifest

### Description
Specifies the HTML page to be used as the DevTools page for the extension.

### Method
Manifest Configuration

### Endpoint
`manifest.json`

### Parameters
#### Request Body
- **devtools_page** (string) - Required - The path to the HTML file for the DevTools page.

### Request Example
```json
{
  "name": "My Extension",
  "version": "1.0",
  "devtools_page": "devtools.html"
}
```

### Response
This configuration is processed by the browser during extension installation.
```

--------------------------------

### Get Sidebar Action Title

Source: https://help.opera.com/en/extensions/sidebar-action-api

Retrieves the title of the sidebar action. This function takes an optional `tabId` to specify the tab and a callback function to handle the result. If no `tabId` is provided, the non-tab-specific title is returned.

```javascript
opr.sidebarAction.getTitle(
	object details,
	function callback
)
```

--------------------------------

### WebNavigation API - Event Order for Successful Navigation

Source: https://help.opera.com/en/extensions/web-navigation

Explains the sequence in which WebNavigation events are fired for a successfully completed navigation.

```APIDOC
## Event Order

For a navigation that is successfully completed, the `webNavigation` events are fired in the following order:

1.  **`onBeforeNavigate`**: Fired just before a navigation is about to occur.
2.  **`onCommitted`**: Fired when the navigation is committed.
3.  **`onDOMContentLoaded`**: Fired when the initial HTML document has been completely loaded and parsed.
4.  **`onCompleted`**: Fired when the load (including resources like images, CSS, etc.) is complete.

Errors during navigation will result in an `onErrorOccurred` event, after which no further events are fired for that specific navigation.

**Subframe Navigation Order:**
*   For frames with subframes, `onCommitted` for the parent frame fires before any of its children's `onBeforeNavigate` events.
*   `onCompleted` for the parent frame fires after all of its children's `onCompleted` events.

**Other Events:**
*   **`onReferenceFragmentUpdated`**: Fired if the reference fragment of a frame changes. This can occur anytime after `onDOMContentLoaded`, potentially even after `onCompleted`.
*   **`onHistoryStateUpdated`**: Fired if the History API (e.g., `pushState()`) modifies the frame's state. This can occur anytime after `onDOMContentLoaded`.
```

--------------------------------

### Setting Privacy Setting Values

Source: https://help.opera.com/en/extensions/privacy

Changing a privacy setting involves first checking if your extension has control using `get()`, and then using `set()` if controllable. Warn users if settings cannot be practically applied.

```APIDOC
## Usage - Setting a Setting
Changing the value of a setting is a little bit more complex, simply because you first must verify that your extension can control the setting. The user won’t see any change to her settings if your extension toggles a setting that is either locked to a specific value by enterprise policies (`levelOfControl` will be set to `not_controllable`), or if another extension is controlling the value (`levelOfControl` will be set to `controlled_by_other_extensions`). The `set()` call will succeed, but the setting will be immediately overridden. As this might be confusing, it is advisable to warn the user when the settings they’ve chosen aren’t practically applied.
This means that you ought to use the `get()` method to determine your level of access, and then only call `set()` if your extension can grab control over the setting (in fact if your extension can’t control the setting it’s probably a good idea to visually disable the functionality to reduce user confusion):
```javascript
chrome.privacy.services.autofillEnabled.get({}, function(details) {
	if (details.levelOfControl === 'controllable_by_this_extension') {
		chrome.privacy.services.autofillEnabled.set({ value: true }, function() {
			if (chrome.runtime.lastError === undefined) {
				console.log('Hooray, it worked!');
			} else {
				console.log('Sadness!', chrome.runtime.lastError);
			}
		});
	}
});
```
```

--------------------------------

### Create New Bookmarks and Folders using JavaScript

Source: https://help.opera.com/en/extensions/bookmarks

This JavaScript code demonstrates creating a new bookmark folder and subsequently adding bookmarks within that folder using `chrome.bookmarks.create()`. It specifies the `parentId` to control placement and uses a callback to nest new entries within the created folder.

```javascript
chrome.browserAction.onClicked.addListener(function(tab) {
	chrome.bookmarks.create({
		'title': 'Opera Extensions Resources',
		'parentId': '1'
	}, function (newEntry) {
		chrome.bookmarks.create({
			'title': 'Opera Extensions Documentation',
			'url': 'http://help.opera.com/extension/',
			'parentId': newEntry.id
		});
		chrome.bookmarks.create({
			'title': 'Opera Addons Gallery',
			'url': 'http://addons.opera.com',
			'parentId': newEntry.id
		});
		console.log('New Entry Added');
	});
});
```

--------------------------------

### Configure Page Action Popup in Manifest

Source: https://help.opera.com/en/extensions/browser-actions

Sets up a popup for the page action in the extension manifest. This involves specifying the default icon, an optional tooltip, and the HTML file to be displayed when the popup is opened. Page action popups are shown when the page action is active for the current tab.

```json
"page_action": {
	"default_icon": "icon.png",
	// Optional; shown in tooltip
	"default_title": "My Sample Extension",
	"default_popup": "popup.html"
}
```

--------------------------------

### Maintain State in Sidebar Panel (HTML)

Source: https://help.opera.com/en/extensions/sidebar-action-manual

The HTML structure for a sidebar panel that includes a textarea. This example sets up the basic UI for user input that needs to persist across panel openings and closings.

```html
<h1>Saving state</h1>
<p>
	The stuff typed in the textarea should still be there
	exactly as you had typed it, even if you close and re-open the panel.
</p>
<textarea id="maintext"></textarea>
```

--------------------------------

### Get Sidebar Action Badge Background Color

Source: https://help.opera.com/en/extensions/sidebar-action-api

Fetches the background color of the sidebar action's badge. It accepts an optional `tabId` and a callback function to receive the color information. Note: Not supported on Mac yet.

```javascript
opr.sidebarAction.getBadgeBackgroundColor(
	object details,
	function callback
)
```

--------------------------------

### WebNavigation API - Frame and Process IDs

Source: https://help.opera.com/en/extensions/web-navigation

Details the use of process IDs in WebNavigation events to handle multi-process environments and frame uniqueness.

```APIDOC
## A Note About Frame and Process IDs

Opera's multi-process architecture means a tab might use different processes for the source and destination of a web page. If a navigation occurs in a new process, you might receive events from both the old and new pages until the new navigation is committed (indicated by the `onCommitted` event for the main frame).

Frame IDs are unique only within a specific process. Therefore, `webNavigation` events include a `processId` to help identify the originating frame, even across process changes. During provisional loads, especially with redirects, the process might change multiple times, leading to repeated `onBeforeNavigate` and `onErrorOccurred` events until the final `onCommitted` event is received.
```

--------------------------------

### Configure Browser Action Popup in Manifest

Source: https://help.opera.com/en/extensions/browser-actions

Sets up a popup for the browser action in the extension manifest. This involves specifying the default icon, an optional tooltip, and the HTML file to be displayed when the popup is opened.

```json
"browser_action": {
	"default_icon": "icon.png",
	// Optional; shown in tooltip
	"default_title": "My Sample Extension",
	"default_popup": "popup.html"
}
```

--------------------------------

### Handle New Download Events with Downloads API

Source: https://help.opera.com/en/extensions/downloads

Listens for the `onCreated` event from the Downloads API to log information about newly created downloads. The event listener receives a `DownloadItem` object containing details such as ID, URL, and file size.

```javascript
chrome.downloads.onCreated.addListener(function (e) {
	console.log(
		'New Download created. ID: ' + e.id + ', ' +
		'URL: ' + e.url + ', ' +
		'file size: ' + e.fileSize
	);
});
```

--------------------------------

### Get Sidebar Action Badge Text

Source: https://help.opera.com/en/extensions/sidebar-action-api

Retrieves the current badge text of the sidebar action. It takes an optional `tabId` and a callback function. If no `tabId` is specified, the non-tab-specific badge text is returned. Note: Not supported on Mac yet.

```javascript
opr.sidebarAction.getBadgeText(
	object details,
	function callback
)
```

--------------------------------

### Declare Web Accessible Resources in Manifest

Source: https://help.opera.com/en/extensions/manifest

Specifies paths to packaged resources that can be accessed by web pages. Resources are whitelisted to be served with CORS headers, accessible via opera-extension://[PACKAGE ID]/[PATH] URLs. Resources not explicitly whitelisted are blocked by default for manifest_version 2 and above.

```json
"web_accessible_resources": [
	"images/my-awesome-image1.png",
	"images/my-amazing-icon1.png",
	"style/double-rainbow.css",
	"script/double-rainbow.js"
]
```

--------------------------------

### Detecting Keyboard Shortcuts in Background Script

Source: https://help.opera.com/en/extensions/commands

This section explains how to listen for and react to keyboard shortcut events triggered by the Commands API in your extension's background script.

```APIDOC
## Detecting Keyboard Shortcuts in Background Script

### Description
Handle detected keyboard shortcut commands within your extension's background script.

### Method
JavaScript Event Listener

### Endpoint
N/A

### Parameters
#### Path Parameters
N/A

#### Query Parameters
N/A

#### Request Body
N/A

### Request Example
N/A

### Response
#### Success Response (200)
N/A

#### Response Example
```javascript
chrome.commands.onCommand.addListener(function(command) {
  if (command === 'your_custom_command') {
    // Execute your custom functionality here
    console.log('Custom command executed!');
  }
});
```
```

--------------------------------

### Handling Context Menu Item Clicks

Source: https://help.opera.com/en/extensions/context-menus

This example shows the JavaScript function `searchText` that is called when a context menu item is clicked. It captures the selected text and opens a new tab with a Google search for that text.

```APIDOC
## Handling Context Menu Item Clicks

### Description
Defines the `searchText` function, which is executed when a context menu item is clicked. It retrieves the selected text and opens a new tab performing a Google search.

### Method
JavaScript Function

### Endpoint
`background.js` (or relevant script)

### Parameters
#### OnClickData Object (`info`)
- **selectionText** (string) - The text selected by the user in the browser.

### Request Example
```javascript
function searchText(info){
	var myQuery = encodeURI('https://www.google.com/search?q=' + info.selectionText);
	chrome.tabs.create({
		url: myQuery
	});
}
```

### Response
#### Success Response (200)
N/A (This is a function definition, not a request/response)

#### Response Example
N/A
```

--------------------------------

### Handle External Extension Messages (JavaScript)

Source: https://help.opera.com/en/extensions/message-passing

This JavaScript code illustrates how an extension can listen for messages from other extensions using chrome.runtime.onMessageExternal. It includes logic to blacklist specific extensions and respond to different types of requests like getting data or activating features.

```javascript
 _// For simple requests:_ 
chrome.runtime.onMessageExternal.addListener(
	function(request, sender, sendResponse) {
		if (sender.id == blacklistedExtension) {
			 _// Don’t allow this extension access_ 
			return;
		} else if (request.getTargetData) {
			sendResponse({ targetData: targetData });
		} else if (request.activateLasers) {
			var success = activateLasers();
			sendResponse({ activateLasers: success });
		}
	}
);

 _// For long-lived connections:_ 
chrome.runtime.onConnectExternal.addListener(function(port) {
	port.onMessage.addListener(function(msg) {
		 _// See other examples for sample onMessage handlers_ 
	});
});
```

--------------------------------

### Defining Translations in messages.json

Source: https://help.opera.com/en/extensions/internationalization

Provides examples of the messages.json file structure for different locales (en_GB, en_US, es). Each entry defines a message key with its translated string and an optional description. This file is essential for the chrome.i18n API to retrieve correct translations.

```json
{
	"extTitle": {
		"message": "Sample i18n Extension"
	},
	"extDesc": {
		"message": "You are using the British English locale `en_GB`."
	}
}

```

```json
{
	"extTitle": {
		"message": "Sample i18n Extension",
		"description": "Title of the extension"
	},
	"extDesc":{
		"message": "You are using the American English locale `en_US`."
	}
}

```

```json
{
	"extTitle":{
		"message": "Extensión i18n Muestra",
	},
	"extDesc":{
		"message": "Está utilizando española locale `es`."
	}
}

```

--------------------------------

### Declare Commands Permission in Manifest

Source: https://help.opera.com/en/extensions/commands

To enable keyboard shortcuts for your extension, you must declare the 'commands' permission in the manifest.json file. This allows the extension to register and utilize custom keyboard shortcuts.

```json
{
	"permissions": [
		"commands"
	]
}
```

--------------------------------

### Define Hardware Acceleration Requirements

Source: https://help.opera.com/en/extensions/manifest

Specifies the 3D hardware acceleration features required by the extension, such as WebGL. This helps ensure the extension functions correctly on systems with the necessary hardware capabilities.

```json
"requirements": {
	"3D": {
		"features": ["webgl"]
	}
}
```
Tokens:
Raw