Zamenite jQuery.once() sa JavaScript once() u Drupalu 10

Drupal 10 je stigao! A Drupal 10 više ne sadrži biblioteku drupal/jquery.once:

https://www.drupal.org/node/3158256

jQuery once je uklonjen iz Drupal core-a, ali je još uvek prisutan u mnogim dodatnim (contrib) modulima:

Održavaoci modula su dobijali automatske tikete sa zakrpama pod nazivom "Automated Drupal 10 compatibility fixes":

https://www.drupal.org/project/media_library_edit/issues/3288511

Ali ove nadogradnje ne sadrže ispravke za jquery.once. Tako su mnogi održavaoci mislili da su moduli spremni za Drupal 10 i nisu ih još testirali.

Zato, ako dobijete grešku "Uncaught TypeError: $(...).once is not a function", ne brinite, lako se rešava.

1. Potrebno je da zamenite core/jquery.once biblioteku sa core/once u *.libraries.yml fajlu (vidi screenshot iznad)

dependencies:
  - core/jquery
  - core/once

2. Ažurirajte javascript kod i zamenite $.once() sa javascript once(), na primer kod sa jQuery.once():

  Drupal.behaviors.fileBrowserClickProxy = {
    attach: function (context, settings) {
      $('.grid-item', context).once('bind-click-event').click(function () {
        // javascript/jQuery kod ovde.
      });
    }
  };

Kod sa javascript once() (Drupal 10 ispravan kod):

  Drupal.behaviors.fileBrowserClickProxy = {
    attach: function (context, settings) {
      $(once('bind-click-event', '.grid-item', context)).each(function () {
        $(this).on('click', function() {
          // javascript/jQuery kod ovde.
        });
      });
    }
  };

Drupal 10 i dalje koristi jQuery, tako da možemo da obavijemo once() funkciju u jQuery simbol $, i time dobijamo jQuery objekat iz once() funkcije, pa možemo koristiti .each() metodu.

Takođe, možete potpuno izbaciti jQuery u svom javascriptu:

https://youmightnotneedjquery.com/

  Drupal.behaviors.fileBrowserClickProxy = {
    attach: function (context, settings) {
      once('bind-click-event', '.grid-item', context).forEach(el => {
        el.addEventListener('click', () => {
          // Samo čist JavaScript ovde.
        });
        el.classList.add(className);
      });
    }
  };

Ali tada ćete morati da prepišete sav jQuery kod unutar 'click' callback funkcije.