Drupal 10 में jQuery.once() को JavaScript once() से बदलें

Drupal 10 आ गया है! और Drupal 10 में अब drupal/jquery.once लाइब्रेरी मौजूद नहीं है:

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

jQuery once को Drupal कोर से हटा दिया गया है, लेकिन यह अभी भी कई contrib मॉड्यूल्स में मौजूद है:

मॉड्यूल मेंटेनर्स को "Automated Drupal 10 compatibility fixes" नाम वाले पैच के साथ अपडेट टिकट्स मिले:

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

लेकिन इन अपडेट्स में jquery.once के लिए कोई फिक्स शामिल नहीं है। इसलिए कई मेंटेनर्स को यकीन था कि मॉड्यूल्स Drupal 10 के लिए तैयार हैं और उन्होंने अभी तक उन्हें टेस्ट नहीं किया।

तो अगर आपको यह एरर मिल रहा है: "Uncaught TypeError: $(...).once is not a function", तो परेशान न हों, इसे आसानी से ठीक किया जा सकता है।

1. आपको *.libraries.yml फाइल में core/jquery.once लाइब्रेरी को core/once से बदलना होगा (ऊपर दिए गए स्क्रीनशॉट देखें)

dependencies:
  - core/jquery
  - core/once

2. जावास्क्रिप्ट कोड अपडेट करें और $.once() को जावास्क्रिप्ट once() से बदलें, उदाहरण के लिए jQuery.once() वाला कोड:

  Drupal.behaviors.fileBrowserClickProxy = {
    attach: function (context, settings) {
      $('.grid-item', context).once('bind-click-event').click(function () {
        // यहाँ javascript/jQuery कोड।
      });
    }
  };

javascript once() वाला कोड (Drupal 10 के लिए काम करने वाला कोड):

  Drupal.behaviors.fileBrowserClickProxy = {
    attach: function (context, settings) {
      $(once('bind-click-event', '.grid-item', context)).each(function () {
        $(this).on('click', function() {
          // यहाँ javascript/jQuery कोड।
        });
      });
    }
  };

Drupal 10 अब भी jQuery का उपयोग करता है, इसलिए हम once() फ़ंक्शन को jQuery डॉलर साइन में रैप कर सकते हैं, तब यह once() फ़ंक्शन से jQuery ऑब्जेक्ट रिटर्न करेगा और हम .each() jQuery मेथड का उपयोग कर सकते हैं।

आप अपने कस्टम जावास्क्रिप्ट में jQuery का बिल्कुल भी उपयोग न करने का विकल्प भी चुन सकते हैं:

https://youmightnotneedjquery.com/

  Drupal.behaviors.fileBrowserClickProxy = {
    attach: function (context, settings) {
      once('bind-click-event', '.grid-item', context).forEach(el => {
        el.addEventListener('click', () => {
          // यहाँ केवल plain Javascript।
        });
        el.classList.add(className);
      });
    }
  };

लेकिन तब आपको 'click' callback फ़ंक्शन के अंदर का पूरा jQuery कोड plain Javascript में फिर से लिखना होगा।