fix: add cy.find + cy.if support (#33)

* testing find command * fix: add cy.find command support
bahmutov · Sep 22, 2022 · 9a0aa4a · 9a0aa4a
1 parent 6050502
commit 9a0aa4a
Show file tree

Hide file tree

Showing 3 changed files with 82 additions and 4 deletions.
diff --git a/cypress/checkbox.html b/cypress/checkbox.html
@@ -1,12 +1,12 @@
 <html>
   <head></head>
   <body>
-    <div>
+    <div id="app1">
       <input type="checkbox" id="enrolled" />
       <span>Enrolled already</span>
     </div>
 
-    <div>
+    <div id="app2">
       <input type="checkbox" id="agreed" checked />
       <span>Agree</span>
     </div>

diff --git a/cypress/e2e/find.cy.js b/cypress/e2e/find.cy.js
@@ -0,0 +1,52 @@
+/// <reference types="cypress" />
+// @ts-check
+
+import '../../src'
+
+describe('cy.find', () => {
+  it('takes the if branch', () => {
+    cy.visit('cypress/checkbox.html')
+    cy.get('#app1')
+      .find('#enrolled')
+      .if('exist')
+      .then(cy.spy().as('if'))
+      .log('checkbox found')
+      .else()
+      .log('checkbox not found')
+      .then(cy.spy().as('else'))
+    cy.get('@if').should('have.been.called')
+    cy.get('@else').should('not.have.been.called')
+  })
+
+  it('takes the else branch', () => {
+    cy.visit('cypress/checkbox.html')
+    // the checkbox should not be checked
+    cy.get('#enrolled').should('not.be.checked')
+
+    cy.get('#app1')
+      .find('#enrolled')
+      .if('checked')
+      .then(cy.spy().as('if'))
+      .log('checkbox found')
+      .else()
+      .log('checkbox not found')
+      .then(cy.spy().as('else'))
+    cy.get('@else').should('have.been.called')
+    cy.get('@if').should('not.have.been.called')
+  })
+
+  // https://github.com/bahmutov/cypress-if/issues/32
+  it('checks if the element exists (it does not)', () => {
+    cy.visit('cypress/checkbox.html')
+    cy.get('#app1')
+      .find('#doest-not-exist')
+      .if('exist')
+      .then(cy.spy().as('if'))
+      .log('checkbox found')
+      .else()
+      .log('checkbox not found')
+      .then(cy.spy().as('else'))
+    cy.get('@else').should('have.been.called')
+    cy.get('@if').should('not.have.been.called')
+  })
+})
diff --git a/src/index.js b/src/index.js
@@ -220,12 +220,12 @@ Cypress.Commands.overwrite('get', function (get, selector, options) {
 Cypress.Commands.overwrite(
   'contains',
   function (contains, prevSubject, selector, text, options) {
-    debug('contains arguments number', arguments.length)
+    debug('cy.contains arguments number', arguments.length)
     if (arguments.length === 3) {
       text = selector
       selector = undefined
     }
-    debug('contains args', { prevSubject, selector, text, options })
+    debug('cy.contains args', { prevSubject, selector, text, options })
 
     const cmd = cy.state('current')
     debug(cmd)
@@ -248,6 +248,32 @@ Cypress.Commands.overwrite(
   },
 )
 
+Cypress.Commands.overwrite(
+  'find',
+  function (find, prevSubject, selector, options) {
+    debug('cy.find args', { prevSubject, selector, options })
+
+    const cmd = cy.state('current')
+    debug(cmd)
+    const next = cmd.attributes.next
+
+    if (next && next.attributes.name === 'if') {
+      // disable the built-in assertion
+      return find(prevSubject, selector, options).then(
+        (getResult) => {
+          debug('internal cy.find result', getResult)
+          return getResult
+        },
+        (noResult) => {
+          debug('no cy.find result', noResult)
+        },
+      )
+    }
+
+    return find(prevSubject, selector, options)
+  },
+)
+
 Cypress.Commands.overwrite('task', function (task, args, options) {
   debug('cy.task %o', { args, options })