feat: add debug logging (#4)

README.md

@@ -40,6 +40,18 @@ If the dialog was invisible, the visibility assertion fails, and the rest of the
 
 ![Dialog was closed](./img/dialog-closed.png)
 
+## Debugging
+
+This module uses [debug](https://github.com/debug-js/debug#readme) module to output verbose browser console messages when needed. To turn the logging on, open the browser's DevTools console and set the local storage entry:
+
+```js
+localStorage.debug = 'cypress-if'
+```
+
+If you re-run the tests, you should see the messages appear in the console
+
+![Debug messages in the console](./img/debug.png)
+
 ## Small print
 
 Author: Gleb Bahmutov <gleb.bahmutov@gmail.com> © 2022

package.json

@@ -24,5 +24,8 @@
   "repository": {
     "type": "git",
     "url": "https://github.com/bahmutov/cypress-if.git"
+  },
+  "dependencies": {
+    "debug": "^4.3.4"
   }
 }

src/index.js

@@ -1,10 +1,12 @@
+const debug = require('debug')('cypress-if')
+
 Cypress.Commands.add(
   'if',
   { prevSubject: true },
   function (subject, assertion) {
     const cmd = cy.state('current')
-    console.log('if', cmd.attributes, 'subject', subject)
-    console.log('next command', cmd.next)
+    debug('if', cmd.attributes, 'subject', subject)
+    debug('next command', cmd.next)
 
     const hasSubject = Boolean(subject)
     let assertionsPassed = true
@@ -20,19 +22,19 @@ Cypress.Commands.add(
     if (!hasSubject || !assertionsPassed) {
       let nextCommand = cmd.attributes.next
       while (nextCommand) {
-        console.log(
+        debug(
           'skipping the next "%s" command "%s"',
           nextCommand.attributes.type,
           nextCommand.attributes.name,
         )
         // cy.log(`**skipping ${cmd.attributes.next.attributes.name}**`)
-        console.log('skipping "%s"', nextCommand.attributes.name)
-        console.log(nextCommand.attributes)
+        debug('skipping "%s"', nextCommand.attributes.name)
+        debug(nextCommand.attributes)
         nextCommand.attributes.skip = true
 
         nextCommand = nextCommand.attributes.next
         if (nextCommand && nextCommand.attributes.type === 'parent') {
-          console.log(
+          debug(
             'stop skipping commands, see a parent command "%s"',
             nextCommand.attributes.name,
           )
@@ -52,27 +54,21 @@ Cypress.Commands.add(
 Cypress.Commands.overwrite('get', function (get, selector) {
   // can we see the next command already?
   const cmd = cy.state('current')
-  console.log(cmd)
+  debug(cmd)
   const next = cmd.attributes.next
 
   if (next && next.attributes.name === 'if') {
     // disable the built-in assertion
     return get(selector).then(
       (getResult) => {
-        console.log('internal get result', getResult)
+        debug('internal get result', getResult)
         return getResult
       },
       (noResult) => {
-        console.log('no get result', noResult)
-        debugger
+        debug('no get result', noResult)
       },
     )
   }
 
   return get(selector)
 })
-
-// Cypress.Commands.overwrite('click', function (click, subject) {
-//   console.log('my click', subject)
-//   return click(subject)
-// })