Skip to content

HMR WebSocket fails - middlewareMode prevents Vite's WebSocket handler #175

Description

@etune

Summary

HMR WebSocket connections fail when using marko-run dev. The WebSocket upgrade request returns 404 instead of 101 Switching Protocols.

Environment

  • @marko/run: 0.9.3
  • vite: 7.2.2
  • Node.js: 20.x

Reproduce Steps

  1. Run marko-run dev
  2. Access the dev server through any proxy (Cloudflare Tunnel, nginx, etc.)
  3. Open browser DevTools → Network → WS filter
  4. Observe WebSocket returns 404, HMR doesn't work

Root Cause

In src/adapter/dev-server.ts:

server: { ...config?.server, middlewareMode: true }

Then in startDev:

const listener = devServer.middlewares.listen(port, ...);

The problem:

  • middlewareMode: true tells Vite NOT to create its own HTTP server (devServer.httpServer is null)
  • middlewares.listen() creates a NEW HTTP server
  • This new server doesn't have Vite's WebSocket upgrade handler attached
  • WebSocket upgrades get routed as HTTP GET → 404

Proof

  • Raw npx vite → WebSocket returns 101 Switching Protocols
  • marko-run dev → WebSocket returns 404

Proposed Fix

// Don't use middlewareMode
server: { ...config?.server, middlewareMode: false }

// Use Vite's httpServer
devServer.httpServer.listen(port, ...);

Workaround

Users can use patch-package to patch node_modules/@marko/run/dist/adapter/index.js:

  1. Change middlewareMode: true to false
  2. Change devServer.middlewares.listen() to devServer.httpServer.listen()

Activity

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

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions