Claude Skills Guide

Chrome Extension for Amazon Product Research

Product research on Amazon requires gathering data from multiple pages, tracking price history, analyzing reviews, and identifying trends. For developers and power users, building a custom Chrome extension automates these tasks and provides personalized workflows. This guide covers the architecture, implementation patterns, and practical considerations for creating Amazon product research extensions.

Understanding the Amazon Product Research Workflow

Before writing code, understand what data points matter for product research:

Chrome extensions excel at this because they can inject scripts into Amazon pages, extract DOM elements, and aggregate data across multiple products.

Extension Architecture

A typical Amazon product research extension uses the Manifest V3 architecture with three main components:

// manifest.json
{
  "manifest_version": 3,
  "name": "Amazon Product Research Assistant",
  "version": "1.0",
  "permissions": [
    "activeTab",
    "scripting",
    "storage"
  ],
  "host_permissions": [
    "https://*.amazon.com/*"
  ],
  "action": {
    "default_popup": "popup.html",
    "default_icon": "icon.png"
  },
  "background": {
    "service_worker": "background.js"
  }
}

The content script runs on Amazon pages and extracts product data. The background service worker handles data aggregation and storage. The popup provides the user interface for viewing and exporting research data.

Extracting Product Data from Amazon Pages

Content scripts inject into Amazon product pages and extract relevant data using DOM queries. Here’s a practical implementation:

// content.js - Extract product data from Amazon product page
function extractProductData() {
  const getText = (selector) => {
    const el = document.querySelector(selector);
    return el ? el.textContent.trim() : null;
  };

  const product = {
    asin: window.amazonProductData?.asin || 
          getText('[data-asin]')?.dataset?.asin ||
          window.location.pathname.split('/dp/')[1]?.split('/')[0],
    
    title: getText('#productTitle') || getText('#title'),
    
    price: {
      current: getText('.a-price .a-offscreen') || 
               getText('#priceblock_ourprice') ||
               getText('.a-price-whole'),
      currency: 'USD'
    },
    
    rating: getText('.a-icon-alt')?.match(/(\d+\.?\d*)/)?.[1],
    reviewCount: getText('#acrCustomerReviewText')?.replace(/[^0-9]/g, ''),
    
    salesRank: getText('#salesrank')?.replace(/[^0-9]/g, ''),
    
    isFBA: !!document.querySelector('.a-badge-supplementary-text a[href*="fulfilled-by-amazon"]'),
    isPrime: !!document.querySelector('.a-badge-supplementary-text a[href*="prime"]'),
    
    seller: {
      name: getText('#sellerProfileTriggerId'),
      rating: getText('#seller-rating-average')
    },
    
    category: Array.from(document.querySelectorAll('.a-breadcrumb li'))
      .map(li => li.textContent.trim())
      .filter(Boolean)
  };

  return product;
}

// Listen for messages from popup or background
chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
  if (request.action === 'extractProduct') {
    const data = extractProductData();
    sendResponse(data);
  }
});

Building a Research Dashboard

For multi-product research, aggregate data into a dashboard view. Store research results using Chrome’s storage API:

// background.js - Handle research data storage and aggregation
chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
  if (request.action === 'saveProduct') {
    const { product } = request;
    
    chrome.storage.local.get(['researchData'], (result) => {
      const existingData = result.researchData || [];
      const existingIndex = existingData.findIndex(p => p.asin === product.asin);
      
      if (existingIndex >= 0) {
        existingData[existingIndex] = { ...existingData[existingIndex], ...product, updatedAt: new Date().toISOString() };
      } else {
        existingData.push({ ...product, savedAt: new Date().toISOString() });
      }
      
      chrome.storage.local.set({ researchData: existingData }, () => {
        sendResponse({ success: true, count: existingData.length });
      });
    });
    
    return true; // Keep message channel open for async response
  }
  
  if (request.action === 'getResearchData') {
    chrome.storage.local.get(['researchData'], (result) => {
      sendResponse(result.researchData || []);
    });
    return true;
  }
});

Handling Amazon’s Dynamic Content

Amazon uses heavy JavaScript rendering, so content scripts must wait for page elements to load. Use mutation observers or wait for specific elements:

// content.js - Wait for page elements before extracting
function waitForElement(selector, timeout = 5000) {
  return new Promise((resolve, reject) => {
    const element = document.querySelector(selector);
    if (element) {
      resolve(element);
      return;
    }

    const observer = new MutationObserver(() => {
      const element = document.querySelector(selector);
      if (element) {
        observer.disconnect();
        resolve(element);
      }
    });

    observer.observe(document.body, { 
      childList: true, 
      subtree: true 
    });

    setTimeout(() => {
      observer.disconnect();
      reject(new Error(`Element ${selector} not found within ${timeout}ms`));
    }, timeout);
  });
}

// Usage
async function extractWithWait() {
  try {
    await waitForElement('#productTitle');
    await waitForElement('.a-price');
    return extractProductData();
  } catch (error) {
    console.error('Failed to extract product data:', error);
    return null;
  }
}

Exporting Research Data

Power users need to export data for deeper analysis. Support CSV and JSON formats:

// popup.js - Export research data
function exportToCSV(products) {
  const headers = ['ASIN', 'Title', 'Price', 'Rating', 'Reviews', 'FBA', 'Prime', 'Category', 'Saved At'];
  const rows = products.map(p => [
    p.asin,
    `"${p.title?.replace(/"/g, '""')}"`,
    p.price?.current,
    p.rating,
    p.reviewCount,
    p.isFBA ? 'Yes' : 'No',
    p.isPrime ? 'Yes' : 'No',
    p.category?.join(' > '),
    p.savedAt
  ]);

  const csv = [headers.join(','), ...rows.map(r => r.join(','))].join('\n');
  const blob = new Blob([csv], { type: 'text/csv' });
  const url = URL.createObjectURL(blob);
  
  const a = document.createElement('a');
  a.href = url;
  a.download = `amazon-research-${new Date().toISOString().split('T')[0]}.csv`;
  a.click();
  URL.revokeObjectURL(url);
}

function exportToJSON(products) {
  const json = JSON.stringify(products, null, 2);
  const blob = new Blob([json], { type: 'application/json' });
  const url = URL.createObjectURL(blob);
  
  const a = document.createElement('a');
  a.href = url;
  a.download = `amazon-research-${new Date().toISOString().split('T')[0]}.json`;
  a.click();
  URL.revokeObjectURL(url);
}

Rate Limiting and Ethical Considerations

When building product research extensions, respect Amazon’s terms of service and implement rate limiting:

// background.js - Rate limiting for API requests
const rateLimiter = {
  queue: [],
  processing: false,
  delay: 1000, // 1 second between requests
  
  async add(fn) {
    return new Promise((resolve) => {
      this.queue.push({ fn, resolve });
      this.process();
    });
  },
  
  async process() {
    if (this.processing || this.queue.length === 0) return;
    this.processing = true;
    
    while (this.queue.length > 0) {
      const { fn, resolve } = this.queue.shift();
      await fn();
      resolve();
      await new Promise(r => setTimeout(r, this.delay));
    }
    
    this.processing = false;
  }
};

Avoid overwhelming Amazon’s servers with rapid requests. Space out your data collection to minimize impact on their infrastructure.

Testing Your Extension

Test extensions locally using Chrome’s developer mode:

  1. Navigate to chrome://extensions/
  2. Enable “Developer mode” in the top right
  3. Click “Load unpacked” and select your extension directory
  4. Test on various Amazon page types: product pages, search results, category pages

Create separate test cases for different Amazon domain variations (amazon.com, amazon.co.uk, amazon.de, etc.) since DOM structures may vary.

Conclusion

Building a Chrome extension for Amazon product research gives you complete control over your data collection workflow. Start with basic product extraction, then expand to include price tracking, review analysis, and competitive benchmarking. The key is structuring your data early so you can scale your research capabilities over time.

For developers, the extension serves as a foundation for more advanced tools—integrate with external databases, add machine learning for sentiment analysis, or connect to inventory management systems. The browser is your interface, and Amazon’s data is your canvas.

Built by theluckystrike — More at zovo.one