Install global submit listener only when amp-form extension is registered

src/document-submit.js

@@ -23,12 +23,18 @@ import {
 } from './url';
 import {Services} from './services';
 import {dev, user} from './log';
+import {isExtensionScriptInNode} from './element-service';
 
 /**
  * @param {!./service/ampdoc-impl.AmpDoc} ampdoc
  */
 export function installGlobalSubmitListenerForDoc(ampdoc) {
-  ampdoc.getRootNode().addEventListener('submit', onDocumentFormSubmit_, true);
+  // Register global submit event listener only if the amp-form
+  // extension is used. Allowing the usage of native forms, otherwise.
+  if (isExtensionScriptInNode(ampdoc.getHeadNode(), 'amp-form')) {
+    ampdoc.getRootNode().addEventListener(
+        'submit', onDocumentFormSubmit_, true);
+  }
 }
 
 

src/element-service.js

@@ -203,6 +203,17 @@ export function extensionScriptsInNode(head) {
   return scripts;
 }
 
+/**
+ * Verifies that an extension script is present in head for
+ * installation.
+ * @param {HTMLHeadElement|Element|ShadowRoot} head
+ * @param {string} extensionId
+ * return {!Promise<boolean>}
+ */
+export function isExtensionScriptInNode(head, extensionId) {
+  return extensionScriptsInNode(head).includes(extensionId);
+}
+
 /**
  * Waits for an extension if its script is present
  * @param {!Window} win
@@ -222,7 +233,7 @@ function waitForExtensionIfPresent(win, extension, head) {
 
   // TODO(jpettitt) investigate registerExtension to short circuit
   // the dom call in extensionScriptsInNode()
-  if (!extensionScriptsInNode(head).includes(extension)) {
+  if (!isExtensionScriptInNode(head)) {
     return Promise.resolve();
   }
 

test/functional/test-document-submit.js

@@ -15,7 +15,7 @@
  */
 
 import {Services} from '../../src/services';
-import {onDocumentFormSubmit_} from '../../src/document-submit';
+import {installGlobalSubmitListenerForDoc, onDocumentFormSubmit_} from '../../src/document-submit';
 
 describe('test-document-submit onDocumentFormSubmit_', () => {
   let sandbox;
@@ -46,6 +46,43 @@ describe('test-document-submit onDocumentFormSubmit_', () => {
     sandbox.restore();
   });
 
+  describe('installGlobalSubmitListenerForDoc', () => {
+    let ampDoc;
+    let headNode;
+    let rootNode;
+    beforeEach(() => {
+      headNode = document.createElement('head');
+      rootNode = document.createElement('html');
+      ampDoc = {
+        getHeadNode: () => headNode,
+        getRootNode: () => rootNode,
+      };
+    });
+
+    afterEach(() => sandbox.reset());
+
+    it('should not register submit listener if amp-form is not registered.',
+        () => {
+          const script = document.createElement('script');
+          script.setAttribute('src', 'https://cdn.ampproject.org/v0/amp-list-0.1.js');
+          script.setAttribute('custom-element', 'amp-list');
+          ampDoc.getHeadNode().appendChild(script);
+          sandbox.spy(rootNode, 'addEventListener');
+          installGlobalSubmitListenerForDoc(ampDoc);
+          expect(rootNode.addEventListener).not.to.have.been.called;
+        });
+
+    it('should register submit listener if amp-form extension is registered.',
+        () => {
+          const script = document.createElement('script');
+          script.setAttribute('src', 'https://cdn.ampproject.org/v0/amp-form-0.1.js');
+          script.setAttribute('custom-element', 'amp-form');
+          ampDoc.getHeadNode().appendChild(script);
+          sandbox.spy(rootNode, 'addEventListener');
+          installGlobalSubmitListenerForDoc(ampDoc);
+          expect(rootNode.addEventListener).called;
+        });
+  });
 
   it('should check target and action attributes', () => {
     tgt.removeAttribute('action');

test/functional/test-element-service.js

@@ -21,6 +21,7 @@ import {
   getElementServiceIfAvailable,
   getElementServiceIfAvailableForDoc,
   getElementServiceIfAvailableForDocInEmbedScope,
+  isExtensionScriptInNode,
 } from '../../src/element-service';
 import {
   installServiceInEmbedScope,
@@ -330,6 +331,17 @@ describes.realWin('in single ampdoc', {
         expect(service).to.deep.equal({str: 'fake1'});
       });
     });
+
+    it('isExtensionScriptInNode', () => {
+      const extension = document.createElement('script');
+      extension.setAttribute('custom-element', 'amp-form');
+      extension.setAttribute('src', 'https://cdn.ampproject.org/v0/amp-form-0.1.js');
+      ampdoc.getHeadNode().appendChild(extension);
+      expect(isExtensionScriptInNode(
+          ampdoc.getHeadNode(), 'amp-form')).to.equal(true);
+      expect(isExtensionScriptInNode(
+          ampdoc.getHeadNode(), 'amp-list')).to.equal(false);
+    });
   });
 });