Fail to click a button Cypress Community #i-need-help

Fail to click a button

clever-night-39043

05/03/2023, 6:34 AM

Hi all I am trying to click a button, but got this error:

Copy code

TypeError: Cannot read properties of null (reading 'classList')

The button is like this

Copy code

<button _ngcontent-dxy-c108="" id="CopyBtn" type="button" aria-label="Copy URL" data-bs-toggle="dropdown">Copy Link</button>

I am not sure what is wrong with it. Can anyone please help? Thanks

https://cdn.discordapp.com/attachments/1103208026636304434/1103208026929897482/image.png▾

gray-kilobyte-89541

05/03/2023, 10:47 AM

Click on the error, see the stack in the devtools console, your application code probably does something that throws an error

clever-night-39043

05/04/2023, 12:02 AM

The stack trace is like this:

Copy code

Print to console
at hi._isShown (https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/js/bootstrap.bundle.min.js:6:44054)
at hi.toggle (https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/js/bootstrap.bundle.min.js:6:42116)
at HTMLButtonElement.<anonymous> (https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/js/bootstrap.bundle.min.js:6:46773)
at HTMLDocument.n (https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/js/bootstrap.bundle.min.js:6:4135)

Not sure if it has anything to do with bootstrap because that is what we use. Is there a way to just force it to click? I already put {force: true} but still fails. Thanks.

future-journalist-95278

05/04/2023, 6:19 AM

It looks like you're trying to get the button using it's classList, which shouldn't appear because the button doesn't have any classes. Can you share your Cypress code?

clever-night-39043

05/04/2023, 1:04 PM

i am using ID only

Copy code

button#CopyBtn

. it's true this button element has no class attribute, and i have asked the devs to add ID so i can locate it. don't know why it would complain about 'classList'

future-journalist-95278

05/04/2023, 4:49 PM

Is this content being dynamically generated using a DB or some other source?

clever-night-39043

05/05/2023, 3:14 AM

doesn't seem so. it's like a drop down menu. click a share icon, and then this button shows up to copy link. that's all.

famous-address-83265

05/20/2023, 1:59 AM

This error is thrown by your application. Cypress fails the test if there are uncaught exceptions that are not handled by your application.

careful-petabyte-59223

05/20/2023, 2:49 PM

you can also use the data to target an element it is actually what cypress suggest because as you are experiencing class names and id names can change at any time and lead to failing test in the future data-bs-toggle="dropdown"

Previous Next