diff --git a/src/PseudoStateTool.js b/src/PseudoStateTool.js
index 48809f1..a30e0d4 100644
--- a/src/PseudoStateTool.js
+++ b/src/PseudoStateTool.js
@@ -18,7 +18,10 @@ const options = Object.keys(PSEUDO_STATES).sort()
 
 export const PseudoStateTool = () => {
   const [{ pseudo }, updateGlobals] = useGlobals()
-  const isActive = useCallback((option) => pseudo?.[option] === true, [pseudo])
+  const isActive = useCallback((option) => {
+      if (!pseudo) return false
+      return pseudo[option] === true;
+  }, [pseudo])
 
   const toggleOption = useCallback(
     (option) => () => updateGlobals({ pseudo: { ...pseudo, [option]: !isActive(option) } }),
diff --git a/src/withPseudoState.js b/src/withPseudoState.js
index a85ee46..f8f0d41 100644
--- a/src/withPseudoState.js
+++ b/src/withPseudoState.js
@@ -93,7 +93,7 @@ export const withPseudoState = (StoryFn, { viewMode, parameters, id, globals: gl
 // Rewrite CSS rules for pseudo-states on all stylesheets to add an alternative selector
 const rewriteStyleSheets = (shadowRoot) => {
   let styleSheets = shadowRoot ? shadowRoot.styleSheets : document.styleSheets
-  if (shadowRoot?.adoptedStyleSheets?.length) styleSheets = shadowRoot.adoptedStyleSheets
+  if (shadowRoot && shadowRoot.adoptedStyleSheets ? shadowRoot.adoptedStyleSheets.length : undefined) styleSheets = shadowRoot.adoptedStyleSheets
   Array.from(styleSheets).forEach((sheet) => rewriteStyleSheet(sheet, shadowRoot, shadowHosts))
 }