Proxy request.signal through in vite dev

[brophdawg11]

Found this wasn't working right while testing #9975. Aligned with how we do it in the express adapter.

Closes #9438

[changeset-bot]

🦋 Changeset detected

Latest commit: 0689ce9

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 16 packages

Name	Type
@remix-run/dev	Patch
create-remix	Patch
remix	Patch
@remix-run/architect	Patch
@remix-run/cloudflare	Patch
@remix-run/cloudflare-pages	Patch
@remix-run/cloudflare-workers	Patch
@remix-run/css-bundle	Patch
@remix-run/deno	Patch
@remix-run/eslint-config	Patch
@remix-run/express	Patch
@remix-run/node	Patch
@remix-run/react	Patch
@remix-run/serve	Patch
@remix-run/server-runtime	Patch
@remix-run/testing	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[github-actions]

🤖 Hello there,

We just published version 2.12.1-pre.0 which includes this pull request. If you'd like to take it for a test run please try it out and let us know what you think!

Thanks!

[github-actions]

🤖 Hello there,

We just published version 2.12.1 which includes this pull request. If you'd like to take it for a test run please try it out and let us know what you think!

Thanks!

[jvaill]

It's working better now! But I'm still having issues with the signal not being aborted sometimes.

Referencing this: sergiodxa/remix-utils#317 (comment)

[Eiley2]

Is there a workaround for this? Maybe check every once is a while if a connection is closed to abort that connection? I'm having the same issue with node and the updated version of remix in production too.

routes/sse.time.ts

import { LoaderFunctionArgs } from "@remix-run/node"
import { eventStream } from "remix-utils/sse/server"

export async function loader({ request }: LoaderFunctionArgs) {
  return eventStream(request.signal, function setup(send) {
    const timer = setInterval(() => {
      console.log(new Date().toLocaleTimeString())
      send({ event: "time", data: new Date().toLocaleTimeString() })
    }, 1000)

    return function clear() {
      console.log("SSE connection closed")
      clearInterval(timer)
    }
  })
}

and this is my route:

routes/time.tsx

import { useEventSource } from "remix-utils/sse/react"

export default Route(){
  let time = useEventSource("/sse/time", { event: "time" })
  if (!time) {
    time = new Date().toLocaleTimeString()
  }

return <p>{time}</p>

[jvaill]

It seems like the signal is working correctly until a new undici Request() is constructed. At that point, undici creates an underlying signal. That ends up getting passed to the remix handler.

Here's where Request() is created in remix.

Here's an issue I opened on the undici repo.

[jvaill]

Possible fix: #10030

[mkromann]

I am running into the same issue, and cannot get any EventSource to close with request.signal. Is there a workaround for how to handle this?

Right now it is a huge block for developing with SSE. We have to restart the whole app constantly.