Describe the bug
With the most recent changes to flowbite.turbo.js, the turbo:after-stream-render is fired on the document, but the event listener is attached to the window. Therefore, initFlowbite is never called when after stream render.
To Reproduce
Steps to reproduce the behavior:
Render an Accordion component from a turbo stream render
The Accordion will not be initialized and will not respond to events
Expected behavior
When initFlowbite is called properly after turbo stream render, the Accordion component is initialized and will respond to click events
Screenshots
If applicable, add screenshots to help explain your problem.
Desktop (please complete the following information):
OS: Mac OSX
Browser: Safari
Version: 17.4
Smartphone (please complete the following information):
Device: N/A
OS: N/A
Browser: N/A
Version: N/A
Additional context
Here are the relevant code that is causing this issue:
Describe the bug With the most recent changes to flowbite.turbo.js, the
turbo:after-stream-render
is fired on the document, but the event listener is attached to the window. Therefore,initFlowbite
is never called when after stream render.To Reproduce Steps to reproduce the behavior:
Expected behavior When
initFlowbite
is called properly after turbo stream render, the Accordion component is initialized and will respond to click eventsScreenshots If applicable, add screenshots to help explain your problem.
Desktop (please complete the following information):
Smartphone (please complete the following information):
Additional context Here are the relevant code that is causing this issue:
This is where we're dispatching the custom
turbo:after-stream-render
event (note that it fires the event fromdocument
): https://github.com/themesberg/flowbite/blob/aee4853c2b043efda7ef3287733408e20300046a/src/index.turbo.ts#L26This is how we're binding to the that custom event to call
initFlowbite
: https://github.com/themesberg/flowbite/blob/aee4853c2b043efda7ef3287733408e20300046a/src/index.turbo.ts#L39Unfortunately, this
Events
class binds towindow
and notdocument
: https://github.com/themesberg/flowbite/blob/aee4853c2b043efda7ef3287733408e20300046a/src/dom/events.ts#L13A workaround is to create your own listener that listens to the document instead: