I am trying to get an element and use Cypress type mand but getting this error: ResizeObserver loop pleted with undelivered notifications. Here is my code:

`get signatureBtn() {
        return cy.get('#signature').type('userName')
    }`

I use below code in my support/e2e.js file but still getting the error.

    Cypress.on('uncaught:exception', (err, runnable) => {
    if (err.message.includes('ResizeObserver loop pleted with undelivered notifications.')) {
        // ignore the error
        return false
    }
})

Can somebody advise please why I am getting this error? Thanks a lot!

I am trying to get an element and use Cypress type mand but getting this error: ResizeObserver loop pleted with undelivered notifications. Here is my code:

`get signatureBtn() {
        return cy.get('#signature').type('userName')
    }`

I use below code in my support/e2e.js file but still getting the error.

    Cypress.on('uncaught:exception', (err, runnable) => {
    if (err.message.includes('ResizeObserver loop pleted with undelivered notifications.')) {
        // ignore the error
        return false
    }
})

Can somebody advise please why I am getting this error? Thanks a lot!

• javascript
• cypress
• uncaught-exception

• Uncaught exceptions are used for app events. Your error is from your test code not app code. – jjhelguero Commented Jul 28, 2023 at 15:24
• Could be LastPass extension like in this one stackoverflow./a/76190200/6996515 – mccarths Commented Aug 4, 2023 at 5:06
• I tried installing LastPass but could not replicate the error. – Bjarne Gerhardt-Pedersen Commented Dec 20, 2023 at 7:53

1 Answer 1

The uncaught exception handler looks ok, but it looks possible that the exception is not caused by the get #signature, it just occurs during that mand.

Since uncaught exception is thrown asynchronously from the app under test, it can be ing from a previous mand that has an action that changes the page. For example, it's possible the click handler of NextButton1 in causing it (or even something before that action).

To debug the problem, ment out your current handler.

Then add this code around the suspect line,

const stub = cy.stub()
Cypress.on('uncaught:exception', (err, runnable) => {
  if (err.message.includes('ResizeObserver')) {
      stub()
      return false
  }
})

cy.get('#signature').type('userName')

cy.wrap(stub).should('have.been.called') 

If should('have.been.called') fails, then it's not that line - move backwards in the test and check the previous line

const stub = cy.stub()
Cypress.on('uncaught:exception', (err, runnable) => {
  if (err.message.includes('ResizeObserver')) {
      stub()
      return false
  }
})

cy.get('[data-test="NextButton"]').click()

cy.wrap(stub).should('have.been.called') 

and so on until you find the line that is failing.

ResizeObserver is often used to provide animation, so once you find the line that causes the error, add a visibility check to allow the page to settle before testing #signature.

Something like

cy.get('[data-test="NextButton"]').click()

cy.get('some-element-that-appears-after-click')
  .should('be.visible')                          // wait for animation