Skip to content

README.md

Latest commit

 

History

History
180 lines (122 loc) · 8.69 KB

README.md

File metadata and controls

180 lines (122 loc) · 8.69 KB
Raw

S&R Extension

Remix audio in your browser. Slow down a track, add reverb, boost the volume, and save your favorite sound as a mix.

Installation · Usage · Browser support · Development · Privacy

Features

Control What it does
Speed & pitch Adjust playback from 0.5× to 1.5×, with optional pitch preservation.
Volume Set an exact level from 0% to 600%, mute, or reset to 100%.
Reverb & bass Adjust the reverb mix and add extra bass.
Tone Choose Flat, Voice boost, or Bass boost.
Mixes Start with Slowed + Reverb, Nightcore, or Clean. Save and manage your own mixes.
Audio tabs Find tabs playing audio and switch between them.
Preferences Choose dark, light, or system appearance; customize sliders and save a starting mix.

Keyboard controls, exact numeric inputs, optional peak reduction, and website volume recall are included.

Installation

Download or clone this repository, then open a terminal in the folder containing package.json. Node.js is required to build; the build itself needs no package downloads.

Chrome & Brave

npm run build:chromium
  1. Open chrome://extensions or brave://extensions.
  2. Enable Developer mode.
  3. Choose Load unpacked and select dist/chromium.

Requires Chromium 116 or newer. After source changes, rebuild and click Reload on the extension.

Firefox

npm run build:firefox
  1. Open about:debugging#/runtime/this-firefox.
  2. Choose Load Temporary Add-on….
  3. Select dist/firefox/manifest.json.

Requires Firefox 142 or newer. Reload the add-on from the same debugging page after rebuilding. Temporary add-ons must be loaded again after restarting Firefox.

Permanent installation: Standard Firefox requires a Mozilla-signed package. The generated ZIP is unsigned; use the signing instructions below to create an installable XPI.

Sign a Firefox package for permanent installation

Mozilla's unlisted signing flow signs the add-on without publishing it in the public store.

  1. Sign in to an AMO developer account and generate credentials on the API credentials page.

  2. Set the JWT issuer and secret in your PowerShell session:

    $env:AMO_JWT_ISSUER = "your-jwt-issuer"
$env:AMO_JWT_SECRET = "your-jwt-secret"

  3. Run:

    npm run sign:firefox:unlisted

  4. Install the signed .xpi from web-ext-artifacts in Firefox.

Never commit these credentials. The signing script reads them from environment variables. Before submitting another build, update the version in manifest.json; AMO rejects duplicate versions.

If signing returns Unauthorized or Error decoding signature, regenerate your credentials, accept any pending developer agreements, and check that the issuer and secret are in the correct variables without extra labels or angle brackets.

Usage

  1. Open a page with audio or video, then open S&R Extension.
  2. Choose a preset or adjust Tab volume, Speed, and Reverb.
  3. Open Fine-tune for extra bass and optional peak reduction.
  4. Choose Save mix to save your sound. Open Saved to apply, rename, replace, or delete a mix.

Use the effects toggle to pause processing while keeping your settings. Open Preferences to change appearance, slider behavior, or the starting mix for new tabs.

Control shortcuts

Action Shortcut
Enter an exact value Click a numeric value; Enter applies it and Escape cancels the edit.
Adjust a focused slider Use arrow keys, Page Up/Down, Home, or End.
Adjust volume with the mouse wheel Scroll over the volume slider for 10% steps; hold Shift for 1% steps.
Restore sound after muting Unmute to return to the previous nonzero volume.

Tabs and saved volume

  • Tabs playing audio lets you switch players. Reopen the popup after switching to adjust that tab.
  • Captured tabs keep their own volume and tone settings.
  • Restore offers the last nonzero volume saved for a website. It does not apply automatically.
  • Volume recall stores up to 200 websites locally and excludes private/incognito tabs.
  • Disconnect tab audio in Preferences releases the captured stream and restores normal page audio.

Browser support

Chrome & Brave Firefox
Audio processing Captures the selected tab’s output; processing continues after the popup closes. Processes compatible page media.
Volume, reverb, bass & tone Applied to captured tab audio. Available when the page’s media supports processing.
Speed & pitch Depend on the player’s media APIs. Depend on the player’s media APIs.

Some sites or players restrict audio processing. On those pages, only speed and pitch may work. Capturing audio does not guarantee that a player supports speed or pitch changes.

Reduce audio peaks uses optional compression. It can soften loud peaks and reduce the perceived boost, but it does not guarantee distortion-free audio.

Troubleshooting

  • No compatible media: Start playback, refresh the page, and reopen the extension.
  • Spotify stopped responding after an update: Reload the extension, close the Spotify tab, and open Spotify again.
  • Firefox rejects the ZIP: Load dist/firefox/manifest.json temporarily or install a signed XPI.

Spotify and YouTube use early media hooks. Firefox may refresh a Spotify tab once when enabling effects if those hooks were injected too late.

Development

Command Purpose
npm run build Build both browsers’ unpacked folders and ZIPs in dist.
npm run build:chromium Build the Chromium package only.
npm run build:firefox Build the Firefox package only.
npm run check Check JavaScript syntax, run regression tests, and validate both packages and their archives.
npm test Run automated tests.
npm run lint:firefox Run Mozilla’s manifest and source checks; downloads web-ext if needed.
Browser previews and manual checks

Serve the repository through a localhost HTTP server, then open:

Page Purpose
tests/popup-workbench.html Interactive popup preview with connection, permission, empty-list, and storage-error scenarios.
tests/popup-preview.html Actual popup with simulated extension APIs and isolated session storage.
tests/popup-sizing-check.html Check preferred width, scrolling, footer bounds, and numeric field fit.
tests/browser-audio-check.html Verify gain, mute, bypass, voice, and reverb with OfflineAudioContext; plays no sound.

Preview scenarios also include many, firefox, no-media, and connecting. Preview settings never affect the installed extension.

Automated lifecycle tests simulate browser transport. Verify real tab capture and player behavior with the extension installed in Chrome or Brave.

Audio architecture

Chromium uses a service worker to request tab audio and an offscreen document to own the stream and Web Audio graph. Reverb, tone, bass, and volume process the captured output once. Speed and pitch use page media hooks.

The Firefox package excludes Chromium’s capture permissions and worker. It uses the shared audio engine on compatible page media, including supported frames and Shadow DOM media.

The tab-audio architecture is an original implementation informed by Volume Master 2.4.0. No source code, artwork, branding, promotions, or activation system from that extension is included.

Privacy and permissions

Audio is processed locally. S&R does not record or upload audio, or send analytics, browsing history, media URLs, cookies, or tokens to external services. Settings use browser extension storage.

Permission Why it is needed
activeTab Apply controls to the tab where you open the popup.
scripting Inject the media controller into the active tab.
storage Save preferences, mixes, and website volume settings.
tabs Show titles of tabs playing audio and switch to them.
tabCapture · Chromium only Capture audio from the selected tab.
offscreen · Chromium only Keep audio processing active after the popup closes.
Spotify and YouTube host access Install media hooks before those players finish loading.

License

MIT