Git Product home page Git Product logo

webext-dynamic-content-scripts's Introduction

webext-dynamic-content-scripts npm version

WebExtension module: Automatically registers your content_scripts on domains added via permission.request

For example, when your users enable more domains via webext-domain-permission-toggle, this module will automatically register your content_scripts from manifest.json into the new domain.

The main use case is to add support for GitHub/GitLab Enterprise domains to your GitHub/GitLab extension: you start with github.com and then users can add new domains; this way you don't need to use a broad <all_urls> permission.

Tested in Chrome, Firefox, and Safari.

Guides

How to let your users enable your extension on any domain.

Install

You can download the standalone bundle and include it in your manifest.json. Or use npm:

npm install webext-dynamic-content-scripts
// This module is only offered as a ES Module
import 'webext-dynamic-content-scripts';

Usage

Include webext-dynamic-content-scripts as a background script and add optional_permissions to allow new permissions to be added. The scripts defined in content_scripts will be added on the new domains (matches will be replaced)

// example manifest.json
{
	"optional_permissions": [
		"*://*/*"
	],
	"background": {
		"scripts": [
			"webext-dynamic-content-scripts.js",
			"background.js"
		]
	},
	"content_scripts": [
		{
			"matches": [
				"https://github.com/*"
			],
			"css": [
				"content.css"
			],
			"js": [
				"content.js"
			]
		}
	]
}

Permissions for Chrome

This section does not apply to Firefox users.

In order to use all_frames: true you should the add webNavigation permission. Without it, all_frames: true won’t work:

  • when the iframe is not on the same domain as the top frame
  • when the iframe reloads or navigates to another page
  • when the iframe is not ready when runAt is configured to run (runAt: 'start' is unlikely to work)

If available, the webNavigation API will be automatically used in every situation for better performance.

Related

Permissions

Others

  • webext-options-sync - Helps you manage and autosave your extension's options. Chrome and Firefox.
  • webext-storage-cache - Map-like promised cache storage with expiration. Chrome and Firefox
  • webext-detect-page - Detects where the current browser extension code is being run. Chrome and Firefox.
  • web-ext-submit - Wrapper around Mozilla’s web-ext to submit extensions to AMO.
  • Awesome-WebExtensions - A curated list of awesome resources for WebExtensions development.

License

MIT © Federico Brigante

webext-dynamic-content-scripts's People

Contributors

fregante avatar bfred-it avatar andersdjohnson avatar nickytonline avatar darkred avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.