The GoogleChrome/chrome-extensions-samples repository is a collection of sample Chrome extensions provided by Google. It serves as a comprehensive resource for developers looking to create Chrome extensions, offering a wide range of examples that demonstrate various extension capabilities and APIs.

Pros

• Extensive collection of sample extensions covering numerous use cases
• Official examples from Google, ensuring best practices and up-to-date code
• Well-organized repository structure, making it easy to find relevant examples
• Includes both simple and complex extensions, catering to developers of all skill levels

Cons

• Some older examples may not reflect the latest Chrome extension manifest versions
• Limited documentation within individual samples; developers may need to refer to official Chrome extension documentation for detailed explanations
• Not all samples are actively maintained, potentially leading to outdated code in some cases

Code Examples

1. Basic background script (manifest v3):

// manifest.json
{
  "manifest_version": 3,
  "name": "My Extension",
  "version": "1.0",
  "background": {
    "service_worker": "background.js"
  }
}

// background.js
chrome.runtime.onInstalled.addListener(() => {
  console.log('Extension installed');
});

2. Content script injection:

// manifest.json
{
  "manifest_version": 3,
  "name": "Content Script Example",
  "version": "1.0",
  "content_scripts": [
    {
      "matches": ["<all_urls>"],
      "js": ["content.js"]
    }
  ]
}

// content.js
document.body.style.backgroundColor = 'red';

3. Chrome storage API usage:

// Saving data
chrome.storage.sync.set({ key: 'value' }, () => {
  console.log('Data saved');
});

// Retrieving data
chrome.storage.sync.get(['key'], (result) => {
  console.log('Value currently is ' + result.key);
});

Getting Started

To get started with Chrome extension development using these samples:

1. Clone the repository:

   git clone https://github.com/GoogleChrome/chrome-extensions-samples.git
   

2. Navigate to a specific sample directory.

3. Load the extension in Chrome:

   • Open chrome://extensions/
   • Enable "Developer mode"
   • Click "Load unpacked" and select the sample directory

4. Modify the sample code to suit your needs and experiment with different Chrome extension APIs.