Building Browser Extensions: Create Modern Extensions for Chrome, Safari, Firefox, and Edge
- Length: 570 pages
- Edition: 1
- Language: English
- Publisher: Apress
- Publication Date: 2022-12-07
- ISBN-10: 148428724X
- ISBN-13: 9781484287248
- Sales Rank: #274638 (See Top 100 Books)
Get the book’s companion extension at buildingbrowserextensions.com
Web developers today have plenty of experience with building regular web page apps, but a lot of that knowledge doesn’t transfer over when it comes to creating browser extensions. This book provides a complete reference for how to build modern browser extensions.
Creating and deploying a browser extension is more like building a mobile app than a website. When you start building an extension you’ll often find there are a large number of new concepts and idiosyncrasies to wrangle with. This book reveals how to successfully navigate around these obstacles and how to take advantage of the limited resources available.
You’ll see how a browser extensions work, their component pieces, and how to build and deploy them. Additionally, you’ll review all the tricky bits of extension development that most developers have to learn through trial and error. The current transition from manifest v2 to v3 is of special interest, and an entire chapter will be dedicated to this subject. By the end of this book, you will have a rich understanding of what browser extensions are, how they work, all the pitfalls to avoid, and the most efficient ways of building them.
You will:
- Understand the best ways to build and deploy a modern browser extension
- Learn wow to build a browser extension using modern web development tools
- Fast-track your understanding of browser extensions
- Build browser extensions using modern tooling and frameworks like Webpack and React
- Understand the implications of the transition from manifest v2 to v3
- Complete reference of browser extension APIs and features
- Learn to build cross-browser extensions for Chrome, Firefox, Safari, and Edge
Who This Book Is For
This book is for web developers who want to learn how to develop and deploy a modern browser extension. Developers familiar with modern JavaScript frameworks will be able to directly apply their knowledge to building a browser extension with frameworks like React or Vue. This book is also for individuals who wish to quickly roll out a browser extension prototype or side project; it covers a broad range of tools and platforms that can manage all the boilerplate and underlying APIs automatically.
Table of Contents About the Author About the Technical Reviewer Acknowledgments Foreword Introduction Chapter 1: What Are Browser Extensions? History of Browser Extensions Customizing Software with Plugins History of Web Browsers Native Browser Plugins From Browser Add-ons to Extensions The Browser Extension Landscape Comparing Mobile Apps and Browser Extensions Browser Extension Stores Types of Browser Extensions Ad and Tracking Blockers Password Managers Smart Writing Management Tools Accessibility Tools Content and Link Aggregators Tab Management Tools Screen Recording Tools Integrations for Software Platforms Digital Currency Wallets Developer Tools Summary Credits Chapter 2: Fundamental Elements of Browser Extensions The Browser Model Browser Tabs Same-Origin Policy The Browser Extension Model Independent JavaScript Pages and Runtimes Native APIs and User Interfaces Tab and Domain Access Observing and Intercepting Network Requests Elements of Browser Extensions Extension Manifest Manifest v2 and v3 Background Scripts The Popup Page The Options Page Content Scripts Devtools Panels and Sidebars Extension Elements in Action Honey LastPass Grammarly React Developer Tools Summary Chapter 3: Browser Extension Crash Course Creating the Manifest Minimum Viable Extension Installing Your Extension Reloading Your Extension Adding a Background Script Adding a Popup Page Adding an Options Page Adding a Content Script Working with Multiple Tabs Adding a Devtools Panel Summary Untitled Chapter 4: Browser Extension Architecture Architecture Overview Plurality, Lifecycles, and Updates Background Service Worker Popup and Options Pages Devtools Pages Content Scripts Browser Extension File Server Sandboxed Pages Summary Chapter 5: The Extension Manifest The Manifest File Supporting Different Locales Match Patterns and Globs File Path Match Patterns URL Match Patterns URL Globs Manifest Properties action default_icon default_popup default_title browser_style theme_icons author automation background Manifest v2 background scripts Manifest v2 background page Manifest v2 persistent pages and event pages Manifest v3 service worker browser_action browser_specific_settings chrome_settings_overrides Custom Homepage Custom Search Engine Custom Startup Page chrome_url_overrides commands Command Syntax Defining Key Shortcuts Multi-browser Support Reserved Commands Custom Commands Global Commands content_capabilities content_scripts content_security_policy Manifest v2 content security policy Manifest v3 content security policy converted_from_user_script cross_origin_embedder_policy cross_origin_opener_policy declarative_net_request default_locale description developer devtools_page differential_fingerprint event_rules externally_connectable file_browser_handlers file_system_provider_capabilities homepage_url host_permissions icons incognito key manifest_version minimum_chrome_version nacl_modules name oauth2 offline_enabled omnibox optional_host_permissions optional_permissions options_page options_ui browser_style open_in_tab page_action permissions platforms replacement_web_app requirements sandbox short_name storage system_indicator tts_engine update_url version version_name web_accessible_resources Manifest v2 Manifest v3 Summary Chapter 6: Understanding the Implications of Manifest V3 Motivation for Manifest V3 Security Performance Migration to DeclarativeNetRequest Migration to Service Workers Privacy and Transparency Revenue Implications of Background Service Workers DOM XMLHttpRequest Timer API Event Handlers Service Worker Persistence Global State and Storage Audio and Video Implications of Content Security Policy Restrictions Implications of DeclarativeNetRequest Summary Chapter 7: Background Scripts Web Page Service Workers vs. Extension Service Workers Similarities Single Occupancy Installation and Lifecycle Top-Level Event Handling Async Messaging Differences Registration Purpose Manifest v2 vs. Manifest v3 Scripts vs. Service Workers JavaScript Imports No Access to DOM and Limited Global APIs Nonpersistent No Shutdown Event No Programmatic Background Access Working with Background Scripts Inspecting Background Service Workers Service Worker Errors Service Worker Termination Common Patterns Event Handler Secret Management and Authentication Message Hub Storage Manager Injecting Scripts Sniffing Web Traffic Installed/Updated Events Opening Tabs Forcing Service Worker Persistence Implementation Drawbacks and Limitations Summary Chapter 8: Popup and Options Pages Popup Pages Popup Page Properties Opening and Closing Popup Pages Changing the Popup Page Detecting Popup State Suggested Use Options Pages Options Page Properties Opening and Closing Options Pages Detecting Options Pages Suggested Use Content Script Restrictions Summary Chapter 9: Content Scripts Introduction to Content Scripts Injecting CSS Content Script Isolation Page Automation Logging and Errors Extension API Access Modules and Code Splitting Bundling Dynamic Imports Dynamic Script Tags Specialized Content Script Properties Programmatic Injection Summary Chapter 10: Devtools Pages Introduction to Devtools Pages Creating a devtools Page Adding panels and sidebars Adding a Panel Adding a Sidebar The Devtools API Sniffing network traffic Inspecting the Page Content Scripts and Devtools Messaging Other Devtools API Features Summary Chapter 11: Extension and Browser APIs Global API Namespace Promises vs. Callbacks Error Handling Context-restricted APIs Events API Format Event Filtering WebExtensions API Quick Reference Permissions Messaging One-off Messages Opening Message Ports Messaging Native Applications Messaging Other Extensions Storage Authentication Network Requests Internationalization Browser and System Control Power Omnibox Action Notifications Context Menu Page and Screen Capture Proxy Browser State Management Font Settings Content Settings Cookies Bookmarks History Downloads Top Sites Browsing Data Sessions Tabs and Windows Debugger Search Alarms Scripting DOM Text to Speech Privacy Idle Devtools Extension Introspection Extension Management System State Enterprise Only Firefox Only Chrome OS Only Deprecated Summary Chapter 12: Permissions Permissions Basics Checking Permissions Using Optional Permissions Granting Permissions Declaratively vs. Imperatively Permission Request Idempotence Host Permissions Permissions Lifetime Permissions Warnings Testing Permissions Warnings Considerations for Published Extensions Triggering the Slow Review Queue Auto-Disable Updates Permissions List activeTab alarms background bookmarks browserSettings browsingData captivePortal certificateProvider clipboardRead clipboardWrite contentSettings contextMenus contextualIdentities cookies debugger declarativeContent declarativeNetRequest declarativeNetRequestFeedback declarativeWebRequest desktopCapture Devtools page dns documentScan downloads downloads.open enterprise.deviceAttributes enterprise.hardwarePlatform enterprise.networkingAttributes enterprise.platformKeys experimental fileBrowserHandler fileSystemProvider find fontSettings gcm geolocation history Host Permissions Global Host Permission Partial Host Permission identity idle loginState management menus menus.overrideContext nativeMessaging notifications pageCapture pkcs11 platformKeys power printerProvider printing printingMetrics privacy processes proxy scripting search sessions signedInDevices storage system.cpu system.display system.memory system.storage tabCapture tabGroups tabHide tabs theme topSites tts ttsEngine unlimitedStorage vpnProvider wallpaper webNavigation webRequest webRequestBlocking Summary Untitled Chapter 13: Networking Comparing Websites and Extensions Networking Architecture Options Pages Popup and Devtools Pages Content Scripts Background Scripts Pinning an Extension ID Authentication Styles No Authentication Content Script Spoofing Cookie Authentication Json Web Token Authentication OAuth and OpenID OAuth, OpenID, and the Identity API OAuth API Methods OAuth Redirect URLs Configuring the Authorization Platform Additional Help OAuth and OpenID Examples Google OAuth with getAuthToken() Google OpenID with launchWebAuthFlow( ) Manual Github OAuth with launchWebAuthFlow() Networking APIs The webNavigation API The webRequest API Modifying Requests Fragmentation The declarativeNetRequest API Permissions Rule and Ruleset Structure Static Rulesets Dynamic Rules Summary Chapter 14: Extension Development and Deployment Local Development Inspecting Your Extension Inspecting an Extension View Inspecting a Background Service Worker Inspecting a Content Script File Changes Error Monitoring Extension Reloads Automated Extension Tests Unit Tests Integration Tests Additional Reading Publishing Extensions Store Listing Privacy Practices Review Process Updating Extensions Update Considerations Update Delays Auto-Disabling Cancelling Updates Automated Update Publishing Tracking User Activity Dashboard Metrics Analytics Libraries Setting Up Google Analytics Set Up ga.js Install and Uninstall Events Summary Chapter 15: Cross-Browser Extensions Introduction to Cross-Browser Support Browser Coverage Tradeoffs Browser Share Chromium Browser Extension Sharing Adapting Your Codebase API Probing Differential Manifests Manifest v2/v3 Extension Marketplaces Marketplace Similarities Marketplace Differences Chrome Web Store Add-ons for Firefox Microsoft Edge Add-ons Safari Extensions App Store Opera Addons Mobile Extensions Mobile Extension User Interfaces Kiwi Browser Firefox Mobile iOS Safari Automated Deployment WebExtensions API Support Safari Extension Development Prerequisites Architecture Creating an Extension Project Writing the App Testing on macOS Testing on iOS Deploying to the App Store Converting an Existing Extension Firefox Idiosyncrasies Manifest Versions Sidebars API Additions Summary Chapter 16: Tooling and Frameworks Building Extensions with React Single Entrypoint React Extensions Multiple Entrypoint React Extensions Reactive State Management Routing Extension Views and HashRouter Content Scripts and MemoryRouter Mozilla Tools web-ext webextension-polyfill Bundlers and CLI Tools Parcel Webpack Plasmo High-level Overview JavaScript Frameworks Documentation and Examples Differential Build Outputs Automatic Manifest Generation Icon Generation Bundling Remote Code Environment Variables Content Script Mounting Extension-friendly Hot Module Replacement Automated Deployment with Browser Platform Publish Useful Sites Summary Index
Donate to keep this site alive
How to download source code?
1. Go to: https://github.com/Apress
2. In the Find a repository… box, search the book title: Building Browser Extensions: Create Modern Extensions for Chrome, Safari, Firefox, and Edge
, sometime you may not get the results, please search the main title.
3. Click the book title in the search results.
3. Click Code to download.
1. Disable the AdBlock plugin. Otherwise, you may not get any links.
2. Solve the CAPTCHA.
3. Click download link.
4. Lead to download server to download.