Cypress doesn't find action-sheet-group element within ion-select component #22743
Unanswered
ilsehaydee
asked this question in
Questions and Help
Replies: 0 comments
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Uh oh!
There was an error while loading. Please reload this page.
Uh oh!
There was an error while loading. Please reload this page.
-
Hello, I'm using ionic with angular and I was assigned to test an specific part of an application using cypress, where the user has to enter data to a form, the form is conformed by various ion-select elements, which is as component that basically gives you a group of options and you must select one.

I have some custom commands, one to get the form element,

one to edit the form,


one to select and make a click on an element and an option
and one that helps you select one of the options of the group of options of the ion select component which I named actionSheetItemClick, this command is used when the select command validates that it encountered an element of type ion-select



I'm using the cypress playground to show you that it is there.

that's why this command is used inside the select command. My commands work fine, I can get the form, and I can make a click on the ion-select dropdown, it shows me the different options, but then the error occurs when the actionSheetItemClick command tries to find the .action-sheet-group element , which is the div that contains the group of options to select, it should find it and then I should be able to click one of the options by passing the text value that one of the options contain,
This is achieved by assigning a data-testid to the ion-select element , that's how you assign a value to it, as if it was a normal object with a property-value structure
but it fails when it tries to find the .action-sheet-group element,
I don't know why that happens because the element IS visible but cypress doesn't find it even though it's there.
I made a very simple project with only one screen containing a form and within the form there is an ion-select. To reproduce the error just open cypress and run the only existing test
The error is thrown when the actionSheetItemClick command is used, because it's when it tries to find the .action-sheet-group class
I wanted to leave the project here, where you should find the commands, the test and the home template where the wrapper-component is being used, which is the component that contains the form with the ion-select element. but the maximum size of files allowed is 25 mb, how else could I provide the project?
Beta Was this translation helpful? Give feedback.
All reactions