I have a shadow-root element I can view in my browser console. ex:

document.querySelector(".class").shadowRoot.querySelector(".button")

In Java(Selenium Webdriver), I was able to use Selenium click command using something like:

JavascriptExecutor js = (JavascriptExecutor) driver; 
WebElement el = (WebElement) js.executeScript("return document.querySelector(".class").shadowRoot.querySelector(".button")");
el.click();

In Javascript(WebdriverIO), I can click the same element using execute() and appending click() to the JSpath:

browser.execute (document.querySelector(".class").shadowRoot.querySelector(".button").click();)

But I want to to know if there's an alternative to this Javascript click. Is it possible to convert the JSpath to a WebElement just like I did in Java? I want to utilize WebdriverIO's browser.click(selector) method. I tried:

var obj = browser.execute (return document.querySelector(".class").shadowRoot.querySelector(".button"))
var el = browser.elements (obj); //how to convert???
browser.click(el);

I also saw others that use $(selector).shadow$(selector). But I want to try using my original JSpath(document.querySelector...).