Waiting for page to load before action webdriver-CodePudding

With Selenium, I'm filling in a form, clicking on a button that takes me to a new page on the same tab, then I want to be able to click on a button in the new page. however I'm getting

no such element: Unable to locate element: {"method":"css selector","selector":"*[id="widget_5052246"]"}

I figured out that it's not waiting for my page to load fully, before trying to click on the next button. So I looked around and found this. added

driver.wait(function() {
  return driver.executeScript('return document.readyState').then(function(readyState) {
    return readyState === 'complete';
  });
});

However, it didn't work...

Found that I could do

await driver.wait(until.elementLocated(By.id("widget_5052246")), 20000)

then after click on the element.

But I'm getting

Error: Timeout of 30000ms exceeded. For async tests and hooks, ensure "done()" is called; if returning a Promise, ensure it resolves.

So yeah I'm not sure how I can wait for the page to load correctly...

HTML code of button :

<button id="widget_5052246" class="adbx-widget btn btn-default" data-action="play" ng-style="vm.style" ng-click="vm.click($event);" ng-mouseover="vm.onMouseOver()" ng-mouseleave="vm.onMouseLeave()" ng-mousedown="vm.onMouseDown()" ng-mouseup="vm.onMouseUp()" ng-touchstart="vm.onTouchStart()" ng-touchend="vm.onTouchEnd()" ng-hide="vm.hide" identifier="5052246" aria-hidden="false" style="visibility: visible; width: auto; height: auto; left: 260px; top: 253px; z-index: 1; transform: rotate(0deg); cursor: pointer; outline: none;"><!-- ngIf: vm.styleClass === '' --> <!-- ngIf: vm.styleClass !== '' --><span ng-if="vm.styleClass !== ''" disabled="disabled" style="opacity: 1; cursor: pointer" translate="Cliquez pour découvrir si vous avez gagné" class="ng-scope ng-binding">Cliquez pour découvrir si vous avez gagné</span><!-- end ngIf: vm.styleClass !== '' --></button>

Edit : Added code of button

CodePudding user response：

Based on the HTML shared by OP, I have constructed this xpath

//button[starts-with(@id,'widget') and starts-with(@class,'adbx-widget') and @identifier]

first you should check whether we have unique matching node in HTMLDOM or not.

PS : Please check in the dev tools (Google chrome) if we have unique entry in HTML DOM or not.

Steps to check:

Press F12 in Chrome -> go to element section -> do a CTRL F -> then paste the xpath and see, if your desired element is getting highlighted with 1/1 matching node.

If we have unique entry we can proceed further to how to click on this element.

let ele = await driver.wait(until.elementLocated(By.xpath("//button[starts-with(@id,'widget') and starts-with(@class,'adbx-widget') and @identifier]")),10000);
ele.click();

Please refer here for more on explicit waits.