0

CodeceptJS - I need to check a checkbox, only if it's not checked already.

I created a helper method to check the condition, and it is returning the right value, but the code inside if statement is not getting executed.

Helper Class/method:

class CommonHelper {
    async clickIfPresent(elementToCheck, elementToClick, conditionCheck){
        try {
          const numVisible =  await I.grabNumberOfVisibleElements(elementToCheck);
          console.info('grab numVisible - ', numVisible, ', conditionCheck - ', conditionCheck);
          if (numVisible === conditionCheck) {
              console.info('elementToClick inside if - ', elementToClick);        
              I.click(elementToClick);
              I.wait(2);
      }
    } catch (err) {
      console.log('Skipping operation as element is not visible');
    }
}

module.exports = new CommonHelper();

Method call:

Class EnableCheckbox {
const checkboxState = '//mat-checkbox[@formcontrolname="chkBxEnabled"]//input[@aria-checked="true"]';
const checkboxTag = '//mat-checkbox[@formcontrolname="chkBxEnabled"]';

enableCheckboxIfPresent(){
    commonHelper.clickIfPresent(checkboxState, checkboxTag, 0);
    I.seeElement(checkboxState);
  }
}   

I see step.before, step.after for the code inside if statement, but it doesn't get executed:

Emitted | step.start (I grab number of visible elements "//mat-checkbox[@formcontrolname="chkBxEnabled"]//input[@aria-checked="true"]")
  CommonHelper: clickIfPresent 
    I grab number of visible elements "//mat-checkbox[@formcontrolname="chkBxEnabled"]//input[@aria-checked="true"]"
Emitted | step.passed (I grab number of visible elements "//mat-checkbox[@formcontrolname="chkBxEnabled"]//input[@aria-checked="true"]")
Emitted | step.finish (I grab number of visible elements "//mat-checkbox[@formcontrolname="chkBxEnabled"]//input[@aria-checked="true"]")
grab numVisible -  0 , conditionCheck -  0
elementToClick inside if -  //mat-checkbox[@formcontrolname="chkBxEnabled"]
Emitted | step.before (I click "//mat-checkbox[@formcontrolname="chkBxEnabled"]")
Emitted | step.after (I click "//mat-checkbox[@formcontrolname="chkBxEnabled"]")
Emitted | step.before (I wait 2)
Emitted | step.after (I wait 2)
Emitted | step.start (I see element "//mat-checkbox[@formcontrolname="chkBxEnabled"]//input[@aria-checked="true"]")
  EnableCheckbox: enableCheckboxIfPresent 
    I see element "//mat-checkbox[@formcontrolname="chkBxEnabled"]//input[@aria-checked="true"]"
    › [SmartWait (20000ms)] Locating //mat-checkbox[@formcontrolname="chkBxEnabled"]//input[@aria-checked="true"] in 20000
[1] Error | Error: Element "//mat-checkbox[@formcontrolname="chkBxEnabled"]//input[@aria-checked="true"]" was not found by text|CSS|XPath
Emitted | step.failed (I see element "//mat-checkbox[@formcontrolname="chkBxEnabled"]//input[@aria-checked="true"]")
Emitted | step.finish (I see element "//mat-checkbox[@formcontrolname="chkBxEnabled"]//input[@aria-checked="true"]")

Am I missing anything here? Or is there any other way to accomplish this? TIA!

Vaij
  • 129
  • 1
  • 5

1 Answers1

0

Code inside if statement is getting executed. You can see it in logs as: elementToClick inside if - //mat-checkbox[@formcontrolname="chkBxEnabled"]

Methods inside I are not executed.

There are no I in helper. If you look into custom helper docs, there are no I using in it.

Instead of it use this.helpers.<helper name with method>.<method>, e.g. this.helpers.WebDriver.wait(2)

As alternative. Maybe (not tested), const {I} = inject(); in start of helper file will help you.

  • Thanks for your answer. Pardon me if this is something obvious that I am not getting it. How come "I.grabNumberOfVisibleElements(elementToCheck);" is getting executed in this method? – Vaij Sep 04 '19 at 13:17
  • If you use WebDriver helper, then `this.helpers.WebDriver. grabNumberOfVisibleElements(elementToCheck); `. – Evgeny Lukoyanov Sep 05 '19 at 14:44