I just found this issue and didn't find any topic or solution related to this problem anywhere. When a second browser tab is opened (the new tab is automatically focused) I can not interact with any web elements because Webdriver.io is searching for the respective element in the DOM tree of the first browser tab. I thought if I change focus with browser.switchWindow() to the first tab and then focus on the second again will fix the issue but didn't. I couldn't find a workaround or solution for this problem.
The code below represents my approach.
Given(/^Test given$/, async () => {
await browser.url("https://www.google.com/?client=safari");
await browser.newWindow("https://www.facebook.com");
await $("facebook element selector").click();
});