This week was rough— probably the hardest so far.
We hit a wall of unexpected bugs:
- Chrome’s CSP blocking injected scripts,
- mysterious “file isn’t UTF-8” errors,
- weird Vite + MV3 alias resolution quirks,
- and several executeScript dead ends that broke silently.
It took dozens of micro-fixes and re-architecture steps, but the result is solid:
✅ What we accomplished
- Stable Vite build with browser polyfills (path-browserify, fs shim).
- MV3-safe architecture: content scripts loaded via manifest, no unsafe eval.
- Full analyzer integration — local import from monorepo (packages/analyzer/src).
- CSS collection (inline + cross-domain via background FETCH_CSS).
- Popup UI: Analyze / Reset / Copy / Download / Open in Web App.
- Live updates between background ↔ popup with chrome.storage.
- Metrics & highlights: score, files, rules, selectors, declarations, conflicts (color-coded).
- Logging system — background logs visible in popup.
- Web report page with search, filters, pagination for conflicts/duplicates.
- Minimal permissions, icons, version sync, and tests on real sites.
💡 Lessons learned
- MV3 demands a fundamentally different mindset — “injecting code” is replaced by data passing and manifest-declared scripts.
- Avoid relying on DevTools console: service worker logs are the real goldmine.
- Always check file encodings and path resolution inside monorepos — the defaults bite hard.
🚀 What’s next
Week 5 focuses on Analyzer Insights & Web Dashboard: visualizations, distributions, CI-friendly exports, and richer filtering UX.
After fighting through so many invisible walls, it feels amazing to finally click “Analyze” and watch a clean, working report pop up.
Top comments (0)