Lightbox opens href instead of lightbox in chrome

[dinandmentink]

On chrome only (firefox works fine) it opens the lightbox and then immediately navigates to the image. I can't seem to fix it.

Live example, for example on my personal website: https://www.dinandmentink.nl/postits/4

This is the script I use to initialize the lightbox:

import SimpleLightbox from "simplelightbox/dist/simple-lightbox.esm";

document.addEventListener("app-load", function () {
  document.querySelectorAll("[data-gallery]").forEach((elem) => {
    var selector = elem.getAttribute("data-gallery");
    var items = "[data-gallery~=" + selector + "] [data-gallery-item]";

    new SimpleLightbox(items, {
      history: false,
      fadeSpeed: 100,
      animationSpeed: 100,
    });

    // Remove default behaviour from a elements
    var items = "[data-gallery~=" + selector + "] a[data-gallery-item]";
    document.querySelectorAll(items).forEach(function(item) {
      item.addEventListener('click', function(event) {
        event.preventDefault();
        event.stopPropagation();
        return false;
      });
    });

    elem.removeAttribute("data-gallery");
  })
});

I tried fixing it by using preventDefault and stopPropagation, but no dice. Anyone run into this, any suggestions? I really hope someone can shed some light on this, I have been breaking my head on it.

[Mtillmann]

Can you try and disable turbolinks and see if the problem persists? I'm pretty certain that this is not a issue with simplelightbox. I see that the lightbox opens before the location is changed to the image uri

[dinandmentink]

Yes, the lightbox does open before switching to a new page.

Oh, yes, ofcourse. Let me try, it would be so obvious.

[dinandmentink]

Too bad. Disabling turbo on these links doesn't work. Neither does completely disabling turbo.

For some reason I can not reproduce it on localhost, to test it in development I have to add a fake domain to /etc/hosts.

Anything else you can think of?

Edit:

I think I found the culprit. For some reason the plausible tracker causes this issue. I will edit this if I manage to fix it, but I'm fairly certain this isn't simplelightbox related.

Thanks for the quick response and help. Maybe I just needed the virtual rubber duck.

Edit 2:

Found the culprit, this was unrelated to simplelightbox. I used plausible tracker enableAutoOutboundLinkTracking() on simplelightbox, which for some reason messes up outbound links. In this case using a cdn domain caused the images to be outbound links.

My bad for flagging this, thanks for the help.

[Mtillmann]

no worries, I'll close this issue