leaflet.map event not firing

Created on 21 February 2025, about 1 month ago

Problem/Motivation

I have some custom JS which is using the leaflet.map event.
After upgrading drupal core to 10.4.0 the leaflet.map event is not firing anymore.
Down grading core to 10.3.x fixes the problem.

Steps to reproduce

Install drupal 10.4.0 with leaflet (10.2.35), create a custom js file with following code:

$(document).bind('leaflet.map', function (event, settings, lMap) {
        console.log('fired')
      });

If you downgrade core to a 10.3.x version, the event will be fired.

Proposed resolution

No idea if this is the right place to report this, can move this if needed.

Remaining tasks

User interface changes

API changes

Data model changes

🐛 Bug report
Status

Active

Version

10.2

Component

Code

Created by

🇧🇪Belgium aren33k

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

  • Issue created by @aren33k
  • 🇮🇹Italy itamair

    thanks @aren33k for reporting this ...
    well, indeed something could have happened moving from 10.3.x into 10.4.x Drupal Core that I am not clearly aware of ...
    but let's try to better describe and fix this issue of you.

    First of all, if you the Leaflet Map that it means that the following events:

    'leafletMapInit': https://git.drupalcode.org/project/leaflet/-/blob/10.2.x/js/leaflet.drup...
    'leaflet.map': https://git.drupalcode.org/project/leaflet/-/blob/10.2.x/js/leaflet.drup...

    are both being fired (for sure).
    They act exactly as the same, and could be use without any difference.
    The 'leafletMapInit' was introduced to provide a better (self explaining) naming, and the 'leaflet.map' was still kept not to break backward compatibility.

    What is rather and (very) probably happening is that something changed in the ways different js libraries are being loaded, in terms of each other dependency.

    For having this code of you:

    $(document).bind('leaflet.map', function (event, settings, lMap) {
            console.log('fired')
          });

    correctly intercept (react upon) on of those 2 triggered events you js library (that embeds that code) should be loaded BEFORE the leaflet.leaflet-drupal library itself, that has now the following default definition:

    leaflet-drupal:
      js:
        js/leaflet.drupal.js: {}
      dependencies:
        - core/jquery
        - core/once
        - core/drupal
        - leaflet/leaflet

    has you can see from here: https://git.drupalcode.org/project/leaflet/-/blob/10.2.x/leaflet.librari...

    So, it means that [your_custom_module.your_custom_library] should become an additional dependency on that.
    How could this be done?

    Well ... you need to implement the following hook_library_info_alter() in [your_custom_module.module] file,
    such the following:

    /**
     * Implements hook_library_info_alter().
     */
    function  your_custom_module_library_info_alter(&$libraries, $extension) {
      if ($extension == "leaflet") {
       $libraries['leaflet-drupal']['dependencies'][] = ' your_custom_module/.your_custom_library';
      }
    }
    

    In that way you will force and inject your library as dependency for the leaflet-drupal library itself (as defined by the Leaflet module/extension),
    and correctly make your code ready for listening and catch the 'leaflet.map' (or 'leafletMapInit) event ...

    All clear?

    Otherwise, second quick (no code) option would be to simply enable " Lazy load map" for your Leaflet View Style or Leaflet Formatter option ... (@see the attached screenshot).

    Hope (and very confident) this will help and fix this issue of you ... that s not indeed a clear Bug of the Leaflet module.
    Let's change all this into a Support Request.

    And let us know if indeed all this fixes this, and move it accordingly to Fixed or Needs Work/Active, etc.

  • 🇧🇪Belgium aren33k

    Hi @itamair, thanks for the provided information.
    Yes I read somewhere the weights of drupal assets had changed in 10.4.0, but was not aware my custom script had to be loaded before the leaflet drupal script. After implementing hook_library_info_alter this works fine.

    FYI: also had an issue when logged in as admin: the event would not fire -> https://www.drupal.org/project/drupal/issues/3496329 💬 CKEditor stops loading on existing content after Drupal update to 10.4 Active

    Thank you!

  • Automatically closed - issue fixed for 2 weeks with no activity.

Production build 0.71.5 2024