Issue #2896303 by Dom., sorabh.v6, bojanz: Auto-submit coupon on press enter and avoid other form submit collision

Author: Miroslav

modules/promotion/commerce_promotion.libraries.yml

@@ -3,3 +3,11 @@ form:
   css:
     theme:
       css/promotion.form.css: {}
+
+coupon_redemption_form:
+  version: VERSION
+  js:
+    js/commerce_promotion.coupon_redemption_form.js: {}
+  dependencies:
+    - core/jquery
+    - core/drupal

modules/promotion/js/commerce_promotion.coupon_redemption_form.js

@@ -0,0 +1,24 @@
+/**
+ * @file
+ * Defines Javascript behaviors for the coupon redemption form.
+ */
+
+(function ($, Drupal, drupalSettings) {
+  'use strict';
+
+  Drupal.behaviors.commercePromotionCouponRedemptionForm = {
+    attach: function (context) {
+      // Trigger the "Apply" button when Enter is pressed in a code field.
+      $('input[name$="[code]"]', context)
+        .once('coupon-redemption-code')
+        .keydown(function (event) {
+          if (event.keyCode === 13) {
+            // Prevent the browser default from being triggered.
+            // That is usually the "Next" checkout button.
+            event.preventDefault();
+            $(':input[name="apply_coupon"]', context).trigger('mousedown');
+          }
+        });
+    }
+  };
+})(jQuery, Drupal, drupalSettings);

modules/promotion/src/Element/CouponRedemptionForm.php

@@ -89,6 +89,9 @@ public static function processForm(array $element, FormStateInterface $form_stat
 
     $element = [
       '#tree' => TRUE,
+      '#attached' => [
+        'library' => ['commerce_promotion/coupon_redemption_form'],
+      ],
       '#theme' => 'commerce_coupon_redemption_form',
       '#prefix' => '<div id="' . $wrapper_id . '">',
       '#suffix' => '</div>',