bodyContains: Walk up the nested shadow root chain to check if the body contains the element

[andrejota]

Description

bodyContains() currently assumes that shadow root host element is always contained in the root body. That may not be the case and I experienced problem when nesting web components that rely on HTMX (e.g. hx-get. This change walks up the chain of shadow roots to find the topmost host element and verify for that one if it exists in the root body.

I did not find a corresponding issue, but I did find an older related issue: #718. I didn't file a new issue as it looks like a fairly straight-forward fix for what I think is just a bug.

Testing

I ran this with my test site which uses nested web components ('open' shadow DOM) combined with HTMX. This change enabled hx-get="..." with hx-target="click" to work for me.

Checklist

• [X] I have read the contribution guidelines
• [X] I have targeted this PR against the correct branch (master for website changes, dev for source changes)
• [X] This is either a bugfix, a documentation update, or a new feature that has been explicitly approved via an issue
• [X] I ran the test suite locally (npm run test) and verified that it succeeded

[jackielii]

I'm having this issue in 2.0.0-beta4. I have a simple post button:

<button
	hx-post={ formatUrl("/workflows/%s/runs", props.WorkflowName) }
	hx-target="body"
	hx-push-url="true"
>Run</button>

This returns the entire html, thus replacing "body". In version 1.9, there's no error, but in 2.0.0-beta4. I get "htmx:swapError"

[Telroshan]

Hey, following up late on this @andrejota, could you fix your code's formatting (npm run format) to pass the CI? Thanks!

Ideally, adding a test case would greatly help to identify & ensure the issue is indeed fixed and doesn't get broken again in the future

[andrejota]

Hey, following up late on this @andrejota, could you fix your code's formatting (npm run format) to pass the CI? Thanks!

Ideally, adding a test case would greatly help to identify & ensure the issue is indeed fixed and doesn't get broken again in the future

Yup, happy to do it. On it.

[Telroshan]

Hey @andrejota , we had a recent PR that addressed the nested shadow roots issue, see #3034 (released alongside htmx 2.0.4) Could you confirm if that solves the issue here?