Merge pull request #373 from kbss-cvut/365-undefined-options

Resolve `Cannot read length property in Storybook` error
kbss-cvut · Nov 4, 2024 · dc4a2fe · dc4a2fe
2 parents 6abc8e8 + b07753f
commit dc4a2fe
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 7 deletions.
diff --git a/jest-environment-jsdom.cjs b/jest-environment-jsdom.cjs
@@ -18,6 +18,7 @@ class JSDOMEnvironment extends $JSDOMEnvironment {
     if (!global.TextEncoder) global.TextEncoder = TextEncoder;
     if (!global.TextDecoder) global.TextDecoder = TextDecoder;
     if (!global.Uint8Array) global.Uint8Array = Uint8Array;
+    this.global.structuredClone = structuredClone;
   }
 }
 

diff --git a/src/components/answer/TypeaheadAnswer.jsx b/src/components/answer/TypeaheadAnswer.jsx
@@ -14,7 +14,7 @@ import { IntelligentTreeSelect } from "intelligent-tree-select/lib/components/In
 import "intelligent-tree-select/lib/styles.css";
 
 const processTypeaheadOptions = (options, intl) => {
-  if (!options || !options.length) {
+  if (options === undefined || !options.length) {
     return [];
   }
 
@@ -41,9 +41,9 @@ const TypeaheadAnswer = (props) => {
   const intl = configurationContext.options.intl;
 
   const [isLoading, setLoading] = useState(true);
-  const [optionsList, setOptionsList] = useState([
-    processTypeaheadOptions(props.options, intl),
-  ]);
+  const [optionsList, setOptionsList] = useState(
+    processTypeaheadOptions(props.options, intl)
+  );
 
   useEffect(() => {
     let isCancelled = false;
@@ -79,7 +79,7 @@ const TypeaheadAnswer = (props) => {
     return () => {
       isCancelled = true;
     };
-  }, []);
+  }, [queryHash, formGenContext, props.question, intl]);
 
   const generateTreeOptions = (possibleValues) => {
     if (!possibleValues) {
@@ -169,8 +169,7 @@ const TypeaheadAnswer = (props) => {
             ? noLinksValueRenderer
             : null
         }
-        valueIsControlled={true}
-        value={optionsList.filter((option) => option.id === props.value)}
+        value={optionsList.find((option) => option.id === props.value) || null}
         multi={false}
         options={optionsList}
         isSearchable={true}