0

could you please help me with targeting the concrete element in e2e test?

I´m using Jest and Puppeteer and I have this DOM structure (see in attachment below): And I need to target the red underlined element. How would you target that element?

I tried it like this,

const inputContent = await page.findAll(
 'usu-date-picker >>> .sc-usu-input >>> div',
);
console.log(inputContent[1]);

but what I got returned was element with type node "INPUT", which I don´t understand why.

Thank you for your help.

enter image description here

Michael Rýdl
  • 97
  • 1
  • 8
  • This doesn't look like Puppeteer. What testing/browser automation is this? If it is Puppeteer and `.findAll` is some test suite thing I'm not familiar with, I'd suggest [Puppeteer not giving accurate HTML code for page with shadow roots](https://stackoverflow.com/questions/68525115/puppeteer-not-giving-accurate-html-code-for-page-with-shadow-roots/68540701#68540701) which links over half a dozen resources on working with shadow roots. – ggorlen Jul 04 '22 at 16:21

1 Answers1

0

you can use this:

await page.evaluate( () => 
document.querySelector("#date-picker")
.shadowRoot.querySelector("usu-input > div > input")
.shadowRoot.querySelector("div:nth-child(2)").value
);

You should try the query in the devtools console to see if you are doing it right

Example from devtools console

Faustino Delpoggio
  • 1
  • 1
  • 1
    Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Jul 06 '22 at 05:52
  • Thanks for your suggestion, but it doesn´t work like that. It throws error: "Evaluation failed: TypeError: Cannot read properties of null (reading 'shadowRoot')" – Michael Rýdl Jul 07 '22 at 06:15
  • Is the image you shared all the code? Because if you have more shadowRoot you need to put it like in my example. And you should try the query in the devtools console to see if you are doing it right – Faustino Delpoggio Jul 07 '22 at 15:29