diff --git a/package.js b/package.js
index 6bb4193..29eeaa6 100644
--- a/package.js
+++ b/package.js
@@ -256,7 +256,7 @@ const specs = {
 
     // Testing with Jest
     'jest': '16.1.0-alpha.691b0e22',
-    'jest-html': '^1.1.0',
+    'jest-html': '^1.2.0',
     'react-test-renderer': '15.3.2',
     'babel-jest': '16.0.0',
 
diff --git a/package.json b/package.json
index 32bcad0..eca6950 100755
--- a/package.json
+++ b/package.json
@@ -102,7 +102,7 @@
     "ignore-styles": "4.0.0",
     "isomorphic-fetch": "2.2.1",
     "jest": "16.1.0-alpha.691b0e22",
-    "jest-html": "^1.1.0",
+    "jest-html": "^1.2.0",
     "json-loader": "0.5.4",
     "mocha": "2.4.5",
     "moment": "2.14.1",
diff --git a/testJest/chromeExtension/components/__snapshots__/005-app.test.js.snap b/testJest/chromeExtension/components/__snapshots__/005-app.test.js.snap
index 1baef0d..c86d549 100644
--- a/testJest/chromeExtension/components/__snapshots__/005-app.test.js.snap
+++ b/testJest/chromeExtension/components/__snapshots__/005-app.test.js.snap
@@ -96,35 +96,33 @@ exports[`App renders correctly when connected 1`] = `
   </div>
 </div>
 ------------HTML PREVIEW---------------
+<div
+  id="appRoot"
+  style="background-color:white;color:rgb(64, 64, 64);height:100%;"
+>
   <div
-    id="appRoot"
-    style="background-color:white;color:rgb(64, 64, 64);height:100%;">
-    <div
-      class="giu-floats"
-      style="height:0;left:0;position:absolute;top:0;width:0;">
-    </div>
-    <div
-      class="giu-notifications"
-      style="bottom:20px;max-width:350px;position:fixed;right:20px;z-index:9000;">
-    </div>
-    <div
-      dataMockType="Toolbar">
-      <div
-        style="color:blue;font-weight:bold;">
-        Toolbar
-      </div>
+    class="giu-floats"
+    style="height:0;left:0;position:absolute;top:0;width:0;"
+  >
+  </div>
+  <div
+    class="giu-notifications"
+    style="bottom:20px;max-width:350px;position:fixed;right:20px;z-index:9000;"
+  >
+  </div>
+  <div dataMockType="Toolbar">
+    <div style="color:blue;font-weight:bold;">
+      Toolbar
     </div>
-    <div
-      style="padding:4px;">
-      <div
-        dataMockType="Story">
-        <div
-          style="color:blue;font-weight:bold;">
-          Story
-        </div>
+  </div>
+  <div style="padding:4px;">
+    <div dataMockType="Story">
+      <div style="color:blue;font-weight:bold;">
+        Story
       </div>
     </div>
   </div>
+</div>
 `;
 
 exports[`App renders correctly when disconnected 1`] = `
@@ -189,31 +187,36 @@ exports[`App renders correctly when disconnected 1`] = `
   </div>
 </div>
 ------------HTML PREVIEW---------------
+<div
+  id="appRoot"
+  style="background-color:white;color:rgb(64, 64, 64);height:100%;"
+>
   <div
-    id="appRoot"
-    style="background-color:white;color:rgb(64, 64, 64);height:100%;">
-    <div
-      class="giu-floats"
-      style="height:0;left:0;position:absolute;top:0;width:0;">
-    </div>
-    <div
-      class="giu-notifications"
-      style="bottom:20px;max-width:350px;position:fixed;right:20px;z-index:9000;">
+    class="giu-floats"
+    style="height:0;left:0;position:absolute;top:0;width:0;"
+  >
+  </div>
+  <div
+    class="giu-notifications"
+    style="bottom:20px;max-width:350px;position:fixed;right:20px;z-index:9000;"
+  >
+  </div>
+  <div
+    class="giu-large-message"
+    style="color:rgb(115, 115, 115);font-size:1.4em;font-weight:700;padding:0.8em;text-align:center;"
+  >
+    <div>
+      <i
+        class="giu-icon fa fa-circle-o-notch fa-spin"
+        style="cursor:pointer;letter-spacing:normal;"
+      >
+      </i>
+       Connecting to Storyboard...
     </div>
-    <div
-      class="giu-large-message"
-      style="color:rgb(115, 115, 115);font-size:1.4em;font-weight:700;padding:0.8em;text-align:center;">
-      <div>
-        <i
-          class="giu-icon fa fa-circle-o-notch fa-spin"
-          style="cursor:pointer;letter-spacing:normal;">
-        </i>
-         Connecting to Storyboard...
-      </div>
-       
-      <div>
-        Navigate to your Storyboard-equipped app (and log in if required)
-      </div>
+     
+    <div>
+      Navigate to your Storyboard-equipped app (and log in if required)
     </div>
   </div>
+</div>
 `;
diff --git a/testJest/chromeExtension/components/__snapshots__/010-login.test.js.snap b/testJest/chromeExtension/components/__snapshots__/010-login.test.js.snap
index 6dbb59b..03a2ccb 100644
--- a/testJest/chromeExtension/components/__snapshots__/010-login.test.js.snap
+++ b/testJest/chromeExtension/components/__snapshots__/010-login.test.js.snap
@@ -22,16 +22,16 @@ exports[`Login renders correctly when LOGGED_IN 1`] = `
     title="Log out" />
 </div>
 ------------HTML PREVIEW---------------
-  <div
-    style="background-color:white;color:rgb(64, 64, 64);padding:4px 10px;">
-    Logged in as Guille
-     
-    <i
-      class="giu-icon fa fa-sign-out fa-lg fa-fw"
-      style="cursor:pointer;letter-spacing:normal;"
-      title="Log out">
-    </i>
-  </div>
+<div style="background-color:white;color:rgb(64, 64, 64);padding:4px 10px;">
+  Logged in as Guille
+   
+  <i
+    class="giu-icon fa fa-sign-out fa-lg fa-fw"
+    style="cursor:pointer;letter-spacing:normal;"
+    title="Log out"
+  >
+  </i>
+</div>
 `;
 
 exports[`Login renders correctly when LOGGED_OUT 1`] = `
@@ -127,38 +127,41 @@ exports[`Login renders correctly when LOGGED_OUT 1`] = `
   </div>
 </div>
 ------------HTML PREVIEW---------------
-  <div>
-    <div
-      class="giu-floats"
-      style="height:0;left:0;position:absolute;top:0;width:0;">
-    </div>
-    <div
-      style="background-color:rgb(214, 236, 255);color:black;padding:4px 10px;">
-      <b>
-        Server logs:
-      </b>
-       
-      <input
-        class="giu-text-input"
-        id="login"
-        placeholder="Login"
-        style="background-color:transparent;border:1px solid #999999;color:inherit;font-family:inherit;font-size:inherit;font-weight:inherit;margin-right:4px;width:70px;"
-        type="text"
-        value="">
-      <input
-        class="giu-password-input"
-        id="password"
-        placeholder="Password"
-        style="background-color:transparent;border:1px solid #999999;color:inherit;font-family:inherit;font-size:inherit;font-weight:inherit;margin-right:4px;width:70px;"
-        type="password"
-        value="">
-      <i
-        class="giu-icon fa fa-sign-in fa-lg fa-fw"
-        style="cursor:pointer;letter-spacing:normal;"
-        title="Log in">
-      </i>
-    </div>
+<div>
+  <div
+    class="giu-floats"
+    style="height:0;left:0;position:absolute;top:0;width:0;"
+  >
   </div>
+  <div style="background-color:rgb(214, 236, 255);color:black;padding:4px 10px;">
+    <b>
+      Server logs:
+    </b>
+     
+    <input
+      class="giu-text-input"
+      id="login"
+      placeholder="Login"
+      style="background-color:transparent;border:1px solid #999999;color:inherit;font-family:inherit;font-size:inherit;font-weight:inherit;margin-right:4px;width:70px;"
+      type="text"
+      value=""
+    >
+    <input
+      class="giu-password-input"
+      id="password"
+      placeholder="Password"
+      style="background-color:transparent;border:1px solid #999999;color:inherit;font-family:inherit;font-size:inherit;font-weight:inherit;margin-right:4px;width:70px;"
+      type="password"
+      value=""
+    >
+    <i
+      class="giu-icon fa fa-sign-in fa-lg fa-fw"
+      style="cursor:pointer;letter-spacing:normal;"
+      title="Log in"
+    >
+    </i>
+  </div>
+</div>
 `;
 
 exports[`Login renders correctly when LOGGING_IN 1`] = `
@@ -253,38 +256,41 @@ exports[`Login renders correctly when LOGGING_IN 1`] = `
   </div>
 </div>
 ------------HTML PREVIEW---------------
-  <div>
-    <div
-      class="giu-floats"
-      style="height:0;left:0;position:absolute;top:0;width:0;">
-    </div>
-    <div
-      style="background-color:rgb(214, 236, 255);color:black;padding:4px 10px;">
-      <b>
-        Server logs:
-      </b>
-       
-      <input
-        class="giu-text-input"
-        id="login"
-        placeholder="Login"
-        style="background-color:transparent;border:1px solid #999999;color:inherit;font-family:inherit;font-size:inherit;font-weight:inherit;margin-right:4px;width:70px;"
-        type="text"
-        value="">
-      <input
-        class="giu-password-input"
-        id="password"
-        placeholder="Password"
-        style="background-color:transparent;border:1px solid #999999;color:inherit;font-family:inherit;font-size:inherit;font-weight:inherit;margin-right:4px;width:70px;"
-        type="password"
-        value="">
-      <i
-        class="giu-icon fa fa-circle-o-notch fa-lg fa-fw fa-spin"
-        style="cursor:pointer;letter-spacing:normal;"
-        title="Logging in">
-      </i>
-    </div>
+<div>
+  <div
+    class="giu-floats"
+    style="height:0;left:0;position:absolute;top:0;width:0;"
+  >
   </div>
+  <div style="background-color:rgb(214, 236, 255);color:black;padding:4px 10px;">
+    <b>
+      Server logs:
+    </b>
+     
+    <input
+      class="giu-text-input"
+      id="login"
+      placeholder="Login"
+      style="background-color:transparent;border:1px solid #999999;color:inherit;font-family:inherit;font-size:inherit;font-weight:inherit;margin-right:4px;width:70px;"
+      type="text"
+      value=""
+    >
+    <input
+      class="giu-password-input"
+      id="password"
+      placeholder="Password"
+      style="background-color:transparent;border:1px solid #999999;color:inherit;font-family:inherit;font-size:inherit;font-weight:inherit;margin-right:4px;width:70px;"
+      type="password"
+      value=""
+    >
+    <i
+      class="giu-icon fa fa-circle-o-notch fa-lg fa-fw fa-spin"
+      style="cursor:pointer;letter-spacing:normal;"
+      title="Logging in"
+    >
+    </i>
+  </div>
+</div>
 `;
 
 exports[`Login renders correctly when login needs are still unknown 1`] = `
@@ -307,13 +313,13 @@ exports[`Login renders correctly when login needs are still unknown 1`] = `
     } />
 </div>
 ------------HTML PREVIEW---------------
-  <div
-    style="background-color:white;color:rgb(64, 64, 64);padding:4px 10px;">
-    <i
-      class="giu-icon fa fa-circle-o-notch fa-lg fa-fw fa-spin"
-      style="cursor:pointer;letter-spacing:normal;">
-    </i>
-  </div>
+<div style="background-color:white;color:rgb(64, 64, 64);padding:4px 10px;">
+  <i
+    class="giu-icon fa fa-circle-o-notch fa-lg fa-fw fa-spin"
+    style="cursor:pointer;letter-spacing:normal;"
+  >
+  </i>
+</div>
 `;
 
 exports[`Login renders correctly when no login is required 1`] = `
@@ -330,10 +336,9 @@ exports[`Login renders correctly when no login is required 1`] = `
   </i>
 </div>
 ------------HTML PREVIEW---------------
-  <div
-    style="background-color:white;color:rgb(64, 64, 64);padding:4px 10px;">
-    <i>
-      No login required to see server logs
-    </i>
-  </div>
+<div style="background-color:white;color:rgb(64, 64, 64);padding:4px 10px;">
+  <i>
+    No login required to see server logs
+  </i>
+</div>
 `;
diff --git a/testJest/chromeExtension/components/__snapshots__/015-toolbar.test.js.snap b/testJest/chromeExtension/components/__snapshots__/015-toolbar.test.js.snap
index a3019d8..8fc6c50 100644
--- a/testJest/chromeExtension/components/__snapshots__/015-toolbar.test.js.snap
+++ b/testJest/chromeExtension/components/__snapshots__/015-toolbar.test.js.snap
@@ -138,59 +138,57 @@ exports[`Toolbar renders correctly when connected 1`] = `
     } />
 </div>
 ------------HTML PREVIEW---------------
-  <div>
-    <div
-      style="background-color:white;border-bottom:1px solid #555;display:flex;flex-direction:row;height:30px;left:0;position:fixed;top:0;white-space:nowrap;width:100%;z-index:10;">
-      <div
-        style="padding:4px 4px 4px 8px;">
-        <i
-          class="giu-icon fa fa-cog fa-lg"
-          id="sbBtnShowSettings"
-          style="color:rgb(64, 64, 64);cursor:pointer;letter-spacing:normal;margin-right:10px;"
-          title="Show settings...">
-        </i>
-        <i
-          class="giu-icon fa fa-chevron-circle-down fa-lg"
-          style="color:rgb(64, 64, 64);cursor:pointer;letter-spacing:normal;margin-right:10px;"
-          title="Expand all stories">
-        </i>
-        <i
-          class="giu-icon fa fa-chevron-circle-right fa-lg"
-          style="color:rgb(64, 64, 64);cursor:pointer;letter-spacing:normal;margin-right:10px;"
-          title="Collapse all stories">
-        </i>
-        <i
-          class="giu-icon fa fa-remove fa-lg"
-          style="color:rgb(64, 64, 64);cursor:pointer;letter-spacing:normal;margin-right:10px;"
-          title="Clear logs">
-        </i>
-         
-        <input
-          id="quickFind"
-          placeholder="Quick find..."
-          style="background-color:transparent;border-width:1px;color:rgb(64, 64, 64);"
-          type="search">
-        <i
-          class="giu-icon fa fa-chain fa-lg"
-          style="color:green;cursor:default;letter-spacing:normal;margin-left:10px;margin-right:5px;"
-          title="Connection with the server is UP">
-        </i>
-      </div>
-      <div
-        style="flex:1 1 0px;">
-      </div>
-      <div
-        dataMockType="Login">
-        <div
-          style="color:blue;font-weight:bold;">
-          Login
-        </div>
-      </div>
+<div>
+  <div style="background-color:white;border-bottom:1px solid #555;display:flex;flex-direction:row;height:30px;left:0;position:fixed;top:0;white-space:nowrap;width:100%;z-index:10;">
+    <div style="padding:4px 4px 4px 8px;">
+      <i
+        class="giu-icon fa fa-cog fa-lg"
+        id="sbBtnShowSettings"
+        style="color:rgb(64, 64, 64);cursor:pointer;letter-spacing:normal;margin-right:10px;"
+        title="Show settings..."
+      >
+      </i>
+      <i
+        class="giu-icon fa fa-chevron-circle-down fa-lg"
+        style="color:rgb(64, 64, 64);cursor:pointer;letter-spacing:normal;margin-right:10px;"
+        title="Expand all stories"
+      >
+      </i>
+      <i
+        class="giu-icon fa fa-chevron-circle-right fa-lg"
+        style="color:rgb(64, 64, 64);cursor:pointer;letter-spacing:normal;margin-right:10px;"
+        title="Collapse all stories"
+      >
+      </i>
+      <i
+        class="giu-icon fa fa-remove fa-lg"
+        style="color:rgb(64, 64, 64);cursor:pointer;letter-spacing:normal;margin-right:10px;"
+        title="Clear logs"
+      >
+      </i>
+       
+      <input
+        id="quickFind"
+        placeholder="Quick find..."
+        style="background-color:transparent;border-width:1px;color:rgb(64, 64, 64);"
+        type="search"
+      >
+      <i
+        class="giu-icon fa fa-chain fa-lg"
+        style="color:green;cursor:default;letter-spacing:normal;margin-left:10px;margin-right:5px;"
+        title="Connection with the server is UP"
+      >
+      </i>
     </div>
-    <div
-      style="height:30px;">
+    <div style="flex:1 1 0px;"></div>
+    <div dataMockType="Login">
+      <div style="color:blue;font-weight:bold;">
+        Login
+      </div>
     </div>
   </div>
+  <div style="height:30px;"></div>
+</div>
 `;
 
 exports[`Toolbar renders correctly when disconnected 1`] = `
@@ -333,59 +331,57 @@ exports[`Toolbar renders correctly when disconnected 1`] = `
     } />
 </div>
 ------------HTML PREVIEW---------------
-  <div>
-    <div
-      style="background-color:white;border-bottom:1px solid #555;display:flex;flex-direction:row;height:30px;left:0;position:fixed;top:0;white-space:nowrap;width:100%;z-index:10;">
-      <div
-        style="padding:4px 4px 4px 8px;">
-        <i
-          class="giu-icon fa fa-cog fa-lg"
-          id="sbBtnShowSettings"
-          style="color:rgb(64, 64, 64);cursor:pointer;letter-spacing:normal;margin-right:10px;"
-          title="Show settings...">
-        </i>
-        <i
-          class="giu-icon fa fa-chevron-circle-down fa-lg"
-          style="color:rgb(64, 64, 64);cursor:pointer;letter-spacing:normal;margin-right:10px;"
-          title="Expand all stories">
-        </i>
-        <i
-          class="giu-icon fa fa-chevron-circle-right fa-lg"
-          style="color:rgb(64, 64, 64);cursor:pointer;letter-spacing:normal;margin-right:10px;"
-          title="Collapse all stories">
-        </i>
-        <i
-          class="giu-icon fa fa-remove fa-lg"
-          style="color:rgb(64, 64, 64);cursor:pointer;letter-spacing:normal;margin-right:10px;"
-          title="Clear logs">
-        </i>
-         
-        <input
-          id="quickFind"
-          placeholder="Quick find..."
-          style="background-color:transparent;border-width:1px;color:rgb(64, 64, 64);"
-          type="search">
-        <i
-          class="giu-icon fa fa-chain-broken fa-lg"
-          style="color:red;cursor:default;letter-spacing:normal;margin-left:10px;margin-right:5px;"
-          title="Connection with the server is DOWN">
-        </i>
-      </div>
-      <div
-        style="flex:1 1 0px;">
-      </div>
-      <div
-        dataMockType="Login">
-        <div
-          style="color:blue;font-weight:bold;">
-          Login
-        </div>
-      </div>
+<div>
+  <div style="background-color:white;border-bottom:1px solid #555;display:flex;flex-direction:row;height:30px;left:0;position:fixed;top:0;white-space:nowrap;width:100%;z-index:10;">
+    <div style="padding:4px 4px 4px 8px;">
+      <i
+        class="giu-icon fa fa-cog fa-lg"
+        id="sbBtnShowSettings"
+        style="color:rgb(64, 64, 64);cursor:pointer;letter-spacing:normal;margin-right:10px;"
+        title="Show settings..."
+      >
+      </i>
+      <i
+        class="giu-icon fa fa-chevron-circle-down fa-lg"
+        style="color:rgb(64, 64, 64);cursor:pointer;letter-spacing:normal;margin-right:10px;"
+        title="Expand all stories"
+      >
+      </i>
+      <i
+        class="giu-icon fa fa-chevron-circle-right fa-lg"
+        style="color:rgb(64, 64, 64);cursor:pointer;letter-spacing:normal;margin-right:10px;"
+        title="Collapse all stories"
+      >
+      </i>
+      <i
+        class="giu-icon fa fa-remove fa-lg"
+        style="color:rgb(64, 64, 64);cursor:pointer;letter-spacing:normal;margin-right:10px;"
+        title="Clear logs"
+      >
+      </i>
+       
+      <input
+        id="quickFind"
+        placeholder="Quick find..."
+        style="background-color:transparent;border-width:1px;color:rgb(64, 64, 64);"
+        type="search"
+      >
+      <i
+        class="giu-icon fa fa-chain-broken fa-lg"
+        style="color:red;cursor:default;letter-spacing:normal;margin-left:10px;margin-right:5px;"
+        title="Connection with the server is DOWN"
+      >
+      </i>
     </div>
-    <div
-      style="height:30px;">
+    <div style="flex:1 1 0px;"></div>
+    <div dataMockType="Login">
+      <div style="color:blue;font-weight:bold;">
+        Login
+      </div>
     </div>
   </div>
+  <div style="height:30px;"></div>
+</div>
 `;
 
 exports[`Toolbar shows settings when the corresponding icon is clicked 1`] = `
@@ -554,64 +550,60 @@ exports[`Toolbar shows settings when the corresponding icon is clicked 1`] = `
     } />
 </div>
 ------------HTML PREVIEW---------------
-  <div>
-    <div
-      dataMockType="Settings">
-      <div
-        style="color:blue;font-weight:bold;">
-        Settings
-      </div>
+<div>
+  <div dataMockType="Settings">
+    <div style="color:blue;font-weight:bold;">
+      Settings
     </div>
-    <div
-      style="background-color:white;border-bottom:1px solid #555;display:flex;flex-direction:row;height:30px;left:0;position:fixed;top:0;white-space:nowrap;width:100%;z-index:10;">
-      <div
-        style="padding:4px 4px 4px 8px;">
-        <i
-          class="giu-icon fa fa-cog fa-lg"
-          id="sbBtnShowSettings"
-          style="color:rgb(64, 64, 64);cursor:pointer;letter-spacing:normal;margin-right:10px;"
-          title="Show settings...">
-        </i>
-        <i
-          class="giu-icon fa fa-chevron-circle-down fa-lg"
-          style="color:rgb(64, 64, 64);cursor:pointer;letter-spacing:normal;margin-right:10px;"
-          title="Expand all stories">
-        </i>
-        <i
-          class="giu-icon fa fa-chevron-circle-right fa-lg"
-          style="color:rgb(64, 64, 64);cursor:pointer;letter-spacing:normal;margin-right:10px;"
-          title="Collapse all stories">
-        </i>
-        <i
-          class="giu-icon fa fa-remove fa-lg"
-          style="color:rgb(64, 64, 64);cursor:pointer;letter-spacing:normal;margin-right:10px;"
-          title="Clear logs">
-        </i>
-         
-        <input
-          id="quickFind"
-          placeholder="Quick find..."
-          style="background-color:transparent;border-width:1px;color:rgb(64, 64, 64);"
-          type="search">
-        <i
-          class="giu-icon fa fa-chain fa-lg"
-          style="color:green;cursor:default;letter-spacing:normal;margin-left:10px;margin-right:5px;"
-          title="Connection with the server is UP">
-        </i>
-      </div>
-      <div
-        style="flex:1 1 0px;">
-      </div>
-      <div
-        dataMockType="Login">
-        <div
-          style="color:blue;font-weight:bold;">
-          Login
-        </div>
-      </div>
+  </div>
+  <div style="background-color:white;border-bottom:1px solid #555;display:flex;flex-direction:row;height:30px;left:0;position:fixed;top:0;white-space:nowrap;width:100%;z-index:10;">
+    <div style="padding:4px 4px 4px 8px;">
+      <i
+        class="giu-icon fa fa-cog fa-lg"
+        id="sbBtnShowSettings"
+        style="color:rgb(64, 64, 64);cursor:pointer;letter-spacing:normal;margin-right:10px;"
+        title="Show settings..."
+      >
+      </i>
+      <i
+        class="giu-icon fa fa-chevron-circle-down fa-lg"
+        style="color:rgb(64, 64, 64);cursor:pointer;letter-spacing:normal;margin-right:10px;"
+        title="Expand all stories"
+      >
+      </i>
+      <i
+        class="giu-icon fa fa-chevron-circle-right fa-lg"
+        style="color:rgb(64, 64, 64);cursor:pointer;letter-spacing:normal;margin-right:10px;"
+        title="Collapse all stories"
+      >
+      </i>
+      <i
+        class="giu-icon fa fa-remove fa-lg"
+        style="color:rgb(64, 64, 64);cursor:pointer;letter-spacing:normal;margin-right:10px;"
+        title="Clear logs"
+      >
+      </i>
+       
+      <input
+        id="quickFind"
+        placeholder="Quick find..."
+        style="background-color:transparent;border-width:1px;color:rgb(64, 64, 64);"
+        type="search"
+      >
+      <i
+        class="giu-icon fa fa-chain fa-lg"
+        style="color:green;cursor:default;letter-spacing:normal;margin-left:10px;margin-right:5px;"
+        title="Connection with the server is UP"
+      >
+      </i>
     </div>
-    <div
-      style="height:30px;">
+    <div style="flex:1 1 0px;"></div>
+    <div dataMockType="Login">
+      <div style="color:blue;font-weight:bold;">
+        Login
+      </div>
     </div>
   </div>
+  <div style="height:30px;"></div>
+</div>
 `;
diff --git a/testJest/chromeExtension/components/__snapshots__/016-settings.test.js.snap b/testJest/chromeExtension/components/__snapshots__/016-settings.test.js.snap
index 7dfe6e9..a2b8a48 100644
--- a/testJest/chromeExtension/components/__snapshots__/016-settings.test.js.snap
+++ b/testJest/chromeExtension/components/__snapshots__/016-settings.test.js.snap
@@ -805,288 +805,291 @@ exports[`Settings renders correctly 1`] = `
   </div>
 </div>
 ------------HTML PREVIEW---------------
-  <div>
+<div>
+  <div
+    class="giu-floats"
+    style="height:0;left:0;position:absolute;top:0;width:0;"
+  >
+  </div>
+  <div
+    class="giu-modal"
+    style="height:100vh;left:0;position:fixed;top:0;width:100vw;z-index:50;"
+  >
     <div
-      class="giu-floats"
-      style="height:0;left:0;position:absolute;top:0;width:0;">
+      class="giu-backdrop"
+      style="background-color:white;height:100vh;left:0;opacity:0.7;position:fixed;top:0;width:100vw;"
+    >
     </div>
-    <div
-      class="giu-modal"
-      style="height:100vh;left:0;position:fixed;top:0;width:100vw;z-index:50;">
-      <div
-        class="giu-backdrop"
-        style="background-color:white;height:100vh;left:0;opacity:0.7;position:fixed;top:0;width:100vw;">
-      </div>
-      <div
-        style="display:flex;flex-direction:row;left:0;position:fixed;top:5vh;width:100%;">
+    <div style="display:flex;flex-direction:row;left:0;position:fixed;top:5vh;width:100%;">
+      <div style="-webkit-flex:1;flex:1;"></div>
+      <div style="background-color:white;border-radius:2px;box-shadow:0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);color:black;max-height:90vh;overflow-y:auto;padding:20px;">
+        <input
+          autoFocus
+          style="cursor:default;height:0;left:8px;opacity:0;padding:0;pointer-events:none;position:fixed;top:8px;width:0;z-index:-80;"
+        >
         <div
-          style="-webkit-flex:1;flex:1;">
+          class="allowUserSelect"
+          style="border:1px solid red;border-radius:2px;color:red;margin-bottom:10px;padding:15px;"
+        >
+          Changes to these settings can&#39;t be saved (beyond your current session) due to your current Chrome configuration. Please visit 
+          <b>
+            chrome://settings/content
+          </b>
+           and uncheck the option &quot;Block third-party cookies and site data&quot;. Then close the Chrome DevTools and open them again.
         </div>
-        <div
-          style="background-color:white;border-radius:2px;box-shadow:0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);color:black;max-height:90vh;overflow-y:auto;padding:20px;">
+        <span
+          class="giu-checkbox"
+          style="white-space:nowrap;"
+        >
           <input
-            autoFocus
-            style="cursor:default;height:0;left:8px;opacity:0;padding:0;pointer-events:none;position:fixed;top:8px;width:0;z-index:-80;">
-          <div
-            class="allowUserSelect"
-            style="border:1px solid red;border-radius:2px;color:red;margin-bottom:10px;padding:15px;">
-            Changes to these settings can\'t be saved (beyond your current session) due to your current Chrome configuration. Please visit 
-            <b>
-              chrome://settings/content
-            </b>
-             and uncheck the option \"Block third-party cookies and site data\". Then close the Chrome DevTools and open them again.
-          </div>
-          <span
-            class="giu-checkbox"
-            style="white-space:nowrap;">
-            <input
-              id="giu-checkbox_0"
-              type="checkbox">
-            <label
-              for="giu-checkbox_0">
-              <span>
-                Show 
-                <i>
-                  CLOSED
-                </i>
-                 actions
-              </span>
-            </label>
-          </span>
-          <br>
-          <span
-            class="giu-checkbox"
-            style="white-space:nowrap;">
-            <input
-              checked
-              id="giu-checkbox_1"
-              type="checkbox">
-            <label
-              for="giu-checkbox_1">
-              <span>
-                Use shorthand notation for identical consecutive logs ( 
-                <i
-                  class="giu-icon fa fa-copy"
-                  style="color:currentColor;letter-spacing:normal;">
-                </i>
-                 )
-              </span>
-            </label>
-          </span>
-          <br>
-          <span
-            class="giu-checkbox"
-            style="white-space:nowrap;">
-            <input
-              id="giu-checkbox_2"
-              type="checkbox">
-            <label
-              for="giu-checkbox_2">
-              Collapse all new stories (even if they are still open)
-            </label>
-          </span>
-          <br>
-          <span
-            class="giu-checkbox"
-            style="white-space:nowrap;">
-            <input
-              id="giu-checkbox_3"
-              type="checkbox">
-            <label
-              for="giu-checkbox_3">
-              Expand all attachments upon receipt
-            </label>
-          </span>
-          <br>
-          <span
-            class="giu-checkbox"
-            style="white-space:nowrap;">
-            <input
-              id="giu-checkbox_4"
-              type="checkbox">
-            <label
-              for="giu-checkbox_4">
-              Discard stories from remote clients upon receipt
-            </label>
-          </span>
-          <br>
-          <br>
-          <div
-            style="margin-bottom:5px;">
-            Log filters, e.g. 
-            <b>
-              foo, ba*:INFO, -test, *:WARN
-            </b>
-             
-            <a
-              href="https://github.com/guigrpa/storyboard#log-filtering"
-              rel="noreferrer noopener"
-              style="color:currentColor;"
-              target="_blank">
-              (more examples here)
-            </a>
-            :
-          </div>
-          <ul
-            style="margin-top:0;">
-            <li>
-              <label
-                for="serverFilter"
-                style="display:inline-block;width:80px;">
-                Server:
-              </label>
-               
-              <input
-                class="giu-text-input"
-                id="serverFilter"
-                style="background-color:transparent;border:1px solid #999999;color:inherit;font-family:inherit;font-size:inherit;font-weight:inherit;width:300px;"
-                type="text"
-                value="*:INFO">
-            </li>
-            <li>
-              <label
-                for="localClientFilter"
-                style="display:inline-block;width:80px;">
-                Local client:
-              </label>
-               
-              <input
-                class="giu-text-input"
-                id="localClientFilter"
-                style="background-color:transparent;border:1px solid #999999;color:inherit;font-family:inherit;font-size:inherit;font-weight:inherit;width:300px;"
-                type="text"
-                value="*:DEBUG">
-            </li>
-          </ul>
-          <div>
+            id="giu-checkbox_0"
+            type="checkbox"
+          >
+          <label for="giu-checkbox_0">
+            <span>
+              Show 
+              <i>
+                CLOSED
+              </i>
+               actions
+            </span>
+          </label>
+        </span>
+        <br>
+        <span
+          class="giu-checkbox"
+          style="white-space:nowrap;"
+        >
+          <input
+            checked
+            id="giu-checkbox_1"
+            type="checkbox"
+          >
+          <label for="giu-checkbox_1">
+            <span>
+              Use shorthand notation for identical consecutive logs ( 
+              <i
+                class="giu-icon fa fa-copy"
+                style="color:currentColor;letter-spacing:normal;"
+              >
+              </i>
+               )
+            </span>
+          </label>
+        </span>
+        <br>
+        <span
+          class="giu-checkbox"
+          style="white-space:nowrap;"
+        >
+          <input
+            id="giu-checkbox_2"
+            type="checkbox"
+          >
+          <label for="giu-checkbox_2">
+            Collapse all new stories (even if they are still open)
+          </label>
+        </span>
+        <br>
+        <span
+          class="giu-checkbox"
+          style="white-space:nowrap;"
+        >
+          <input
+            id="giu-checkbox_3"
+            type="checkbox"
+          >
+          <label for="giu-checkbox_3">
+            Expand all attachments upon receipt
+          </label>
+        </span>
+        <br>
+        <span
+          class="giu-checkbox"
+          style="white-space:nowrap;"
+        >
+          <input
+            id="giu-checkbox_4"
+            type="checkbox"
+          >
+          <label for="giu-checkbox_4">
+            Discard stories from remote clients upon receipt
+          </label>
+        </span>
+        <br>
+        <br>
+        <div style="margin-bottom:5px;">
+          Log filters, e.g. 
+          <b>
+            foo, ba*:INFO, -test, *:WARN
+          </b>
+           
+          <a
+            href="https://github.com/guigrpa/storyboard#log-filtering"
+            rel="noreferrer noopener"
+            style="color:currentColor;"
+            target="_blank"
+          >
+            (more examples here)
+          </a>
+          :
+        </div>
+        <ul style="margin-top:0;">
+          <li>
             <label
-              for="maxRecords">
-              Number of logs and stories to remember:
+              for="serverFilter"
+              style="display:inline-block;width:80px;"
+            >
+              Server:
             </label>
              
             <input
-              class="giu-number-input"
-              id="maxRecords"
-              style="background-color:transparent;border:1px solid #999999;color:inherit;font-family:inherit;font-size:inherit;font-weight:inherit;width:50px;"
-              type="number"
-              value="800">
-             
+              class="giu-text-input"
+              id="serverFilter"
+              style="background-color:transparent;border:1px solid #999999;color:inherit;font-family:inherit;font-size:inherit;font-weight:inherit;width:300px;"
+              type="text"
+              value="*:INFO"
+            >
+          </li>
+          <li>
             <label
-              for="forgetHysteresis">
-              with hysteresis:
+              for="localClientFilter"
+              style="display:inline-block;width:80px;"
+            >
+              Local client:
             </label>
              
             <input
-              class="giu-number-input"
-              id="forgetHysteresis"
-              style="background-color:transparent;border:1px solid #999999;color:inherit;font-family:inherit;font-size:inherit;font-weight:inherit;width:50px;"
-              type="number"
-              value="0.25">
-             
-            <i
-              class="giu-icon fa fa-info-circle"
-              style="cursor:pointer;letter-spacing:normal;"
-              title="When the backlog reaches 800, Storyboard will start forgetting old stuff until it goes below 600">
-            </i>
-          </div>
-          <div>
-            Colors: client stories:
-             
-            <span
-              class="giu-color-input"
-              style="display:inline-block;position:relative;top:1px;">
-              <input
-                style="cursor:default;height:0;left:8px;opacity:0;padding:0;pointer-events:none;position:fixed;top:8px;width:0;z-index:-80;">
+              class="giu-text-input"
+              id="localClientFilter"
+              style="background-color:transparent;border:1px solid #999999;color:inherit;font-family:inherit;font-size:inherit;font-weight:inherit;width:300px;"
+              type="text"
+              value="*:DEBUG"
+            >
+          </li>
+        </ul>
+        <div>
+          <label for="maxRecords">
+            Number of logs and stories to remember:
+          </label>
+           
+          <input
+            class="giu-number-input"
+            id="maxRecords"
+            style="background-color:transparent;border:1px solid #999999;color:inherit;font-family:inherit;font-size:inherit;font-weight:inherit;width:50px;"
+            type="number"
+            value="800"
+          >
+           
+          <label for="forgetHysteresis">
+            with hysteresis:
+          </label>
+           
+          <input
+            class="giu-number-input"
+            id="forgetHysteresis"
+            style="background-color:transparent;border:1px solid #999999;color:inherit;font-family:inherit;font-size:inherit;font-weight:inherit;width:50px;"
+            type="number"
+            value="0.25"
+          >
+           
+          <i
+            class="giu-icon fa fa-info-circle"
+            style="cursor:pointer;letter-spacing:normal;"
+            title="When the backlog reaches 800, Storyboard will start forgetting old stuff until it goes below 600"
+          >
+          </i>
+        </div>
+        <div>
+          Colors: client stories:
+           
+          <span
+            class="giu-color-input"
+            style="display:inline-block;position:relative;top:1px;"
+          >
+            <input style="cursor:default;height:0;left:8px;opacity:0;padding:0;pointer-events:none;position:fixed;top:8px;width:0;z-index:-80;">
+            <div style="background-color:white;border:1px solid #999999;color:transparent;cursor:pointer;display:inline-block;font-family:inherit;font-size:inherit;font-weight:inherit;height:20px;line-height:1em;padding:2px 4px 6px 4px;position:relative;width:35px;">
+              x
               <div
-                style="background-color:white;border:1px solid #999999;color:transparent;cursor:pointer;display:inline-block;font-family:inherit;font-size:inherit;font-weight:inherit;height:20px;line-height:1em;padding:2px 4px 6px 4px;position:relative;width:35px;">
-                x
-                <div
-                  class="giu-transparency-tiles"
-                  style="border-radius:2px;bottom:4px;left:4px;position:absolute;right:4px;top:4px;">
-                </div>
-                <div
-                  style="background:rgb(240, 248, 255);border-radius:2px;bottom:4px;left:4px;position:absolute;right:4px;top:4px;">
-                </div>
+                class="giu-transparency-tiles"
+                style="border-radius:2px;bottom:4px;left:4px;position:absolute;right:4px;top:4px;"
+              >
               </div>
-            </span>
-             
-            server stories:
-             
-            <span
-              class="giu-color-input"
-              style="display:inline-block;position:relative;top:1px;">
-              <input
-                style="cursor:default;height:0;left:8px;opacity:0;padding:0;pointer-events:none;position:fixed;top:8px;width:0;z-index:-80;">
+              <div style="background:rgb(240, 248, 255);border-radius:2px;bottom:4px;left:4px;position:absolute;right:4px;top:4px;"></div>
+            </div>
+          </span>
+           
+          server stories:
+           
+          <span
+            class="giu-color-input"
+            style="display:inline-block;position:relative;top:1px;"
+          >
+            <input style="cursor:default;height:0;left:8px;opacity:0;padding:0;pointer-events:none;position:fixed;top:8px;width:0;z-index:-80;">
+            <div style="background-color:white;border:1px solid #999999;color:transparent;cursor:pointer;display:inline-block;font-family:inherit;font-size:inherit;font-weight:inherit;height:20px;line-height:1em;padding:2px 4px 6px 4px;position:relative;width:35px;">
+              x
               <div
-                style="background-color:white;border:1px solid #999999;color:transparent;cursor:pointer;display:inline-block;font-family:inherit;font-size:inherit;font-weight:inherit;height:20px;line-height:1em;padding:2px 4px 6px 4px;position:relative;width:35px;">
-                x
-                <div
-                  class="giu-transparency-tiles"
-                  style="border-radius:2px;bottom:4px;left:4px;position:absolute;right:4px;top:4px;">
-                </div>
-                <div
-                  style="background:rgb(214, 236, 255);border-radius:2px;bottom:4px;left:4px;position:absolute;right:4px;top:4px;">
-                </div>
+                class="giu-transparency-tiles"
+                style="border-radius:2px;bottom:4px;left:4px;position:absolute;right:4px;top:4px;"
+              >
               </div>
-            </span>
-             
-            background:
-             
-            <span
-              class="giu-color-input"
-              style="display:inline-block;position:relative;top:1px;">
-              <input
-                style="cursor:default;height:0;left:8px;opacity:0;padding:0;pointer-events:none;position:fixed;top:8px;width:0;z-index:-80;">
+              <div style="background:rgb(214, 236, 255);border-radius:2px;bottom:4px;left:4px;position:absolute;right:4px;top:4px;"></div>
+            </div>
+          </span>
+           
+          background:
+           
+          <span
+            class="giu-color-input"
+            style="display:inline-block;position:relative;top:1px;"
+          >
+            <input style="cursor:default;height:0;left:8px;opacity:0;padding:0;pointer-events:none;position:fixed;top:8px;width:0;z-index:-80;">
+            <div style="background-color:white;border:1px solid #999999;color:transparent;cursor:pointer;display:inline-block;font-family:inherit;font-size:inherit;font-weight:inherit;height:20px;line-height:1em;padding:2px 4px 6px 4px;position:relative;width:35px;">
+              x
               <div
-                style="background-color:white;border:1px solid #999999;color:transparent;cursor:pointer;display:inline-block;font-family:inherit;font-size:inherit;font-weight:inherit;height:20px;line-height:1em;padding:2px 4px 6px 4px;position:relative;width:35px;">
-                x
-                <div
-                  class="giu-transparency-tiles"
-                  style="border-radius:2px;bottom:4px;left:4px;position:absolute;right:4px;top:4px;">
-                </div>
-                <div
-                  style="background:rgb(255, 255, 255);border-radius:2px;bottom:4px;left:4px;position:absolute;right:4px;top:4px;">
-                </div>
+                class="giu-transparency-tiles"
+                style="border-radius:2px;bottom:4px;left:4px;position:absolute;right:4px;top:4px;"
+              >
               </div>
-            </span>
-            <div
-              style="margin-top:3px;">
-              (Use very light or very dark colors for best results, or choose a
-               
-              <span
-                class="giu-button"
-                style="-webkit-user-select:none;border:1px solid #999999;border-radius:5px;cursor:pointer;display:inline-block;padding:1px 5px;user-select:none;">
-                preset
-              </span>
-              )
-            </div>
-          </div>
-          <div
-            style="border-top:1px solid #999999;display:flex;flex-direction:row;margin-top:10px;padding-top:10px;">
-            <span
-              class="giu-button"
-              style="-webkit-user-select:none;border:1px solid #999999;border-radius:5px;cursor:pointer;display:inline-block;margin-right:5px;padding:1px 5px;user-select:none;">
-              Cancel
-            </span>
-            <span
-              class="giu-button"
-              style="-webkit-user-select:none;border:1px solid #999999;border-radius:5px;cursor:pointer;display:inline-block;margin-right:5px;padding:1px 5px;user-select:none;">
-              Reset defaults
-            </span>
-            <div
-              style="-webkit-flex:1;flex:1;">
+              <div style="background:rgb(255, 255, 255);border-radius:2px;bottom:4px;left:4px;position:absolute;right:4px;top:4px;"></div>
             </div>
+          </span>
+          <div style="margin-top:3px;">
+            (Use very light or very dark colors for best results, or choose a
+             
             <span
               class="giu-button"
-              style="-webkit-user-select:none;border:1px solid black;border-radius:5px;cursor:pointer;display:inline-block;margin-left:5px;padding:1px 5px;user-select:none;">
-              Save
+              style="-webkit-user-select:none;border:1px solid #999999;border-radius:5px;cursor:pointer;display:inline-block;padding:1px 5px;user-select:none;"
+            >
+              preset
             </span>
+            )
           </div>
         </div>
-        <div
-          style="-webkit-flex:1;flex:1;">
+        <div style="border-top:1px solid #999999;display:flex;flex-direction:row;margin-top:10px;padding-top:10px;">
+          <span
+            class="giu-button"
+            style="-webkit-user-select:none;border:1px solid #999999;border-radius:5px;cursor:pointer;display:inline-block;margin-right:5px;padding:1px 5px;user-select:none;"
+          >
+            Cancel
+          </span>
+          <span
+            class="giu-button"
+            style="-webkit-user-select:none;border:1px solid #999999;border-radius:5px;cursor:pointer;display:inline-block;margin-right:5px;padding:1px 5px;user-select:none;"
+          >
+            Reset defaults
+          </span>
+          <div style="-webkit-flex:1;flex:1;"></div>
+          <span
+            class="giu-button"
+            style="-webkit-user-select:none;border:1px solid black;border-radius:5px;cursor:pointer;display:inline-block;margin-left:5px;padding:1px 5px;user-select:none;"
+          >
+            Save
+          </span>
         </div>
       </div>
+      <div style="-webkit-flex:1;flex:1;"></div>
     </div>
   </div>
+</div>
 `;
diff --git a/testJest/chromeExtension/components/__snapshots__/020-story.test.js.snap b/testJest/chromeExtension/components/__snapshots__/020-story.test.js.snap
index 37b03c7..54d6f6b 100644
--- a/testJest/chromeExtension/components/__snapshots__/020-story.test.js.snap
+++ b/testJest/chromeExtension/components/__snapshots__/020-story.test.js.snap
@@ -90,46 +90,46 @@ exports[`Story 01 renders correctly an empty main story 1`] = `
   </div>
 </div>
 ------------HTML PREVIEW---------------
-  <div>
+<div>
+  <div
+    class="rootStory"
+    style="background-color:aliceblue;color:black;margin-bottom:10px;padding:2px;"
+  >
     <div
-      class="rootStory"
-      style="background-color:aliceblue;color:black;margin-bottom:10px;padding:2px;">
-      <div
-        class="rootStoryTitle"
-        style="cursor:pointer;margin-bottom:5px;text-align:center;">
-        <span
-          style="font-weight:900;letter-spacing:3px;">
-          CLIENT
-           
-          <span
-            style="color:darkgrey;">
-            [
-            0
-            ]
-          </span>
+      class="rootStoryTitle"
+      style="cursor:pointer;margin-bottom:5px;text-align:center;"
+    >
+      <span style="font-weight:900;letter-spacing:3px;">
+        CLIENT
+         
+        <span style="color:darkgrey;">
+          [
+          0
+          ]
         </span>
-      </div>
+      </span>
     </div>
+  </div>
+  <div
+    class="rootStory"
+    style="background-color:rgb(214, 236, 255);color:black;margin-bottom:10px;padding:2px;"
+  >
     <div
-      class="rootStory"
-      style="background-color:rgb(214, 236, 255);color:black;margin-bottom:10px;padding:2px;">
-      <div
-        class="rootStoryTitle"
-        style="cursor:pointer;margin-bottom:5px;text-align:center;">
-        <span
-          style="font-weight:900;letter-spacing:3px;">
-          SERVER
-           
-          <span
-            style="color:darkgrey;">
-            [
-            0
-            ]
-          </span>
+      class="rootStoryTitle"
+      style="cursor:pointer;margin-bottom:5px;text-align:center;"
+    >
+      <span style="font-weight:900;letter-spacing:3px;">
+        SERVER
+         
+        <span style="color:darkgrey;">
+          [
+          0
+          ]
         </span>
-      </div>
+      </span>
     </div>
   </div>
+</div>
 `;
 
 exports[`Story 02 renders correctly server and client records (root level) 1`] = `
@@ -350,94 +350,52 @@ exports[`Story 02 renders correctly server and client records (root level) 1`] =
   </div>
 </div>
 ------------HTML PREVIEW---------------
-  <div>
+<div>
+  <div
+    class="rootStory"
+    style="background-color:aliceblue;color:black;margin-bottom:10px;padding:2px;"
+  >
     <div
-      class="rootStory"
-      style="background-color:aliceblue;color:black;margin-bottom:10px;padding:2px;">
-      <div
-        class="rootStoryTitle"
-        style="cursor:pointer;margin-bottom:5px;text-align:center;">
-        <span
-          style="font-weight:900;letter-spacing:3px;">
-          CLIENT
-           
-          <span
-            style="color:darkgrey;">
-            [
-            0
-            ]
-          </span>
-        </span>
-      </div>
-      <div
-        class="log allowUserSelect fadeIn"
-        style="background-color:aliceblue;color:black;font-family:Menlo, Consolas, monospace;overflow-x:hidden;text-overflow:ellipsis;white-space:pre;">
-        <span
-          style="cursor:pointer;display:inline;">
-          1970-01-01 01:00:00.000  
-        </span>
-        <span>
-                              
-        </span>
-        <span
-          style="font-weight:bold;">
-          INFO  
-        </span>
-        <div
-          style="display:inline-block;width:0;">
-        </div>
-        <span
-          style="cursor:pointer;display:inline-block;padding-left:10px;width:30px;">
-        </span>
-        <span
-          style="">
-          msg 1
-        </span>
-      </div>
-      <div
-        class="log allowUserSelect fadeIn"
-        style="background-color:aliceblue;color:black;font-family:Menlo, Consolas, monospace;overflow-x:hidden;text-overflow:ellipsis;white-space:pre;">
-        <span
-          style="cursor:pointer;display:inline;">
-          1970-01-01 01:00:00.000  
-        </span>
-        <span>
-                              
-        </span>
-        <span
-          style="font-weight:bold;">
-          INFO  
-        </span>
-        <div
-          style="display:inline-block;width:0;">
-        </div>
-        <span
-          style="cursor:pointer;display:inline-block;padding-left:10px;width:30px;">
-        </span>
-        <span
-          style="color:#ff6600;">
-          msg 2
+      class="rootStoryTitle"
+      style="cursor:pointer;margin-bottom:5px;text-align:center;"
+    >
+      <span style="font-weight:900;letter-spacing:3px;">
+        CLIENT
+         
+        <span style="color:darkgrey;">
+          [
+          0
+          ]
         </span>
-      </div>
+      </span>
     </div>
     <div
-      class="rootStory"
-      style="background-color:rgb(214, 236, 255);color:black;margin-bottom:10px;padding:2px;">
-      <div
-        class="rootStoryTitle"
-        style="cursor:pointer;margin-bottom:5px;text-align:center;">
-        <span
-          style="font-weight:900;letter-spacing:3px;">
-          SERVER
-           
-          <span
-            style="color:darkgrey;">
-            [
-            0
-            ]
-          </span>
+      class="log allowUserSelect fadeIn"
+      style="background-color:aliceblue;color:black;font-family:Menlo, Consolas, monospace;overflow-x:hidden;text-overflow:ellipsis;white-space:pre;"
+    ><span style="cursor:pointer;display:inline;">1970-01-01 01:00:00.000  </span><span>                    </span><span style="font-weight:bold;">INFO  </span><div style="display:inline-block;width:0;"></div><span style="cursor:pointer;display:inline-block;padding-left:10px;width:30px;"></span><span style="">msg 1</span></div>
+    <div
+      class="log allowUserSelect fadeIn"
+      style="background-color:aliceblue;color:black;font-family:Menlo, Consolas, monospace;overflow-x:hidden;text-overflow:ellipsis;white-space:pre;"
+    ><span style="cursor:pointer;display:inline;">1970-01-01 01:00:00.000  </span><span>                    </span><span style="font-weight:bold;">INFO  </span><div style="display:inline-block;width:0;"></div><span style="cursor:pointer;display:inline-block;padding-left:10px;width:30px;"></span><span style="color:#ff6600;">msg 2</span></div>
+  </div>
+  <div
+    class="rootStory"
+    style="background-color:rgb(214, 236, 255);color:black;margin-bottom:10px;padding:2px;"
+  >
+    <div
+      class="rootStoryTitle"
+      style="cursor:pointer;margin-bottom:5px;text-align:center;"
+    >
+      <span style="font-weight:900;letter-spacing:3px;">
+        SERVER
+         
+        <span style="color:darkgrey;">
+          [
+          0
+          ]
         </span>
-      </div>
+      </span>
     </div>
   </div>
+</div>
 `;
diff --git a/testJest/chromeExtension/components/__snapshots__/030-coloredText.test.js.snap b/testJest/chromeExtension/components/__snapshots__/030-coloredText.test.js.snap
index 835642c..00073f7 100644
--- a/testJest/chromeExtension/components/__snapshots__/030-coloredText.test.js.snap
+++ b/testJest/chromeExtension/components/__snapshots__/030-coloredText.test.js.snap
@@ -29,24 +29,20 @@ exports[`ColoredText renders correctly with styled text 1`] = `
   </span>
 </span>
 ------------HTML PREVIEW---------------
-  <span>
-    <span
-      style="">
-      That\'s 
-    </span>
-    <span
-      style="color:#cc0000;">
-      red
-    </span>
-    <span
-      style="">
-       and that\'s 
-    </span>
-    <span
-      style="color:darkturquoise;font-weight:bold;">
-      very important
-    </span>
+<span>
+  <span style="">
+    That&#39;s 
   </span>
+  <span style="color:#cc0000;">
+    red
+  </span>
+  <span style="">
+     and that&#39;s 
+  </span>
+  <span style="color:darkturquoise;font-weight:bold;">
+    very important
+  </span>
+</span>
 `;
 
 exports[`ColoredText renders correctly with unstyled text 1`] = `
@@ -56,10 +52,9 @@ exports[`ColoredText renders correctly with unstyled text 1`] = `
   Hello
 </span>
 ------------HTML PREVIEW---------------
-  <span
-    style="">
-    Hello
-  </span>
+<span style="">
+  Hello
+</span>
 `;
 
 exports[`ColoredText renders nested styles correctly 1`] = `
@@ -89,20 +84,17 @@ exports[`ColoredText renders nested styles correctly 1`] = `
   </span>
 </span>
 ------------HTML PREVIEW---------------
-  <span>
-    <span
-      style="">
-      That\'s 
-    </span>
-    <span
-      style="color:#cc0000;font-weight:bold;">
-      very
-    </span>
-    <span
-      style="color:#cc0000;">
-       important
-    </span>
+<span>
+  <span style="">
+    That&#39;s 
+  </span>
+  <span style="color:#cc0000;font-weight:bold;">
+    very
   </span>
+  <span style="color:#cc0000;">
+     important
+  </span>
+</span>
 `;
 
 exports[`ColoredText respects the onClick prop 1`] = `
@@ -112,10 +104,9 @@ exports[`ColoredText respects the onClick prop 1`] = `
   Hello
 </span>
 ------------HTML PREVIEW---------------
-  <span
-    style="">
-    Hello
-  </span>
+<span style="">
+  Hello
+</span>
 `;
 
 exports[`ColoredText respects the style prop 1`] = `
@@ -129,8 +120,7 @@ exports[`ColoredText respects the style prop 1`] = `
   Hello
 </span>
 ------------HTML PREVIEW---------------
-  <span
-    style="border:1px solid black;">
-    Hello
-  </span>
+<span style="border:1px solid black;">
+  Hello
+</span>
 `;
diff --git a/yarn.lock b/yarn.lock
index c97b044..4442870 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3352,9 +3352,9 @@ jest-haste-map@^16.1.0-alpha.691b0e22:
     multimatch "^2.1.0"
     worker-farm "^1.3.1"
 
-jest-html@^1.1.0:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/jest-html/-/jest-html-1.1.0.tgz#c750681226f23679b8519104cf075b8e3aac159b"
+jest-html@^1.2.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/jest-html/-/jest-html-1.2.0.tgz#b41a060bcd8c0f0b115d55d6fc1ae0545cf36e36"
   dependencies:
     babel-polyfill "6.16.0"
     body-parser "^1.15.2"