diff --git a/src/compiler/output-targets/dist-hydrate-script/hydrate-factory-closure.ts b/src/compiler/output-targets/dist-hydrate-script/hydrate-factory-closure.ts
index c844358ed7e..690d30838a5 100644
--- a/src/compiler/output-targets/dist-hydrate-script/hydrate-factory-closure.ts
+++ b/src/compiler/output-targets/dist-hydrate-script/hydrate-factory-closure.ts
@@ -43,6 +43,7 @@ export function hydrateFactory($stencilWindow, $stencilHydrateOpts, $stencilHydr
   var CSS = $stencilWindow.CSS;
   var CustomEvent = $stencilWindow.CustomEvent;
   var Document = $stencilWindow.Document;
+  var ShadowRoot = $stencilWindow.ShadowRoot;
   var DocumentFragment = $stencilWindow.DocumentFragment;
   var DocumentType = $stencilWindow.DocumentType;
   var DOMTokenList = $stencilWindow.DOMTokenList;
diff --git a/src/mock-doc/shadow-root.ts b/src/mock-doc/shadow-root.ts
new file mode 100644
index 00000000000..0ba6f93f149
--- /dev/null
+++ b/src/mock-doc/shadow-root.ts
@@ -0,0 +1,62 @@
+import { MockDocumentFragment } from './document-fragment';
+
+export class MockShadowRoot extends MockDocumentFragment {
+  get activeElement(): HTMLElement | null {
+    return null;
+  }
+
+  set adoptedStyleSheets(_adoptedStyleSheets: StyleSheet[]) {
+    throw new Error('Unimplemented');
+  }
+
+  get adoptedStyleSheets(): StyleSheet[] {
+    return [];
+  }
+
+  get cloneable(): boolean {
+    return false;
+  }
+
+  get delegatesFocus(): boolean {
+    return false;
+  }
+
+  get fullscreenElement(): HTMLElement | null {
+    return null;
+  }
+
+  get host(): HTMLElement | null {
+    let parent = this.parentElement();
+    while (parent) {
+      if (parent.nodeType === 11) {
+        return parent;
+      }
+      parent = parent.parentElement();
+    }
+    return null;
+  }
+
+  get mode(): 'open' | 'closed' {
+    return 'open';
+  }
+
+  get pictureInPictureElement(): HTMLElement | null {
+    return null;
+  }
+
+  get pointerLockElement(): HTMLElement | null {
+    return null;
+  }
+
+  get serializable(): boolean {
+    return false;
+  }
+
+  get slotAssignment(): 'named' | 'manual' {
+    return 'named';
+  }
+
+  get styleSheets(): StyleSheet[] {
+    return [];
+  }
+}
diff --git a/src/mock-doc/window.ts b/src/mock-doc/window.ts
index 3c0bc5e408b..226984b5a53 100644
--- a/src/mock-doc/window.ts
+++ b/src/mock-doc/window.ts
@@ -22,6 +22,7 @@ import { MockNavigator } from './navigator';
 import { MockElement, MockHTMLElement, MockNode, MockNodeList } from './node';
 import { MockPerformance, resetPerformance } from './performance';
 import { MockResizeObserver } from './resize-observer';
+import { MockShadowRoot } from './shadow-root';
 import { MockStorage } from './storage';
 
 const nativeClearInterval = clearInterval;
@@ -188,6 +189,10 @@ export class MockWindow {
     this.__docFragCstr = docFragCstr;
   }
 
+  get ShadowRoot() {
+    return MockShadowRoot;
+  }
+
   get DocumentType() {
     if (this.__docTypeCstr == null) {
       const ownerDocument = this.document;