diff --git a/plugins/techdocs-react/src/context.tsx b/plugins/techdocs-react/src/context.tsx
index 2e7cd9586d..43fdada98e 100644
--- a/plugins/techdocs-react/src/context.tsx
+++ b/plugins/techdocs-react/src/context.tsx
@@ -25,7 +25,6 @@ import React, {
 } from 'react';
 import useAsync, { AsyncState } from 'react-use/esm/useAsync';
 import useAsyncRetry from 'react-use/esm/useAsyncRetry';
-import useCounter from 'react-use/esm/useCounter';
 
 import {
   CompoundEntityRef,
@@ -65,8 +64,6 @@ export type TechDocsReaderPageValue = {
   entityMetadata: AsyncState<TechDocsEntityMetadata>;
   shadowRoot?: ShadowRoot;
   setShadowRoot: Dispatch<SetStateAction<ShadowRoot | undefined>>;
-  shadowRootVersion: number;
-  incShadowRootVersion: () => void;
   title: string;
   setTitle: Dispatch<SetStateAction<string>>;
   subtitle: string;
@@ -83,8 +80,6 @@ const defaultTechDocsReaderPageValue: TechDocsReaderPageValue = {
   setTitle: () => {},
   setSubtitle: () => {},
   setShadowRoot: () => {},
-  shadowRootVersion: 0,
-  incShadowRootVersion: () => {},
   metadata: { loading: true },
   entityMetadata: { loading: true },
   entityRef: { kind: '', name: '', namespace: '' },
@@ -139,7 +134,6 @@ export const TechDocsReaderPageProvider = memo(
     const [shadowRoot, setShadowRoot] = useState<ShadowRoot | undefined>(
       defaultTechDocsReaderPageValue.shadowRoot,
     );
-    const [shadowRootVersion, { inc: incShadowRootVersion }] = useCounter(0);
 
     useEffect(() => {
       if (shadowRoot && !metadata.value && !metadata.loading) {
@@ -159,8 +153,6 @@ export const TechDocsReaderPageProvider = memo(
       entityMetadata,
       shadowRoot,
       setShadowRoot,
-      shadowRootVersion,
-      incShadowRootVersion,
       title,
       setTitle,
       subtitle,
@@ -198,5 +190,6 @@ export const useTechDocsReaderPage = () => {
   if (context === undefined) {
     throw new Error('No context found for version 1.');
   }
+
   return context;
 };
diff --git a/plugins/techdocs-react/src/hooks.ts b/plugins/techdocs-react/src/hooks.ts
index 2984a4b588..bbff875f3a 100644
--- a/plugins/techdocs-react/src/hooks.ts
+++ b/plugins/techdocs-react/src/hooks.ts
@@ -13,7 +13,7 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import { useState, useEffect, useMemo } from 'react';
+import { useEffect, useMemo, useState } from 'react';
 import debounce from 'lodash/debounce';
 import { useTechDocsReaderPage } from './context';
 
@@ -39,9 +39,28 @@ export const useShadowRootElements = <
   selectors: string[],
 ): TReturnedElement[] => {
   const shadowRoot = useShadowRoot();
-  if (!shadowRoot) return [];
+  const [root, setRootNode] = useState(shadowRoot?.querySelector('html'));
+
+  useEffect(() => {
+    let observer: MutationObserver;
+    if (shadowRoot) {
+      observer = new MutationObserver(() => {
+        setRootNode(shadowRoot.querySelector('html'));
+      });
+      observer.observe(shadowRoot, {
+        attributes: true,
+        characterData: true,
+        childList: true,
+        subtree: true,
+      });
+    }
+    return () => observer?.disconnect();
+  }, [shadowRoot]);
+
+  if (!root) return [];
+
   return selectors
-    .map(selector => shadowRoot?.querySelectorAll<TReturnedElement>(selector))
+    .map(selector => root.querySelectorAll<TReturnedElement>(selector))
     .filter(nodeList => nodeList.length)
     .map(nodeList => Array.from(nodeList))
     .flat();
diff --git a/plugins/techdocs/src/reader/components/TechDocsReaderPageContent/TechDocsReaderPageContent.tsx b/plugins/techdocs/src/reader/components/TechDocsReaderPageContent/TechDocsReaderPageContent.tsx
index 00df73cab3..3692ed22d3 100644
--- a/plugins/techdocs/src/reader/components/TechDocsReaderPageContent/TechDocsReaderPageContent.tsx
+++ b/plugins/techdocs/src/reader/components/TechDocsReaderPageContent/TechDocsReaderPageContent.tsx
@@ -80,7 +80,6 @@ export const TechDocsReaderPageContent = withTechDocsReaderProvider(
       entityMetadata: { value: entityMetadata, loading: entityMetadataLoading },
       entityRef,
       setShadowRoot,
-      incShadowRootVersion,
     } = useTechDocsReaderPage();
     const dom = useTechDocsReaderDom(entityRef);
     const path = window.location.pathname;
@@ -103,12 +102,11 @@ export const TechDocsReaderPageContent = withTechDocsReaderProvider(
     const handleAppend = useCallback(
       (newShadowRoot: ShadowRoot) => {
         setShadowRoot(newShadowRoot);
-        incShadowRootVersion();
         if (onReady instanceof Function) {
           onReady();
         }
       },
-      [setShadowRoot, incShadowRootVersion, onReady],
+      [setShadowRoot, onReady],
     );
 
     // No entity metadata = 404. Don't render content at all.