AssertionError: the given combination of arguments (promise and string) is invalid for this assertion

Question

I try use wdio + moch + chai. This is code, which wdio generate when I config it.

import LoginPage from  '../pageobjects/login.page';
import SecurePage from '../pageobjects/secure.page';

describe('My Login application', () => {
it('should login with valid credentials', async () => {
    await LoginPage.open();

    await LoginPage.login('tomsmith', 'SuperSecretPassword!');
    await expect(SecurePage.flashAlert).toBeExisting();
    await expect(SecurePage.flashAlert).toHaveTextContaining(
        'You logged into a secure area!');
  });
});

Its ok, everything is working. But when I try add chai and use assertions from chai, my tests fail with:

AssertionError: the given combination of arguments (promise and string) is invalid for this assertion. You can use an array, a map, an object, a set, a string, or a weakset instead of a string.

I use wdio in async mode. This is my code with chai

import * as chai from "chai";

import LoginPage from  '../pageobjects/login.page';
import SecurePage from '../pageobjects/secure.page';

const {expect} = chai

describe('My Login application', () => {
 it('should login with valid credentials', async () => {
    await LoginPage.open();

    await LoginPage.login('tomsmith', 'SuperSecretPassword!');
    await expect(SecurePage.flashAlert).exist;
    await expect(SecurePage.flashAlert).contain(
        'You logged into a secure area!');
   });
});

Answer 1

In the first example, you're using assertions from the expect-webdriverio library, which are async operations. So, you have to add the await keyword before expect to await the assertion.

In the second example, you're using assertions from the chai library, which are not async operations. So, you don't need to add the await keyword before expect, instead of that, you have to add the await keyword before async operations. Besides, if you're using chai library for assertion you'll have to add methods such as isExisting and getText. In your case it should be:

import * as chai from "chai";

import LoginPage from  '../pageobjects/login.page';
import SecurePage from '../pageobjects/secure.page';

const {expect} = chai

describe('My Login application', () => {
 it('should login with valid credentials', async () => {
    await LoginPage.open();

    await LoginPage.login('tomsmith', 'SuperSecretPassword!');

    // added ↓ added ↓                       added ↓ and changed ↓
    expect(await (await SecurePage.flashAlert).isExisting()).to.be.true;
    expect(await (await SecurePage.flashAlert).getText()).contain(
        'You logged into a secure area!');
   });
});