fix(pat inject): Fix issue with submit buttons which are added later.

Fix an issue with submit buttons which were added after initialization of pat-inject which did not send their value (e.g. via a pat-inject call). Ref: scrum-1670
Patternslib · Nov 3, 2023 · efc6dab · efc6dab
1 parent 2e7331b
commit efc6dab
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 14 deletions.
diff --git a/src/pat/inject/inject.js b/src/pat/inject/inject.js
@@ -105,6 +105,22 @@ const inject = {
                     });
                     // setup event handlers
                     if ($el[0]?.tagName === "FORM") {
+                        events.add_event_listener(
+                            $el[0],
+                            "click",
+                            "pat-inject--form-submit-click",
+                            (e) => {
+                                if (
+                                    e.target.matches(
+                                        "[type=submit], button:not([type=button]), [type=image]"
+                                    )
+                                ) {
+                                    // make sure the submitting button is sent
+                                    // with the form
+                                    ajax.onClickSubmit(e);
+                                }
+                            }
+                        );
                         events.add_event_listener(
                             $el[0],
                             "submit",
@@ -113,20 +129,6 @@ const inject = {
                                 this.onTrigger(e);
                             }
                         );
-                        for (const button of $el[0].querySelectorAll(
-                            "[type=submit], button:not([type=button]), [type=image]"
-                        )) {
-                            events.add_event_listener(
-                                button,
-                                "click",
-                                "pat-inject--form-submit-click",
-                                (e) => {
-                                    // make sure the submitting button is sent
-                                    // with the form
-                                    ajax.onClickSubmit(e);
-                                }
-                            );
-                        }
                     } else if ($el.is(".pat-subform")) {
                         log.debug("Initializing subform with injection");
                     } else {

diff --git a/src/pat/inject/inject.test.js b/src/pat/inject/inject.test.js
@@ -1378,6 +1378,29 @@ describe("pat-inject", function () {
                     expect(pattern.onTrigger).toHaveBeenCalledTimes(1);
                 });
             });
+
+            it("9.2.7 - Sends submit button form values even if submit button is added after initialization.", async function () {
+                document.body.innerHTML = `
+                    <form class="pat-inject" action="test.cgi">
+                    </form>
+                `;
+
+                const pat_ajax = (await import("../ajax/ajax.js")).default;
+                jest.spyOn(pat_ajax, "onClickSubmit");
+                jest.spyOn(pattern, "onTrigger");
+
+                const form = document.querySelector("form");
+
+                pattern.init($(form));
+                await utils.timeout(1); // wait a tick for async to settle.
+
+                form.innerHTML = `<button type="submit"/>`;
+                const button = form.querySelector("button");
+                button.click();
+
+                expect(pat_ajax.onClickSubmit).toHaveBeenCalledTimes(1);
+                expect(pattern.onTrigger).toHaveBeenCalledTimes(1);
+            });
         });
     });