Rework away from core/jquery.once to core/once.

discoverygarden · Sep 28, 2023 · b7cac08 · b7cac08
1 parent 1da5658
commit b7cac08
Show file tree

Hide file tree

Showing 3 changed files with 38 additions and 34 deletions.
diff --git a/content_sync.libraries.yml b/content_sync.libraries.yml
@@ -1,5 +1,5 @@
+---
 # Help.
-
 content_sync.help:
   version: VERSION
   css:
@@ -10,7 +10,7 @@ content_sync.help:
   dependencies:
     - core/drupal
     - core/jquery
-    - core/jquery.once
+    - core/once
     - core/jquery.ui.accordion
 
 content_sync.element.message:
@@ -23,4 +23,4 @@ content_sync.element.message:
   dependencies:
     - core/drupal
     - core/jquery
-    - core/jquery.once
+    - core/once
diff --git a/js/content_sync.element.message.js b/js/content_sync.element.message.js
@@ -3,7 +3,7 @@
  * JavaScript behaviors for message element integration.
  */
 
-(function ($, Drupal) {
+(function ($, Drupal, once) {
 
   'use strict';
 
@@ -14,8 +14,8 @@
    */
   Drupal.behaviors.content_syncMessageClose = {
     attach: function (context) {
-      $(context).find('.js-content_sync-message--close').once('content_sync-message--close').each(function () {
-        var $element = $(this);
+      once('content_sync-message--close', '.js-content_sync-message--close', context).forEach((element) => {
+        var $element = $(element);
 
         var id = $element.attr('data-message-id');
         var storage = $element.attr('data-message-storage');
@@ -89,4 +89,4 @@
     }
   }
 
-})(jQuery, Drupal);
+})(jQuery, Drupal, once);
diff --git a/js/content_sync.help.js b/js/content_sync.help.js
@@ -3,8 +3,7 @@
  * JavaScript behaviors for help.
  */
 
-(function ($, Drupal) {
-
+(function ($, Drupal, once) {
   'use strict';
 
   /**
@@ -17,20 +16,23 @@
    */
   Drupal.behaviors.content_syncHelpAccordion = {
     attach: function (context) {
-      var $widget = $(context).find('.content_sync-help-accordion');
-      $widget.once('content_sync-help-accordion').accordion({
-        header: 'h2',
-        collapsible: true,
-        heightStyle: 'content'
-      });
+      once('content_sync-help-accordion', '.content_sync-help-accordion', context).forEach((element) => {
+        var $widget = $(element);
+
+        $widget.accordion({
+          header: 'h2',
+          collapsible: true,
+          heightStyle: 'content'
+        });
 
-      if (location.hash) {
-        var $container = $('h2' + location.hash, $widget);
-        if ($container.length) {
-          var active = $widget.find($widget.accordion('option', 'header')).index($container);
-          $widget.accordion('option', 'active', active);
+        if (location.hash) {
+          var $container = $('h2' + location.hash, $widget);
+          if ($container.length) {
+            var active = $widget.find($widget.accordion('option', 'header')).index($container);
+            $widget.accordion('option', 'active', active);
+          }
         }
-      }
+      });
     }
   };
 
@@ -44,20 +46,22 @@
    */
   Drupal.behaviors.content_syncHelpDialog = {
     attach: function (context) {
-      $(context).find('.button-content_sync-play').once('content_sync-help-dialog').on('click', function (event) {
-        if ($(window).width() < 768) {
-          event.stopImmediatePropagation();
-        }
-      }).each(function () {
-        // Must make sure that this click event handler is execute first and
-        // before the Ajax dialog handler.
-        // @see http://stackoverflow.com/questions/2360655/jquery-event-handlers-always-execute-in-order-they-were-bound-any-way-around-t
-        var handlers = $._data(this, 'events')['click'];
-        var handler = handlers.pop();
-        // Move it at the beginning.
-        handlers.splice(0, 0, handler);
+      once('content_sync-help-dialog', '.button-content_sync-play', context).forEach((element) => {
+        $(element).on('click', function (event) {
+          if ($(window).width() < 768) {
+            event.stopImmediatePropagation();
+          }
+        }).each(function () {
+          // Must make sure that this click event handler is execute first and
+          // before the Ajax dialog handler.
+          // @see http://stackoverflow.com/questions/2360655/jquery-event-handlers-always-execute-in-order-they-were-bound-any-way-around-t
+          var handlers = $._data(this, 'events')['click'];
+          var handler = handlers.pop();
+          // Move it at the beginning.
+          handlers.splice(0, 0, handler);
+        });
       });
     }
   };
 
-})(jQuery, Drupal);
+})(jQuery, Drupal, once);