Popsize Extension

A Chrome extension for getting your ideal clothing size on fashion websites, using Popsize's sizing technology.

Quick Start for Contributors

1. Fork and clone the repository:

   git clone https://github.com/your-username/chrome-extension.git
   cd chrome-extension
   

2. Download button.js from the latest widget version:

   rm -rf dist
   mkdir -p dist
   curl -o dist/button.js https://engine.popsize.ai/latest/button.js

3. Load the extension in Chrome:

   • Open Chrome and go to chrome://extensions/
   • Enable "Developer mode"
   • Click "Load unpacked" and select the extension folder

Features

The widget can be injected in three ways:

1. Automatic Injection: Automatically injects on supported websites (see manifest.json for the full list)
2. Extension Icon: Click the Popsize extension icon to manually inject the widget on any page
3. Context Menu: Right-click anywhere on a page and select "Find my size with Popsize"

🛡️ Built-in Rate Limiting

To ensure fair usage and system stability, the extension implements rate limiting:

• 5 injections per minute
• 60 injections per hour
• 100 injections per day
• 200 injections per week

Architecture

The extension consists of several key components:

• manifest.json: Extension configuration, permissions, and URL patterns
• background.js: Service worker that handles context menu, extension icon clicks, and rate limiting
• product.js: Content script that injects the Popsize widget with rate limit checks
• dist/button.js: The actual Popsize widget (downloaded separately)

Testing

The extension includes automated Puppeteer tests.

Setup Tests

cd tests
npm install

Run Tests

npm test

The test will:

• Launch Chrome with the extension loaded
• Navigate to a test product page
• Verify extension functionality
• Check rate limiting setup
• Keep browser open for manual inspection

See tests/README.md for more details.

Development

Adding New Websites

To add support for a new website:

1. Add the URL pattern to content_scripts.matches in manifest.json
2. Add the corresponding domain to web_accessible_resources.matches
3. Test the injection on the new website

Permissions

The extension requires these permissions:

• contextMenus: For right-click context menu injection
• scripting: For programmatic injection via icon/context menu
• storage: For rate limiting data persistence
• notifications: For user notifications about rate limits
• host_permissions: For injecting scripts on websites

Contributing

We welcome contributions! Please follow these steps:

• Fork the repository on GitHub
• Clone your fork to your local machine
• Create a new branch for your feature or fix: git checkout -b my-feature-branch
• Make your changes and ensure they follow coding standards
• Test your changes thoroughly
• Create a pull request on GitHub against the dev branch of this repository
• Follow the PR template to describe your changes and any relevant context
• Wait for review: We will review your PR and provide feedback or merge it

Some ideas for contributions:

• Add support for more e-commerce websites
• Improve the UI/UX of the extension, add settings
• Add analytics dashboard for rate limit usage
• Implement user preferences for widget appearance

License

AGPL 3.0 License. See LICENSE for details.