Skip to content

feat(dev-preview): local browser preview for css/js with live reload#7801

Draft
Eetwalt wants to merge 11 commits into
mainfrom
local-browser
Draft

feat(dev-preview): local browser preview for css/js with live reload#7801
Eetwalt wants to merge 11 commits into
mainfrom
local-browser

Conversation

@Eetwalt

@Eetwalt Eetwalt commented Jul 10, 2026

Copy link
Copy Markdown
Collaborator

Prototype to simplify the proxy setup to one npm command and no need to set up certs. With limited testing, seems to work nicely. Not that battle-tested yet, but wanted to share if you want to try it out while I'm out for the next couple of weeks!

Summary

  • Add scripts/dev-preview/ and an npm run dev command: a local MITM proxy serves your locally-built CSS/JS in place of production assets on *.liquipedia.net/commons/load.php, a file watcher rebuilds on .scss/.js save, and a dedicated browser auto-reloads — no editor integration required.
  • Node-native (http-mitm-proxy + chokidar), no Python/venv. Proxying is PAC-scoped to *.liquipedia.net and runs in a throwaway browser profile that ignores cert errors, so normal browsing is untouched.
  • Previews CSS/JS only — Lua renders server-side and still needs the dev-wiki deploy flow (noted in the README).
  • Complements the minimal mitmproxy + VSCode-task approach (feat: automate proxy setup for local testing #7391/feat: vscode task config for launching dev proxy #7799) as the batteries-included, editor-agnostic flow.
  • Docs: new "Local asset preview" section under "Testing your branch".

How did you test this change?

Limited local testing: npm run dev opens the browser with local assets, and editing .scss/.js auto-reloads the page. Not extensively battle-tested yet.

@ElectricalBoy

Copy link
Copy Markdown
Collaborator

Few thoughts after reading OP (didn't read code):

  • Because all our deploy scripts are on Python (i.e., you'll need it for Lua dev deploy anyway), I don't think keeping the current Python-based mitmproxy dependency is a huge compromise.
  • http-mitm-proxy hasn't been updated in the last three years and seems to be abandoned at this point.
    • Could be worth looking for a more modern/maintained library replacement? idk
  • I don't think auto reload is necessarily a good thing - I use previews instead of a fully featured sandbox pages from time to time (because it is often easier to set up) and reloads may likely interfere with previews.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants