fix: handle toHaveText when receiving an array of elements

[sangcnguyen]

I'm trying to take a stab at this #1555. Could you help me review it?

[christian-bromann]

Amazing work , thanks so much!

🎉

[wdio-bot]

Hey sangcnguyen 👋

Thank you for your contribution to WebdriverIO! Your pull request has been marked as an "Expensable" contribution. We've sent you an email with further instructions on how to claim your expenses from our development fund. Please make sure to check your spam folder as well. If you have any questions, feel free to reach out to us at [email protected] or in the contributing channel on Discord.

We are looking forward to more contributions from you in the future 🙌

Have a nice day,
The WebdriverIO Team 🤖

[lacell75]

Thanks for this PR , but toHaveText is not working with expect.arrayContaining.
For example, I wish to convert this deprecated API

await expect($('div').toHaveTextContaining(['text1', 'text2']);

with:

await expect($('div').toHaveText(expect.arrayContaining(['text1', 'text2'])            );

I have this error :

[chrome 125.0.6422.144 Windows 10 #0-0] Error: Expect $(`div`) to have text
[chrome 125.0.6422.144 Windows 10 #0-0] Error: Expect $(`div`) to have text
[chrome 125.0.6422.144 Windows 10 #0-0] Expected: ArrayContaining ["text1", "text2"]
[chrome 125.0.6422.144 Windows 10 #0-0] Received: "text1"

[christian-bromann]

@lacell75 thanks for reporting. @sangcnguyen Let's make sure we can support both use cases.

[sangcnguyen]

My hunch is does the code below work? I didn't know the use case of using 'expect.arrayContaining' before, so why do we need it?

await expect(await $('div')).toHaveText(['text1', 'text2']); 

[christian-bromann]

@lacell75 mind providing more details? What do you expect to be asserted when calling

await expect($('div').toHaveText(expect.arrayContaining(['text1', 'text2']));

Do you expect that text1 and text2 are text in the div element? I also didn't know that await expect($('div').toHaveTextContaining(['text1', 'text2']); worked before 🤔