cemrehancavdar/hyperleaflet

Undefined event.detail on slow requests

Opened this issue · 0 comments

I'm facing an issue while making multiple calls to an endpoint triggered by map:moveend events using HTMX.
If I move the map around quickly multiple times and the triggered endpoint takes a long time to return a response, the event.detail object becomes undefined. If the endpoint returns quickly enough, or I don't move the map too often, then it works fine without any errors.
To clarify, this endpoint returns elements that have the data-id attribute. Basically it returns all objects from the database within the current bounding box.

Here is my code:

<div
    id="map"
    data-center="<some coordinates>"
    data-zoom="13"
    data-reverse-order-all
    hx-get="/some_endpoint"
    hx-target="#some_element"
    hx-swap="outerHTML"
    hx-trigger="map:moveend from:window"
    hx-vals="js:{bounding_box: event.detail.bboxString}"
  ></div>

And here is the resulting error:

TypeError: Cannot read properties of undefined (reading 'bboxString')
    at eval (eval at <anonymous> (htmx.min.js:1:35058), <anonymous>:3:37)
    at htmx.min.js:1:35084
    at wr (htmx.min.js:1:35243)
    at br (htmx.min.js:1:35035)
    at Er (htmx.min.js:1:35366)
    at Cr (htmx.min.js:1:35421)
    at he (htmx.min.js:1:38764)
    at htmx.min.js:1:38177
    at w (htmx.min.js:1:38387)
    at b.onload (htmx.min.js:1:40295)