From 178f783a16df59ae293e5ed9567f033b1a7858d3 Mon Sep 17 00:00:00 2001
From: adamjmcgrath <adam.mcgrath@auth0.com>
Date: Fri, 26 Feb 2021 11:16:43 +0000
Subject: [PATCH] Disable form submit manually for passwordless Safari

---
 src/__tests__/ui/box/container.test.jsx | 18 ++++++++++++++++++
 src/ui/box/container.jsx                |  5 +++++
 2 files changed, 23 insertions(+)

diff --git a/src/__tests__/ui/box/container.test.jsx b/src/__tests__/ui/box/container.test.jsx
index d23a26226..2eed28524 100644
--- a/src/__tests__/ui/box/container.test.jsx
+++ b/src/__tests__/ui/box/container.test.jsx
@@ -54,6 +54,24 @@ describe('Container', () => {
     expect(mock.calls.length).toBe(0);
   });
 
+  it('should submit the form when the submit button is not disabled', () => {
+    const c = getContainer({ disableSubmitButton: false });
+    const connectionResolverMock = jest.fn();
+    require('core/index').connectionResolver = () => connectionResolverMock;
+
+    c.handleSubmit(mockEvent);
+    expect(connectionResolverMock).toHaveBeenCalled();
+  });
+
+  it('should not submit the form when the submit button is disabled', () => {
+    const c = getContainer({ disableSubmitButton: true });
+    const connectionResolverMock = jest.fn();
+    require('core/index').connectionResolver = () => connectionResolverMock;
+
+    c.handleSubmit(mockEvent);
+    expect(connectionResolverMock).not.toHaveBeenCalled();
+  });
+
   describe('with a custom `connectionResolver`', () => {
     let connectionResolverMock;
     let setResolvedConnectionMock;
diff --git a/src/ui/box/container.jsx b/src/ui/box/container.jsx
index 5e98f3508..d30ff1642 100644
--- a/src/ui/box/container.jsx
+++ b/src/ui/box/container.jsx
@@ -99,6 +99,11 @@ export default class Container extends React.Component {
 
   handleSubmit(e) {
     e.preventDefault();
+    // Safari does not disable form submits when the submit button is disabled
+    // on single input (eg. passwordless) forms, so disable it manually.
+    if (this.props.disableSubmitButton) {
+      return;
+    }
 
     this.checkConnectionResolver(() => {
       const { submitHandler } = this.props;