Skip to content

Commit

Permalink
add an example that shows how to polyfill XHR in an extension
Browse files Browse the repository at this point in the history
  • Loading branch information
patrickkettner committed Nov 6, 2024
1 parent b939ca2 commit 33fb83a
Show file tree
Hide file tree
Showing 11 changed files with 1,380 additions and 0 deletions.
1 change: 1 addition & 0 deletions functional-samples/libraries-xhr-in-sw/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
dist
13 changes: 13 additions & 0 deletions functional-samples/libraries-xhr-in-sw/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
# Using XHR in Service Workers

This sample demonstrates how to use code that relies on XHR within a extension's background service worker.

## Overview

The default background environment for extensions is the service worker. As a result, it only has direct access to [Fetch](https://developer.mozilla.org/docs/Web/API/Fetch_API/Using_Fetch). If you want to use a library that is built with XHR, this will not work by default. However, you can usually monkeypatch the expected behavior by polyfilling XHR. This sample shows an example of how you can use build tools to automatically inject a polyfill for XHR that covers most common XHR use cases, allowing for seamless integration into your extension.

## Running this extension

1. Clone this repository
2. Run `npm install` in this folder to install all dependencies.
3. Run `npm run build` to bundle the extension.
17 changes: 17 additions & 0 deletions functional-samples/libraries-xhr-in-sw/manifest.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
{
"name": "Fetching Titles",
"version": "0.1",
"manifest_version": 3,
"description": "This extension fetches the titles of all the tabs in the current window and displays them in a side panel.",
"background": {
"service_worker": "dist/background.js"
},
"permissions": ["activeTab", "scripting", "sidePanel"],
"host_permissions": ["<all_urls>"],
"side_panel": {
"default_path": "sidepanel/index.html"
},
"action": {
"default_title": "Fetch the title of the current tab"
}
}
Loading

0 comments on commit 33fb83a

Please sign in to comment.