create separate signup form for ui testing (#213)

duckduckgo · Jun 27, 2024 · e45a22d · e45a22d
1 parent ca72e7d
commit e45a22d
Show file tree

Hide file tree

Showing 8 changed files with 95 additions and 15 deletions.
diff --git a/autofill/autoprompt/0-standard-signup-form.html b/autofill/autoprompt/0-standard-signup-form.html
@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width">
+  <title>Autofill autoprompt for signin forms</title>
+  <link rel="stylesheet" href="../style.css" />
+</head>
+
+<body>
+<p><a href="../../index.html#autofill">[Home]</a></p>
+<nav>
+  <ul class="nav">
+    <li><a href="./0-standard-signup-form.html">Sign up form present on pageload</a></li>
+    <li><a href="./1-standard-login-form.html">Login form present on pageload</a></li>
+    <li><a href="./2-form-in-modal.html">Login form in modal</a></li>
+    <li><a href="./3-multistep-form.html">Multistep login form</a></li>
+    <li><a href="./4-covered-form.html">With dialog covering the form</a></li>
+    <li><a href="./5-form-with-text.html">Form below the fold on mobile but in sidebar on larger screens</a></li>
+  </ul>
+</nav>
+
+<p id="demo"></p>
+
+<div class="">
+  <form action="success.html" id="signup">
+      <h2>Password generation during signup</h2>
+      <fieldset>
+          <label for="email">Email</label>
+          <input id="email" type="email">
+          <label for="password">Password</label>
+          <input id="password" type="password" passwordrules="minlength: 5; maxlength: 10">
+          <label for="password-2">Password Confirmation</label>
+          <input id="password-2" type="password" passwordrules="minlength: 5; maxlength: 10">
+          <button id="submit-signup" type="submit">Sign up</button>
+      </fieldset>
+  </form>
+</div>
+
+</body>
+
+</html>
diff --git a/autofill/autoprompt/1-standard-login-form.html b/autofill/autoprompt/1-standard-login-form.html
@@ -12,8 +12,9 @@
 <p><a href="../../index.html#autofill">[Home]</a></p>
 <nav>
   <ul class="nav">
-    <li><a href="./1-standard-login-form.html">Form present on pageload</a></li>
-    <li><a href="./2-form-in-modal.html">Form in modal</a></li>
+    <li><a href="./0-standard-signup-form.html">Sign up form present on pageload</a></li>
+    <li><a href="./1-standard-login-form.html">Login form present on pageload</a></li>
+    <li><a href="./2-form-in-modal.html">Login form in modal</a></li>
     <li><a href="./3-multistep-form.html">Multistep login form</a></li>
     <li><a href="./4-covered-form.html">With dialog covering the form</a></li>
     <li><a href="./5-form-with-text.html">Form below the fold on mobile but in sidebar on larger screens</a></li>

diff --git a/autofill/autoprompt/2-form-in-modal.html b/autofill/autoprompt/2-form-in-modal.html
@@ -12,8 +12,9 @@
 <p><a href="../../index.html#autofill">[Home]</a></p>
 <nav>
   <ul class="nav">
-    <li><a href="./1-standard-login-form.html">Form present on pageload</a></li>
-    <li><a href="./2-form-in-modal.html">Form in modal</a></li>
+    <li><a href="./0-standard-signup-form.html">Sign up form present on pageload</a></li>
+    <li><a href="./1-standard-login-form.html">Login form present on pageload</a></li>
+    <li><a href="./2-form-in-modal.html">Login form in modal</a></li>
     <li><a href="./3-multistep-form.html">Multistep login form</a></li>
     <li><a href="./4-covered-form.html">With dialog covering the form</a></li>
     <li><a href="./5-form-with-text.html">Form below the fold on mobile but in sidebar on larger screens</a></li>

diff --git a/autofill/autoprompt/3-multistep-form.html b/autofill/autoprompt/3-multistep-form.html
@@ -12,8 +12,9 @@
 <p><a href="../../index.html#autofill">[Home]</a></p>
 <nav>
   <ul class="nav">
-    <li><a href="./1-standard-login-form.html">Form present on pageload</a></li>
-    <li><a href="./2-form-in-modal.html">Form in modal</a></li>
+    <li><a href="./0-standard-signup-form.html">Sign up form present on pageload</a></li>
+    <li><a href="./1-standard-login-form.html">Login form present on pageload</a></li>
+    <li><a href="./2-form-in-modal.html">Login form in modal</a></li>
     <li><a href="./3-multistep-form.html">Multistep login form</a></li>
     <li><a href="./4-covered-form.html">With dialog covering the form</a></li>
     <li><a href="./5-form-with-text.html">Form below the fold on mobile but in sidebar on larger screens</a></li>

diff --git a/autofill/autoprompt/4-covered-form.html b/autofill/autoprompt/4-covered-form.html
@@ -12,8 +12,9 @@
 <p><a href="../../index.html#autofill">[Home]</a></p>
 <nav>
   <ul class="nav">
-    <li><a href="./1-standard-login-form.html">Form present on pageload</a></li>
-    <li><a href="./2-form-in-modal.html">Form in modal</a></li>
+    <li><a href="./0-standard-signup-form.html">Sign up form present on pageload</a></li>
+    <li><a href="./1-standard-login-form.html">Login form present on pageload</a></li>
+    <li><a href="./2-form-in-modal.html">Login form in modal</a></li>
     <li><a href="./3-multistep-form.html">Multistep login form</a></li>
     <li><a href="./4-covered-form.html">With dialog covering the form</a></li>
     <li><a href="./5-form-with-text.html">Form below the fold on mobile but in sidebar on larger screens</a></li>

diff --git a/autofill/autoprompt/5-form-with-text.html b/autofill/autoprompt/5-form-with-text.html
@@ -12,8 +12,9 @@
 <p><a href="../../index.html#autofill">[Home]</a></p>
 <nav>
   <ul class="nav">
-    <li><a href="./1-standard-login-form.html">Form present on pageload</a></li>
-    <li><a href="./2-form-in-modal.html">Form in modal</a></li>
+    <li><a href="./0-standard-signup-form.html">Sign up form present on pageload</a></li>
+    <li><a href="./1-standard-login-form.html">Login form present on pageload</a></li>
+    <li><a href="./2-form-in-modal.html">Login form in modal</a></li>
     <li><a href="./3-multistep-form.html">Multistep login form</a></li>
     <li><a href="./4-covered-form.html">With dialog covering the form</a></li>
     <li><a href="./5-form-with-text.html">Form below the fold on mobile but in sidebar on larger screens</a></li>

diff --git a/autofill/autoprompt/success.html b/autofill/autoprompt/success.html
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width">
+  <title>Success</title>
+  <link rel="stylesheet" href="../style.css" />
+</head>
+
+<body>
+<p><a href="../../index.html#autofill">[Home]</a></p>
+<nav>
+  <ul class="nav">
+    <li><a href="./0-standard-signup-form.html">Sign up form present on pageload</a></li>
+    <li><a href="./1-standard-login-form.html">Login form present on pageload</a></li>
+    <li><a href="./2-form-in-modal.html">Login form in modal</a></li>
+    <li><a href="./3-multistep-form.html">Multistep login form</a></li>
+    <li><a href="./4-covered-form.html">With dialog covering the form</a></li>
+    <li><a href="./5-form-with-text.html">Form below the fold on mobile but in sidebar on larger screens</a></li>
+  </ul>
+</nav>
+
+<h1>Success</h1>
+
+<!-- Just need somewhere simple to go that isn't going to cause the autofil prompt to happen automatically 
+	so we can UI test it. -->
+
+</body>
+
+</html>
diff --git a/index.html b/index.html
@@ -102,11 +102,12 @@ <h2 id="autofill">Autofill</h2>
 	<li>
 		Autoprompt credentials autofill when a login form is front and center
 		<ul>
-			<li><a href="./autofill/autoprompt/1-standard-login-form.html">Form present on pageload</a></li>
-			<li><a href="./autofill/autoprompt/2-form-in-modal.html">Form in modal</a></li>
-			<li><a href="./autofill/autoprompt/3-multistep-form.html">Multistep login form</a></li>
-			<li><a href="./autofill/autoprompt/4-covered-form.html">With dialog covering the form</a></li>
-			<li><a href="./autofill/autoprompt/5-form-with-text.html">Form below the fold on mobile but in sidebar on larger screens</a></li>
+	    <li><a href="./autofill/autoprompt/0-standard-signup-form.html">Sign up form present on pageload</a></li>
+	    <li><a href="./autofill/autoprompt/1-standard-login-form.html">Login form present on pageload</a></li>
+	    <li><a href="./autofill/autoprompt/2-form-in-modal.html">Login form in modal</a></li>
+	    <li><a href="./autofill/autoprompt/3-multistep-form.html">Multistep login form</a></li>
+	    <li><a href="./autofill/autoprompt/4-covered-form.html">With dialog covering the form</a></li>
+	    <li><a href="./autofill/autoprompt/5-form-with-text.html">Form below the fold on mobile but in sidebar on larger screens</a></li>
 		</ul>
 	</li>
 </ul>