/cypress

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

cy.click on a SVG or an element containing SVG throws Illegal Invocation error in Cypress 3.0.3 #2258

Closed
greglds opened this Issue Aug 2, 2018 · 1 comment

Comments

Assignees
No one assigned
Labels
Milestone
  3.1.0
3 participants
@greglds @brian-mann @jennifer-shehane
@greglds

greglds commented Aug 2, 2018

Current behavior:

Since update to 3.0.3, cy.get( "element containing SVG" ).click() throws an error:
CypressError: Timed out retrying: Illegal invocation

Available workaround is to use { force: true } (doesn't work when clicking on SVG directly)

Desired behavior:

The same behavior as the other elements (not containing SVG): a simple click.

Steps to reproduce:

given this html body:

<body>
    <span id="test-text" href="#">
        text
    </span>
    <span id="test-svg" href="#">
        <svg height="100" width="100">
            <circle cx="50" cy="50" r="40" stroke="black" stroke-width="3" fill="red" />
        </svg>
    </span>
</body>

and this spec:

describe("test click on svg", () => {
	beforeEach( () => {
		cy.visit('/');
	} );
	
	it( "clicks a span containing text", () => {
		cy.get("#test-text").click();
	} );
	
	it( "clicks a span containing SVG", () => {
		cy.get("#test-svg").click();
	} );
});

I obtain this result:

cypress-svg-bug

My current workaround:

Cypress.Commands.overwrite("click", (originalFn, subject, options = {}) => { 
    if( subject[ 0 ].getElementsByTagName('svg').length ) { 
        Object.assign( options, { force: true } ); 
    } 
 
    return originalFn(subject, options); 
});

Versions

Cypress 3.0.3, Windows 7, Chrome v 67.0.3396.99

On a side note, Cypress is great !
@brian-mann

This comment has been minimized.

Sign in to view
Member

brian-mann commented Aug 2, 2018

This has already been fixed in a PR and will go out in the next patch release... approximately less than 24 hours.

#2246

@brian-mann brian-mann closed this Aug 2, 2018

@brian-mann brian-mann added the type: duplicate label Aug 2, 2018

@brian-mann brian-mann referenced this issue Aug 2, 2018

Merged

ensure that SVG elements can be clicked and focused correctly #2246

@jennifer-shehane jennifer-shehane added this to the 3.1.0 milestone Aug 2, 2018

@jennifer-shehane jennifer-shehane removed stage: in progress stage: pending release labels Aug 6, 2018

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment