Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Cannot read property 'ownerDocument' of null #6923

Closed
averri opened this issue Apr 2, 2020 · 6 comments · Fixed by #7010
Closed

Cannot read property 'ownerDocument' of null #6923

averri opened this issue Apr 2, 2020 · 6 comments · Fixed by #7010
Assignees
@sainthkh
Labels
type: bug

Comments

@averri
Copy link

averri commented Apr 2, 2020 •
edited

Current behavior:

Clicking on a chart element causes the retry to fail.

This is the error:

image

Desired behavior:

The click action should work as expected. The click should select the chart in the following point:

image

Test code to reproduce

context('Actions', () => {

  beforeEach(() => {
    cy.visit('https://demo.spotfire.cloud.tibco.com/spotfire/wp/analysis?file=/Public/Airbnb%20Boston%20Listings')
  })

  it('select chart value', () => {
    cy.wait(6000) // Give time for the chart to render. Ideally, this should wait on the specific HTML element.
    cy.get('div[title="Property Type Distribution"]').parent().parent().parent().click(150, 60) // This click will fail.
  })

})

Second version of code to reproduce that does not rely on cy.wait():

context('Actions', () => {

  beforeEach(() => {
    cy.visit('https://demo.spotfire.cloud.tibco.com/spotfire/wp/analysis?file=/Public/Airbnb%20Boston%20Listings')
  })

  it('select chart value', () => {
    cy.get('div[title="Property Type Distribution"]').as('chartTitle').parent().parent().parent()
      .within(el => {
        cy.get('div.sf-element-canvas-image').invoke('attr', 'sf-busy').should('eq', 'false')
        cy.wrap(el).as('chart').click(150, 60) // This click will fail.
      })
  })

})

Versions

Windows 10, Chrome or Electron, any version.

  "devDependencies": {
    "cypress": "^4.3.0"
  },
@jennifer-shehane
Copy link
Member

I can recreate this.

Screen Shot 2020-04-06 at 2 06 22 PM

This is throwing from here: https://github.com/cypress-io/cypress/blob/develop/packages/driver/src/dom/document.ts#L34:L34

If you track the stack trace up further - this method is resolving to null, which is being passed along to the other commands.

https://github.com/cypress-io/cypress/blob/develop/packages/driver/src/cy/mouse.js#L548:L548

Screen Shot 2020-04-06 at 3 34 44 PM

The getFirstCommonAncestor basically does not find the current element within their common ancestors - looping through until it gets to curEl.parentNode that is null.

Screen Shot 2020-04-06 at 3 40 21 PM

Probably a similar situation to #6787 and/or #6707 cc @sainthkh

@cypress-bot cypress-bot bot added the stage: ready for work The issue is reproducible and in scope label Apr 6, 2020
@sainthkh sainthkh self-assigned this Apr 6, 2020
@sainthkh
Copy link
Contributor

sainthkh commented Apr 6, 2020

I'll check this out.

@jennifer-shehane
Copy link
Member

@sainthkh You may want to VPN into east coast US because this site loads incredibly slow in Asia.

@sainthkh
Copy link
Contributor

sainthkh commented Apr 7, 2020

Thankfully, the site wasn't slow in South Korea. It might be because of the world's fastest Internet South Korea has.

Anyway, I researched the problem and found the cause.

cy.click() command doesn't issue native mouse event, but it only simulates it (#311).

To run that simulation, we check mouseUpPhase and mouseDownPhase:

cypress/packages/driver/src/cy/mouse.js

Lines 530 to 534 in 069b22b

const mouseDownPhase = mouse.down(fromElViewport, forceEl, pointerEvtOptionsExtend, mouseEvtOptionsExtend)
const skipMouseupEvent = mouseDownPhase.events.pointerdown.skipped || mouseDownPhase.events.pointerdown.preventedDefault
const mouseUpPhase = mouse.up(fromElViewport, forceEl, skipMouseupEvent, pointerEvtOptionsExtend, mouseEvtOptionsExtend)

And then, check if the target element of mouseDownPhase exists:

cypress/packages/driver/src/cy/mouse.js

Lines 542 to 545 in 069b22b

// Only send click event if mousedown element is not detached.
if ($elements.isDetachedEl(mouseDownPhase.targetEl)) {
return { skipClickEventReason: 'element was detached' }
}

This code doesn't consider this case: what if the target element of mouseUpPhase doesn't exist?

That's the cause of the problem in this issue.

When you click an item in the chart, the app tries to make a drag area, div.sf-canvas-drag-cursor. That's the target element of mouseUpPhase because it's right below the mouse pointer.

Screenshot from 2020-04-07 17-39-18

But it doesn't exist any more when getFirstCommonAncestor() starts. That's why getFirstCommonAncestor() loops up to the <html> tag and null.

The solution might be just returning the mouseDownPhase element.

Implementation isn't hard, but I'm asking this just in case to avoid breaking change:

When this code was written, was there a specific case that mouseUpPhase always exists?

@kuceb kuceb mentioned this issue Apr 14, 2020
Merged
2 tasks
@cypress-bot cypress-bot bot added stage: work in progress There is an open PR for this issue [WIP] stage: needs review The PR code is done & tested, needs review and removed stage: ready for work The issue is reproducible and in scope stage: work in progress There is an open PR for this issue [WIP] labels Apr 14, 2020
@cypress-bot
Copy link
Contributor

cypress-bot bot commented Apr 20, 2020

The code for this is done in cypress-io/cypress#7010, but has yet to be released.
We'll update this issue and reference the changelog when it's released.

@cypress-bot cypress-bot bot added stage: pending release There is a closed PR for this issue and removed stage: needs review The PR code is done & tested, needs review labels Apr 20, 2020
@cypress-bot
Copy link
Contributor

cypress-bot bot commented Apr 20, 2020

Released in 4.4.1.

This comment thread has been locked. If you are still experiencing this issue after upgrading to
Cypress v4.4.1, please open a new issue.

@cypress-bot cypress-bot bot removed the stage: pending release There is a closed PR for this issue label Apr 20, 2020
@cypress-bot cypress-bot bot locked as resolved and limited conversation to collaborators Apr 20, 2020
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees

@sainthkh sainthkh

Labels
type: bug
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

fix error thrown when mouseup element is detached before click cypress-io/cypress
3 participants
@jennifer-shehane @averri @sainthkh