When using `cy.get('#element').click()`, what's ha...
# help
g
When using
cy.get('#element').click()
, what's happening in the background? We're encountering an error which only happens when the cypress test runs. If we mimic its behavior manually we don't have any issues. Here is [the test](https://github.com/carbon-design-system/carbon-for-ibm-dotcom/pull/8174/files#diff-a00eb0a05c99c0a2bdfd49f3f79145e86aeeb09e909c68c3c8c42f3cbda2841dR52-R71) Here is the page of the deploy environment that has [the component being tested](https://ibmdotcom-web-components-experimental.s3.us-east.cloud-object-storage.appdomain.cloud/deploy-previews/8174/iframe.html?id=components-cloud-masthead--default) The failure:
Copy code
dds-masthead | cloud platform (desktop)
    ✓ should have url for IBM logo (3613ms)
    ✓ should have cloud platform name (4120ms)
    ✓ should load top-nav with no more than one active item (4079ms)
    (Attempt 1 of 3) should have tabbed-interface megamenus
    (Attempt 2 of 3) should have tabbed-interface megamenus
    1) should have tabbed-interface megamenus
    ✓ should have functioning search bar with typeahead (7118ms)
    ✓ should have contact, login, and create-account CTAs (5095ms)


1) dds-masthead | cloud platform (desktop)
       should have tabbed-interface megamenus:
     AssertionError: Timed out retrying after 90000ms: expected '<div#panel-0-0>' to be 'visible'

This element `<div#panel-0-0>` is not visible because its parent `<dds-cloud-megamenu-right-navigation>` has CSS property: `visibility: hidden`
      at Context.eval (http://localhost:8081/__cypress/tests?p=tests/e2e-storybook/cypress/integration/masthead/cloud/cloud-masthead.e2e.js:150:33)
Here is a video clip from the test run
@User here's the detailed version of my problem
I managed to find a workaround. Setting
.click('right')
where the click didn't happen in an area within the bounds of each tab's child text node seems to work as expected
But I can't make this happen outside cypress at all
You can see the last item clicked in the video above is "logging and monitoring". The text crosses the center of the button, where cypress clicks by default. Moving the click location to the right fixes it, as does shortening the inner text to something like "logging"
computers are weird sometimes ¯\_(ツ)_/¯
a
Is it possible the element being selected, isn't the element intended to be selected? Maybe it's nested? Would you mind inspecting the page?
m
anyone had troubles with cy.select triggering React onChange event callbacks since upgrading to 9.5?
a
Not that I have heard of, but it doesn't mean there is not an issue. I'd ask in the #755921365579595977 channel. That is most likely the best place that will most likely surface any similar issues.
4 Views