diff --git a/src/__tests__/to-be-in-the-document.js b/src/__tests__/to-be-in-the-document.js
index e6e9287c..6dae6ba3 100644
--- a/src/__tests__/to-be-in-the-document.js
+++ b/src/__tests__/to-be-in-the-document.js
@@ -2,12 +2,29 @@ import {HtmlElementTypeError} from '../utils'
import document from './helpers/document'
test('.toBeInTheDocument', () => {
+ const window = document.defaultView
+
+ window.customElements.define(
+ 'custom-element',
+ class extends window.HTMLElement {
+ constructor() {
+ super()
+ this.attachShadow({mode: 'open'}).innerHTML =
+ '
'
+ }
+ },
+ )
+
document.body.innerHTML = `
Html Element
- `
+
+ `
const htmlElement = document.querySelector('[data-testid="html-element"]')
const svgElement = document.querySelector('[data-testid="svg-element"]')
+ const customElementChild = document
+ .querySelector('[data-testid="custom-element"]')
+ .shadowRoot.querySelector('[data-testid="custom-element-child"]')
const detachedElement = document.createElement('div')
const fakeElement = {thisIsNot: 'an html element'}
const undefinedElement = undefined
@@ -15,6 +32,7 @@ test('.toBeInTheDocument', () => {
expect(htmlElement).toBeInTheDocument()
expect(svgElement).toBeInTheDocument()
+ expect(customElementChild).toBeInTheDocument()
expect(detachedElement).not.toBeInTheDocument()
expect(nullElement).not.toBeInTheDocument()
diff --git a/src/to-be-in-the-document.js b/src/to-be-in-the-document.js
index 8dcf5f50..765b3cf5 100644
--- a/src/to-be-in-the-document.js
+++ b/src/to-be-in-the-document.js
@@ -6,7 +6,9 @@ export function toBeInTheDocument(element) {
}
const pass =
- element === null ? false : element.ownerDocument.contains(element)
+ element === null
+ ? false
+ : element.ownerDocument === element.getRootNode({composed: true})
const errorFound = () => {
return `expected document not to contain element, found ${this.utils.stringify(