2

I have a function that waits for a selector under the scope of an element. The ElementHandle I'm passing in doesn't seem to be getting updated as the DOM updates- I log the outerHTML of this element each time my waitForFunction call fails, and changes aren't there.

async function waitForSubElSelector(page, el, subElSelector) {
  // offset/rects checks for visible check (from https://stackoverflow.com/a/33456469)
  await page.waitForFunction((selector, scopeEl) => {
      const subEl = scopeEl.querySelector(selector)
      let found = !!(subEl && (subEl.offsetWidth || subEl.offsetHeight || subEl.getClientRects().length));
      if (!found) {
        console.log(`waitForSubElSelector failed EL: ${scopeEl.outerHTML}  SELECTOR: "${selector}", ${!subEl ? 'not found' : subEl.offsetWidth + ', ' + subEl.offsetHeight + ', ' + subEl.getClientRects().length}`)
      }
      return found;
    }, {}, subElSelector, el
  ).catch(e => {
    console.log(`waitForSubElSelector failed w/ selector '${subElSelector}'`)
    throw e;
  })
  return await el.$(subElSelector);
}

I also verified this in the browser Console - I'm able to find the element and then the selector from there.

One use case is waiting for a Next button to be available, e.g.:

await waitForSubElSelector(this.browserPage, pageEl, '#nextButton:not([disabled])')

How can I get this working?

One idea I had— maybe my web framework replaces part of the DOM so the ElementHandle I have isn't the current one; is there some 'in-DOM' check in Puppeteer?

Crag
  • 1,723
  • 17
  • 35
  • Are you using this code is testing? most testing frameworks have built in methods to await for element visibility. – Abdul Rauf Aug 11 '21 at 12:27
  • Not in a test framework, but this code is using Puppeteer, and it's trying to do something similar to Puppeteer's Page.waitForSelector. – Crag Aug 11 '21 at 12:40
  • Could you add a fixed timeout on each of your steps, see if this runs ? If it does run like this, it might be because the element is present in the DOM, but no javascript action have been attached to it yet. – Félix Aug 11 '21 at 14:44
  • The waitForFunction call gets polled - it runs hundreds of times before it times out, and it is still running well after I see the UI is updated, so I don't think adding more timeouts will help. – Crag Aug 11 '21 at 15:16
  • 2
    Can you show the page or HTML that this is supposed to be interacting with, in the interests of a [mcve]? – ggorlen Aug 11 '21 at 15:25
  • 1
    Is it possible that the element is inside an iframe? – vsemozhebuty Aug 11 '21 at 15:29
  • Nope, no iframe. – Crag Aug 11 '21 at 15:35

0 Answers0