add terms test

bahmutov · Sep 5, 2022 · 73daf4e · 73daf4e
1 parent 52d4d8c
commit 73daf4e
Show file tree

Hide file tree

Showing 4 changed files with 61 additions and 1 deletion.
diff --git a/cypress/e2e/checked.cy.js b/cypress/e2e/checked.cy.js
@@ -1,4 +1,3 @@
-/// <reference types="cypress" />
 // @ts-check
 
 import '../../src'

diff --git a/cypress/e2e/terms-and-conditions.cy.js b/cypress/e2e/terms-and-conditions.cy.js
@@ -0,0 +1,25 @@
+// @ts-check
+
+import '../../src'
+
+it.only('submits the terms forms', () => {
+  cy.visit('cypress/terms.html')
+  cy.get('#agreed')
+    .if('not.checked')
+    .click()
+    .else()
+    .log('The user already agreed')
+  cy.get('button#submit').click()
+})
+
+it('submits the terms forms using cy.then', () => {
+  cy.visit('cypress/terms.html')
+  cy.get('#agreed').then(($input) => {
+    if ($input.is(':checked')) {
+      cy.log('The user already agreed')
+    } else {
+      cy.wrap($input).click()
+    }
+  })
+  cy.get('button#submit').click()
+})
diff --git a/cypress/terms.html b/cypress/terms.html
@@ -0,0 +1,31 @@
+<html>
+  <head>
+    <style>
+      button {
+        margin-top: 1rem;
+      }
+    </style>
+  </head>
+  <body>
+    <div>
+      <input type="checkbox" id="agreed" />
+      <span>I agree to the terms & conditions.</span>
+    </div>
+    <button id="submit" disabled>Submit</button>
+    <script>
+      document.getElementById('agreed').addEventListener('change', (e) => {
+        document.getElementById('submit').disabled = !e.target.checked
+      })
+
+      if (Math.random() < 0.5) {
+        console.log('checked = true')
+        // in 50% of the cases, the checkbox is checked
+        // in other cases, the checkbox is unchecked
+        document.getElementById('agreed').checked = true
+        document.getElementById('submit').disabled = false
+      } else {
+        console.log('checked = false')
+      }
+    </script>
+  </body>
+</html>
diff --git a/jsconfig.json b/jsconfig.json
@@ -0,0 +1,5 @@
+{
+  "compilerOptions": {
+    "types": ["cypress"]
+  }
+}