> For the complete documentation index, see [llms.txt](https://docs.puppetry.app/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.puppetry.app/target/shadowdom-target.md).

# ShadowDOM Target

Imagine we have a web component `<foo-component id="fooShadowRoot">` and need to query a sub-element within its Shadow DOM. So we create a target for the foo-component:

![Defining shadow root target](/files/-Ltyu6zV9plxkktlJqvU)

Then  we create a target for the hosted element

![Defining hosted element target](/files/-LtyuBDltkgSOvUR6SEb)

The first one is a simple target like we are used to have in Puppetry, but the second is chained one. While building it we expand Options, set **Parent target** to `SHADOW_FOO` and **Parent type** to `shadow host`.

![Chained target](/files/-Ltyuth3vvu4X9qKb4xh)

As soon as the hosted element target defined (`SHADOWDOM_FOO_LOCAL`) we can address it as any simple target:

![Addressing a chained target](/files/-LtyuylKl8VVEZqJ2aEF)
