I’m testing an app using detox that renders a web view but it can’t click a button that appears after clicking a link.

My flow is like so:

1. Click on a link on the web view

   const myWebView = web(by.id("web-view"));
   const myLink = myWebView.element(by.web.cssSelector("div a"))
   await myLink.tap();
   

2. After the link is clicked and the page is rendered, click on a button

   const myButton = myWebView.element(by.web.cssSelector("div button"))
   await myButton.tap();
   

At this point, I get Test Failed: Failed to evaluate JavaScript on web view: <RNCWKWebView: 0x162079200; frame = (0 0; 393 675.333); backgroundColor = UIExtendedSRGBColorSpace 1 1 1 1; layer = <CALayer: 0x6000004b7960>>. JS exception: Element not found

I was hoping that I’d be able to use waitFor but that seems to be specific to the NativeElement type

I’ve also tried await expect(myButton).toExist(); but got

Test Failed: Failed on web expectation: TOEXIST with params on element with CSS == 'div button', web-view: <RNCWKWebView: 0x10c0ea800; frame = (0 0; 393 675.333); backgroundColor = UIExtendedSRGBColorSpace 1 1 1 1; layer = <CALayer: 0x600000842100>>. Got evaluation result: false. Element info: `<null>`

I threw a console.log(await element(by.type("RCTView")).getAttributes()); before clicking the button since it takes a few seconds before a value is returned and it was able to click the button just fine since the button was completed rendered by then. I’d rather wait for the element to exist or be visible though.