From 2091c625581c17eff71e0b7f929f4236faceec60 Mon Sep 17 00:00:00 2001
From: Nathan Hunzaker <nate.hunzaker@gmail.com>
Date: Mon, 4 Dec 2017 08:59:53 -0500
Subject: [PATCH] Add test fixture for initial input validation bug in Firefox
 (#11760)

---
 .../components/fixtures/text-inputs/index.js  | 40 +++++++++++++++++++
 1 file changed, 40 insertions(+)

diff --git a/fixtures/dom/src/components/fixtures/text-inputs/index.js b/fixtures/dom/src/components/fixtures/text-inputs/index.js
index 8bf2b36de1..af71edcbb5 100644
--- a/fixtures/dom/src/components/fixtures/text-inputs/index.js
+++ b/fixtures/dom/src/components/fixtures/text-inputs/index.js
@@ -42,6 +42,46 @@ class TextInputFixtures extends React.Component {
           </p>
         </TestCase>
 
+        <TestCase
+          title="Required Inputs"
+          affectedBrowsers="Firefox"
+          relatedIssues="8395">
+          <TestCase.Steps>
+            <li>View this test in Firefox</li>
+          </TestCase.Steps>
+
+          <TestCase.ExpectedResult>
+            You should{' '}
+            <b>
+              <i>not</i>
+            </b>{' '}
+            see a red aura, indicating the input is invalid.
+            <br />
+            This aura looks roughly like:
+            <input style={{boxShadow: '0 0 1px 1px red', marginLeft: 8}} />
+          </TestCase.ExpectedResult>
+
+          <Fixture>
+            <form className="control-box">
+              <fieldset>
+                <legend>Text</legend>
+                <input required={true} />
+              </fieldset>
+              <fieldset>
+                <legend>Date</legend>
+                <input type="date" required={true} />
+              </fieldset>
+            </form>
+          </Fixture>
+
+          <p className="footnote">
+            Checking the date type is also important because of a prior fix for
+            iOS Safari that involved assigning over value/defaultValue
+            properties of the input to prevent a display bug. This also
+            triggered input validation.
+          </p>
+        </TestCase>
+
         <TestCase title="Cursor when editing email inputs">
           <TestCase.Steps>
             <li>Type "user@example.com"</li>