Support for Multiremote

[christian-bromann]

Allow users to use this assertion library with multiremote. Using the isMultiremote flag of the browser object should help to determine the current mode and allows to then iterate over the multiremote instances to do separate assertions.

[DerekCL]

Also having the same issue

Error: Unexpected return from a matcher function.
Matcher functions should return an object in the following format:
{message?: string | function, pass: boolean}
'[{"message": [Function message], "pass": true}]' was returned
at _validateResult (C:\work\r_n_d\CanIChime\node_modules\expect\build\index.js:389:11)
at processResult (C:\work\r_n_d\CanIChime\node_modules\expect\build\index.js:283:7)
at Object.throwingMatcher [as toHaveText] (C:\work\r_n_d\CanIChime\node_modules\expect\build\index.js:358:16)
at World. (C:\work\r_n_d\CanIChime\test\steps\devices.steps.ts:11:18)
at World.executeSync (C:\work\r_n_d\CanIChime\node_modules@wdio\sync\build\index.js:25:22)
at C:\work\r_n_d\CanIChime\node_modules@wdio\sync\build\index.js:46:68

[DerekCL]

@christian-bromann Is there a workaround you would recommend for right now? Currently I have a solution that works with chai that looks like this

`
const expectChai = require('chai').expect;

export const messageDevices = (
selector: $Params = '#form-devices h1',
): Promise => {
return $(selector);
};

const test = async () => {
const messageDevicesElement = await messageDevices();
// @ts-ignore
const browser: boolean[] = messageDevicesElement.isDisplayed();
browser.forEach((result) => {
expectChai(result).to.equal(true);
});
},`

The problem I have with this approach is that $() returns a type of Promise<WebdriverIO.Element>;
When we get the result in messageDevices() since this is using Multiremote we get an array of browsers on messageDevicesElement.isDisplayed(); but I have to use // @ts-ignore because it expects a boolean and not an array of booleans.

[evilC]

@christian-bromann is there any movement on this?
If not, what's the blocker? Is it something you don't know how to solve, or is it just a case of bandwidth?
I'm pretty certain that it's beyond my abilities to fix, but I may be able to persuade my employer to throw some man hours at this

[christian-bromann]

but I may be able to persuade my employer to throw some man hours at this

That would be idea, see the help wanted label 😉

[amandaflagg]

@evilC @DerekCL i have been able to work around this with my current setup i have been building out, which involves defining each browser separately for tests. for example at the top of a test file, i have the following in order to use multiremote with two different instances of chrome (both defined in wdio.conf.js):
declare const mobileChromeBrowser: WebdriverIO.MultiRemoteBrowser['mobileChromeBrowser'];
declare const chromeBrowser: WebdriverIO.MultiRemoteBrowser['chromeBrowser'];

then within the test, you can use expect based upon each browser individually. like, expect(chromeBrowser).toHaveUrl('www')

[christian-bromann]

@amandaflagg it would be however also nice to be able to make assertion for one command on both browsers, e.g.:

expect(browser).toHaveTitle(["titleA", "titleB"])

Maybe we can even allow a fancier syntax like:

expect(browser).toHaveTitle({
    mobileChromeBrowser: "titleA",
    chromeBrowser: "titleB"
})

[dprevost-LMI]

Hey, I might want to give this a shot. (See #1985)

Given the below capability config

    capabilities: {
       chromeBrowser: {},
       firefoxBrowser: {} 
    },

What about:

// Use titleA for all browsers
await expect(browser).toHaveTitle("titleA")

// Use titleA for `chromeBrowser` and titleB for `firefoxBrowser.`
await expect(browser).toHaveTitle(["titleA", "titleB"]) // With array
await expect(browser).toHaveTitle({
  chromeBrowser: "titleA",
  firefoxBrowser: "titleB"
})

// Check only for `chromeBrowser` and skip `firefoxBrowser`?
await expect(browser).toHaveTitle({
  firefoxBrowser: "titleB"
})

// Specific check for one remote while others have the same
await expect(browser).toHaveTitle({
  default: "titleA",
  firefoxBrowser: "titleA"
})

Error messages
One fails in the group:

Expect window to have title for firefoxBrowser
Expected: "The Internet"
Received: "The Interne"

Multiple fails in the group with one single value

Expect window to have title for firefoxBrowser and chromeBrowser
Expected: "The Internet"
Received: "The Interne"

Multiple fails in the group with multiple values

Expect window to have title for firefoxBrowser
Expected: "The firefox Internet"
Received: "The Internet"

Expect window to have title for chromeBrowser
Expected: "The chrome Internet"
Received: "The Internet"

Plan
Step 1: I'll start by supporting await expect(browser).toHaveTitle("titleA") with one single multi remote target, which is not even supported
Step 2: Support multiple targets in a multi-remote config
Step 3: Support multiple expect value either by array or object or both