Visible elements are "not visible" for Cypress

[ktarmyshov]

Current behavior

This is the followup for #21288

Current behavior: the visible elements are not visible and not clickable.

Desired behavior

Cypress should find these elements and click

Test code to reproduce

  it('Skeleton Fail', () => {
    cy.viewport('macbook-16');
    cy.visit('https://www.skeleton.dev/docs/get-started');
    cy.get('#sidebar-left >> section').click();
    // cy.get('#sidebar-left >> section >> button').click();
  });

Cypress Version

13.7.6

Node version

v18.19.1

Operating System

Sonoma 14.4

Debug Logs

No response

Other

No response

[jennifer-shehane]

Yah, it doesn't seem like it should error in this case to me.

[ktarmyshov]

Hi, Jennifer, thanks for following up. Some updates from my side.
It seems all elements within the skeleton menu are "invisible".

I have some buttons there in the submenu part. Was able to "click" with the following:

cy.visit(APP_PATHS.home).wait(testConfig.waitAfterVisit); // wait time 300ms to 1s - not clear when works out, 1 sec works usually
cy.getByDataTestId('button-create').invoke('show') // hover element, forcing to show
        .click({ force: true }); // force must be - otherwise cy says invisible

[senpl]

In current site version repro selector is
cy.get('#sidebar-left > div > section').click();