How do I select the right elements with querySelectorAll as I do by using the Chrome developers console?

Question

I'm currently using cypress to test salesforce, and I'm running into a certain circumstance where I don't know the Party record ID that will create it within the opportunity. Meaning that I have to find a workaround to select a specific party record to be able to edit the file.

If I use the Chrome tools or doing the following within cypress, I'm able to do call the element but it will not open or click anything:

       cy.document().then((doc) => {
                const edit = doc.querySelectorAll("a")[41]
                const click = doc.querySelectorAll("a")[42]
                edit.click()
                click.click()

            })

The problem is that cypress does not make any click, and I can't move forward. Does anyone know what we can do in these scenarios?

This is the down arrow elements:

Answer 1

You can use eq() to directly get the second dropdown and execute click() on it.

cy.get('svg[data-key="down"]')             // select all dropdowns
  .eq(1)                                   // select the second
  .click();

or you might need to target the <use href...> element,

cy.get('svg[data-key="down"]')             // select all dropdowns
  .eq(1)                                   // select the second
  .find('use')                             // since this element has the href
  .click();