Skip form{,method}="dialog" when targetting frame (hotwired#388)

Follow-up to hotwired#3

---

When a `<form data-turbo-frame="...">` element is submitted, it's
handled by the `Frames/FormInterceptor` class instead of the
`FormSubmitObserver` class, which was originally fixed to cover this
behavior in [hotwired#3][].

This commit reproduces the fix so that it's consistent across `<form>`
elements, regardless of their targetting.

[hotwired#3]: hotwired#3

src/core/frames/form_interceptor.ts

@@ -24,7 +24,9 @@ export class FormInterceptor {
     const form = event.target
     if (form instanceof HTMLFormElement && form.closest("turbo-frame, html") == this.element) {
       const submitter = event.submitter || undefined
-      if (this.delegate.shouldInterceptFormSubmission(form, submitter)) {
+      const method = submitter?.getAttribute("formmethod") || form.method
+
+      if (method != "dialog" && this.delegate.shouldInterceptFormSubmission(form, submitter)) {
         event.preventDefault()
         event.stopImmediatePropagation()
         this.delegate.formSubmissionIntercepted(form, submitter)

src/tests/fixtures/form.html

@@ -152,6 +152,20 @@ <h1>Form</h1>
           <button formmethod="dialog">Close</button>
         </form>
       </dialog>
+
+      <dialog id="dialog-method-turbo-frame" open>
+        <form action="/__turbo/redirect" method="dialog">
+          <input type="hidden" name="path" value="/src/tests/fixtures/frames/frame.html">
+          <button>Close</button>
+        </form>
+      </dialog>
+
+      <dialog id="dialog-formmethod-turbo-frame" open>
+        <form action="/__turbo/redirect" method="post" data-turbo-frame="frame">
+          <input type="hidden" name="path" value="/src/tests/fixtures/frames/frame.html">
+          <button formmethod="dialog">Close</button>
+        </form>
+      </dialog>
     </div>
     <hr>
     <div id="targets-frame">

src/tests/functional/form_submission_tests.ts

@@ -581,12 +581,27 @@ export class FormSubmissionTests extends TurboDriveTestCase {
   }
 
   async "test form submission skipped with submitter formmethod=dialog"() {
+    await this.clickSelector('#dialog-formmethod-turbo-frame [formmethod="dialog"]')
+    await this.nextBeat
+
+    this.assert.notOk(await this.formSubmitted)
+  }
+
+  async "test form submission targetting frame skipped within method=dialog"() {
+    await this.clickSelector('#dialog-method-turbo-frame button')
+    await this.nextBeat
+
+    this.assert.notOk(await this.formSubmitted)
+  }
+
+  async "test form submission targetting frame skipped with submitter formmethod=dialog"() {
     await this.clickSelector('#dialog-formmethod [formmethod="dialog"]')
     await this.nextBeat
 
     this.assert.notOk(await this.formSubmitStarted)
   }
 
+
   async "test form submission targets disabled frame"() {
     await this.remote.execute(() => document.getElementById("frame")?.setAttribute("disabled", ""))
     await this.clickSelector('#targets-frame form.one [type="submit"]')