hx-ext="sse" elements should include hx-vals attributes as query params

[bradleyjkemp]

I want to be able send some dynamic query params as part of an sse request like so:

<div hx-ext="sse" sse-connect="/events" hx-vals="js:{dynamicValue: foo()}>

But the hx-vals are not included in the eventsource connect: https://github.com/bigskysoftware/htmx-extensions/blob/ba3d1675bc5a89c870df8ec5a1ac126e408467b8/src/sse/sse.js#L178-L185 https://github.com/bigskysoftware/htmx-extensions/blob/ba3d1675bc5a89c870df8ec5a1ac126e408467b8/src/sse/sse.js#L191-L192

Only the value of sse-connect is used

[ErikEngerd]

The same issue also applies to the ws extension.

[fastpok]

I had a similar problem with WebSockets extension. Try changing single quotes to double quotes.

This did not work for me: hx-vals="{'a': 'b'}"

But this one worked: hx-vals="{"a": "b"}"

[XChikuX]

Similar issue: https://github.com/bigskysoftware/htmx-extensions/issues/139

[dhowden]

Stumbled on this issue whilst trying to get hx-headers (ref) to be passed through when the SSE connects.

Is there an appetite for adding support for these? (or are these supposed to be limited to the XHR requests that HTMX is making)?

[Telroshan]

Hey, Event sources are constructed with their own constructor, so no XMLHTTPRequest is made to open the connection, we can't simply plug this into htmx's request mechanism

See #132, #139 and #143 where we discussed about this, and how to make it more configurable to let you at least build/modify the SSE URL as you want. As far as I know, no one is working on that at the moment, so if you want to give a shot at its implementation, please feel free to do so!