Only replace the shadow dom if the content is changed to avoid a flickering UI

Signed-off-by: Dominik Henneke <dominik.henneke@sda-se.com>

.changeset/techdocs-dull-glasses-decide.md

@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-techdocs': patch
+---
+
+Only replace the shadow dom if the content is changed to avoid a flickering UI.

plugins/techdocs/src/reader/components/Reader.tsx

@@ -397,6 +397,11 @@ const TheReader = ({
   const dom = useTechDocsReaderDom();
   const shadowDomRef = useRef<HTMLDivElement>(null);
 
+  const onReadyRef = useRef<() => void>(onReady);
+  useEffect(() => {
+    onReadyRef.current = onReady;
+  }, [onReady]);
+
   useEffect(() => {
     if (!dom || !shadowDomRef.current) return;
     const shadowDiv = shadowDomRef.current;
@@ -406,8 +411,10 @@ const TheReader = ({
       shadowRoot.removeChild(child),
     );
     shadowRoot.appendChild(dom);
-    onReady();
-  }, [dom, onReady]);
+    onReadyRef.current();
+
+    // this hook must ONLY be triggered by a changed dom
+  }, [dom]);
 
   return (
     <>