How to break out of a while loop and if statement?

Question

I need to break out both the while loop and if statement when the the value inside the if statement is great than 0, in turn the code should then break from the while loop.

How can I achieve this?

My code is as follows:

it('x Accordion description should appear after 5 seconds upon being clicked', function(done) {
      //this.timeout(15000);
      //setTimeout(done, 6000);
      var i = 0;
      while (i < 15000) {
          browser.click('#accordion');
          //var timeoutText = browser.getText('#timeout').length;
          var timeoutText = browser.getText('#timeout').length;
          console.log(timeoutText);

            if (timeoutText > 0) {
                  browser.pause(5000);
                  console.log("Pass");
                  break;
                  i++;
            }
      }

Thanks for your help.

Answer 1

Use a label to break out

 outer: while (i < 15000) {
    browser.click('#accordion');
    //var timeoutText = browser.getText('#timeout').length;
    var timeoutText = browser.getText('#timeout').length;
    console.log(timeoutText);

    if (timeoutText > 0) {
        browser.pause(5000);
        console.log("Pass");
        break outer;
        i++;
    }
}

Answer 2

Would adding the condition to the while statement work?

it('x Accordion description should appear after 5 seconds upon being clicked', function(done) {
      //this.timeout(15000);
      //setTimeout(done, 6000);
      var i = 0;
      var timeoutText = 1;
      while (i < 15000 && timeoutText <= 0) {
          browser.click('#accordion');              
          timeoutText = browser.getText('#timeout').length;
          console.log(timeoutText);

            if (timeoutText > 0) {
                  browser.pause(5000);
                  console.log("Pass");
                  i++;
            }
      }

Also, if you don't need to run the while loop, this could be written more simply, for ex.

it('x Accordion description should appear after 5 seconds upon being clicked', function(done) {
      //this.timeout(15000);
      //setTimeout(done, 6000);
      var i = 0;
      var timeoutText = browser.getText('#timeout').length;
      while (i < 15000 && timeoutText <= 0) {
          browser.click('#accordion');              
          timeoutText = browser.getText('#timeout').length;
          console.log(timeoutText);
          browser.pause(5000);
          console.log("Pass");
          i++;
      }

Answer 3

it('x Accordion description should appear after 5 seconds upon being clicked', function() {
    // http://webdriver.io/api/utility/waitUntil.html
    browser.waitUntil(function () {
      // Your condition to wait:
      browser.click('#accordion');
      return browser.getText('#timeout').length > 0
    }, 
    15200, // Waiting timeout 15 secs, but actually only 3 clicks will be done
    'expected accordion description should appear after 5 seconds upon being clicked', 
    5000) // Pooling interval - each 5 secs
}