TLDR: I developed a browser extension that automatically tracks songs played on YouTube Music and scrobbles them to Last.fm accounts. Available on the Chrome Web Store with open-source code on GitHub.
Motivation
My Music Journey
As an avid music listener spanning genres from rock to classical, I’ve relied on YouTube Music through my YouTube Premium subscription - a service I consistently find worth its value.
The Inspiration
Last year, I encountered a GitHub repository showcasing automated music trend visualizations using Last.fm data. Though intrigued, I initially dismissed the idea until months later when I sought a new technical challenge.
Development Journey
API Challenges
My attempts to access YouTube Music’s listening history through official APIs revealed:
- No dedicated YouTube Music API
- A cumbersome YouTube History API requiring complex authentication
- Limited documentation for music-specific data extraction
Discovering Last.fm
Research led me to Last.fm’s scrobbling concept, where users track listening history across devices. While initially concerned about manual tracking, I discovered:
Platform | Solution |
---|---|
Android Devices | Pano Scrobbler |
Web Browsers | YouTube Music Last.fm Scrobbler |
Despite functional existing solutions, persistent bugs in the browser extension motivated me to create a more reliable alternative.
Name of the extension
As a Swifty, I HAD to name the extension in some way, related to this. There was no much thought to it. I used Pano Scrobbler in my android devices, so I replaced ‘Pano’ with ‘Tay’(for Taylor) and because of its nature I also added the ‘Web’ prefix. So we have Tay Web Scrobbler.
First Version
Initial implementation used:
- Vite + React + TailwindCSS stack
- @crxjs/vite-plugin for extension packaging
- Three core components:
- Last.fm authentication prompt screen
- Now playing display
- Configuration options screen which allow the user to modify some of the app’s behaviour
The architecture included custom classes for:
- Song detection
- Play duration tracking
Second version
By accident, I stumbled upon a “Next-gen Web Extension Framework” called wxt. This framework provides all the tools to build and publish your extension to all the major extension stores. I created a new branch and started migrating my code. The result wasn’t too different from my old code, except it took away a lot of the boilerplate that I had there.
Future Directions
While the extension currently focuses on reliable scrobbling, future plans include:
- Multi-browser support (Firefox/Edge)
- Enhanced error reporting
Acknowledgments
Thank you for reading this blog post! I welcome any feedback or suggestions through the project’s GitHub repository. Special thanks to the open-source communities behind Last.fm and wxt that made this project possible.
Resources / Tools
To create this project and the above writeup the following tools were used in varying degrees: