Tests breaking on Electron, seemingly because no CSS Grid support

[chronicIntrovert]

• Operating System: MacOS Sierra (10.12.6)
• Cypress Version: Beta Version 1.0.3
• Browser Version: Electron 53

Is this a Feature or Bug?

Bug if there is CSS Grid support, feature if there isn't

Current behavior:

Currently, the browser does not properly display the webpage due to what I suspect is lack of support for CSS Grid. As a result, my element does not appear on the page and cannot be clicked on.

Desired behavior:

The web page should be properly displayed.

How to reproduce:

Implement something with CSS Grid, make sure the element that ends up being rendered is not visible due to lack of proper positioning with CSS grid.

Test code:

it('Selecting subsystem', function() {
      cy.wait(5000);
      cy.get('span.meta-text')
        .contains(subsystem)
        .click();
      cy.get('input[name=Subsystem]').should('have.value', subsystem);
});

Additional Info (images, stack traces, etc)

[jennifer-shehane]

The Electron version is close to the equivalent of the Chromium version (with a few differences), so yes, CSS Grid Layout support didn't come into Chrome until 57, I believe. We intend to update Electron to version 58 on our next big release #895

For now, you could use our docker container to spin up Chrome and have this work in your CI. https://github.com/cypress-io/cypress-docker-images/blob/master/browsers/chrome/Dockerfile

[brian-mann]

Fixed by #1275.

[brian-mann]

Released in 2.0.0.