title: why am i getting TypeError: Cannot read property 'getText' of undefined error even though my web element reference is correct?
body: <p>I'm getting an error returned when i run a protractor test.</p>
  
  <p>Here is the reference to the webelement in the directories.page.js file:</p>
  
  <pre><code>get importErrorsList(){
      return element.all(by.css('[ng-if="error.error.detailMessage"]'));
  }
  </code></pre>
  
  <p>Here is a screenshot of the webelement and it's source info:
  <a href="https://i.stack.imgur.com/16iWU.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/16iWU.png" alt="webelement and source"></a>
  And finally here is the step that i am using to reference the webelement, which is returning the error:</p>
  
  <pre><code>Then(/^The list of import errors contains this error message: "([^"]*)"$/, function (errorText, callback) {
          browser.wait(EC.visibilityOf(importPageObj.alertMsg), timeouts.EC_TIMEOUT).then(function(){
              browser.wait(() =&gt; {  
  //the next line causes the error 
  expect(directoriesPageObj.importErrorsList.getText()).to.eventually.contain(errorText).and.notify(callback);
                  }, timeouts.EC_TIMEOUT).then(() =&gt; {
                  browser.wait(EC.and(EC.visibilityOf(importPageObj.headerDropDownInWebView), EC.elementToBeClickable(importPageObj.headerDropDownInWebView)), timeouts.EC_TIMEOUT).then(() =&gt; {
                      callback();
                  });
              });
          });
      });
  </code></pre>
  
  <p>could anyone help me figure out why this isn't working? </p>