Protractor cannot find selector in the page

Question

I have such a code:

it('should go to summary page without sending the order', async () => {
    stepExecutor.startTimer();
    // redirects, rather than checking logging 
    await stepExecutor.executeStep(loginWithCustomer, {
      name: 'loginWithCustomer',
      description: 'Page: login'
    });
    // 
    await stepExecutor.executeStep(selectFirstSubscription, {
      name: 'selectFirstSubscription',
      description: 'Page: abo first'
    });
});

async function loginWithCustomer() {
  const page = createLoginPage(browser.params.space);
  await page.navigateTo(browser.params.login.url);
  await page.enterLogin(browser.params.login.username, browser.params.login.password);
  await page.redirect(`${browser.baseUrl}${ABO_FIRST_URI}`);
}

async function selectFirstSubscription() {
  const page = new AboFirstPage();
  await page.closeCookieNotification();
  await page.selectFirstSubscription();
}

export class AboFirstPage {
  async selectFirstSubscription() {
    await element(by.css('.button--primary')).click();
  }
}

It exposes me an error:

- Failed: No element found using locator: By(css selector, .button--primary)

Executed 1 of 1 spec (1 FAILED) in 5 secs.
[18:04:59] I/launcher - 0 instance(s) of WebDriver still running
[18:04:59] I/launcher - chrome #01 failed 1 test(s)
[18:04:59] I/launcher - overall: 1 failed spec(s)
[18:04:59] E/launcher - Process exited with error code 1

But on the page where it makes a redirect to (function loginWithCustomer), such a selector presents. And element(by.css('.button--primary')) returns an object: What can be wrong in this code?

Answer 1

Let's check on waiting issue. Add sleep to this function:

async function selectFirstSubscription() {
  const page = new AboFirstPage();
  await page.closeCookieNotification();
  await browser.sleep(5000);
  await page.selectFirstSubscription();
}

If it will work then you have waiting issue and before clicking on element you should add explicit waiter. For example await ExpectedConditions.elementToBeClickable(element)