Added useEffects but this breaks tests

This is an ongoing issue with shallow wrapping and the useEffect hook unfortunately! See enzymejs/enzyme#2011

src/components/FromBob/fromBob.ts

@@ -1,7 +1,7 @@
 /* Provide the same component as fromJson but converting bob files and
 providing a useful widget dictionary */
 
-import { useState } from "react";
+import { useState, useEffect } from "react";
 import PropTypes from "prop-types";
 import log from "loglevel";
 
@@ -59,20 +59,31 @@ export const WidgetFromBob = (
   // Extract props
   let { file, macroMap } = props;
 
-  if (file !== renderedFile) {
-    fetch(file)
-      .then(x => new Promise(resolve => setTimeout(() => resolve(x), 5000)))
-      .then(
-        (response): Promise<any> => {
-          return (response as Response).text();
-        }
-      )
-      .then((bob): void => {
-        setBob(bob);
-        setFile(file);
-        setMacros(macroMap as MacroMap);
-      });
-  }
+  useEffect(() => {
+    // Will be set on the first render
+    let mounted = true;
+    if (file !== renderedFile) {
+      fetch(file)
+        .then(
+          (response): Promise<any> => {
+            return response.json();
+          }
+        )
+        .then((bob): void => {
+          // Check component is still mounted when result comes back
+          if (mounted) {
+            setBob(bob);
+            setFile(file);
+            setMacros(macroMap as MacroMap);
+          }
+        });
+    }
+
+    // Clean up function
+    return () => {
+      mounted = false;
+    };
+  });
 
   if (macroMap !== currentMacros) {
     setMacros(macroMap as MacroMap);

src/components/FromJson/fromJson.ts

@@ -21,7 +21,6 @@ import { DynamicPageWidget } from "../DynamicPage/dynamicPage";
 import { WidgetFromBob } from "../FromBob/fromBob";
 import { GroupingContainer } from "../GroupingContainer/groupingContainer";
 import { WidgetPropType, InferWidgetProps } from "../Widget/widget";
-import { resolve } from "dns";
 
 const EMPTY_WIDGET: WidgetDescription = {
   type: "empty",
@@ -58,10 +57,9 @@ export const WidgetFromJson = (
     let mounted = true;
     if (file !== renderedFile) {
       fetch(file)
-        .then(x => new Promise(resolve => setTimeout(() => resolve(x), 5000)))
         .then(
           (response): Promise<any> => {
-            return (response as Response).json();
+            return response.json();
           }
         )
         .then((json): void => {