diff --git a/__tests__/integration/api-mark-change-data-tooltip.spec.ts b/__tests__/integration/api-mark-change-data-tooltip.spec.ts
index 5cd8aa6659..2fc7078cfa 100644
--- a/__tests__/integration/api-mark-change-data-tooltip.spec.ts
+++ b/__tests__/integration/api-mark-change-data-tooltip.spec.ts
@@ -30,7 +30,7 @@ describe('mark.changeData tooltip', () => {
       }),
     );
     await expect(canvas).toMatchDOMSnapshot(dir, render.name, {
-      selector: `.tooltip`,
+      selector: '.g2-tooltip',
     });
   });
 
diff --git a/__tests__/integration/snapshots/api/chart-emit-item-tooltip/step0.html b/__tests__/integration/snapshots/api/chart-emit-item-tooltip/step0.html
index f15473bf69..ac87d9f51c 100644
--- a/__tests__/integration/snapshots/api/chart-emit-item-tooltip/step0.html
+++ b/__tests__/integration/snapshots/api/chart-emit-item-tooltip/step0.html
@@ -1,33 +1,33 @@
 <div
   xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
+  class="g2-tooltip"
   style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 226.7156883688534px; top: 380.10715157645086px;"
 >
   <div
-    class="tooltip-title"
+    class="g2-tooltip-title"
     style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
   >
     Strategy
   </div>
   <ul
-    class="tooltip-list"
+    class="g2-tooltip-list"
     style="margin: 0px; list-style-type: none; padding: 0px;"
   >
     <li
-      class="tooltip-list-item"
+      class="g2-tooltip-list-item"
       data-index="0"
       style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
     >
       <span
-        class="tooltip-list-item-name"
+        class="g2-tooltip-list-item-name"
         style="display: flex; align-items: center; max-width: 216px;"
       >
         <span
-          class="tooltip-list-item-marker"
+          class="g2-tooltip-list-item-marker"
           style="background: rgb(90, 216, 166); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
         />
         <span
-          class="tooltip-list-item-name-label"
+          class="g2-tooltip-list-item-name-label"
           title="sold"
           style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
         >
@@ -35,7 +35,7 @@
         </span>
       </span>
       <span
-        class="tooltip-list-item-value"
+        class="g2-tooltip-list-item-value"
         title="115"
         style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
       >
diff --git a/__tests__/integration/snapshots/api/chart-emit-item-tooltip/step1.html b/__tests__/integration/snapshots/api/chart-emit-item-tooltip/step1.html
index 6e556feefa..33a7921a5a 100644
--- a/__tests__/integration/snapshots/api/chart-emit-item-tooltip/step1.html
+++ b/__tests__/integration/snapshots/api/chart-emit-item-tooltip/step1.html
@@ -1,33 +1,33 @@
 <div
   xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
+  class="g2-tooltip"
   style="pointer-events: none; position: absolute; visibility: hidden; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 226.7156883688534px; top: 380.10715157645086px;"
 >
   <div
-    class="tooltip-title"
+    class="g2-tooltip-title"
     style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
   >
     Strategy
   </div>
   <ul
-    class="tooltip-list"
+    class="g2-tooltip-list"
     style="margin: 0px; list-style-type: none; padding: 0px;"
   >
     <li
-      class="tooltip-list-item"
+      class="g2-tooltip-list-item"
       data-index="0"
       style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
     >
       <span
-        class="tooltip-list-item-name"
+        class="g2-tooltip-list-item-name"
         style="display: flex; align-items: center; max-width: 216px;"
       >
         <span
-          class="tooltip-list-item-marker"
+          class="g2-tooltip-list-item-marker"
           style="background: rgb(90, 216, 166); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
         />
         <span
-          class="tooltip-list-item-name-label"
+          class="g2-tooltip-list-item-name-label"
           title="sold"
           style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
         >
@@ -35,7 +35,7 @@
         </span>
       </span>
       <span
-        class="tooltip-list-item-value"
+        class="g2-tooltip-list-item-value"
         title="115"
         style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
       >
diff --git a/__tests__/integration/snapshots/api/chart-emit-pie-tooltip/step0.html b/__tests__/integration/snapshots/api/chart-emit-pie-tooltip/step0.html
index a6716d8807..73591a9606 100644
--- a/__tests__/integration/snapshots/api/chart-emit-pie-tooltip/step0.html
+++ b/__tests__/integration/snapshots/api/chart-emit-pie-tooltip/step0.html
@@ -1,27 +1,27 @@
 <div
   xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
+  class="g2-tooltip"
   style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 432.4999842680868px; top: 166.8005px;"
 >
   <ul
-    class="tooltip-list"
+    class="g2-tooltip-list"
     style="margin: 0px; list-style-type: none; padding: 0px;"
   >
     <li
-      class="tooltip-list-item"
+      class="g2-tooltip-list-item"
       data-index="0"
       style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
     >
       <span
-        class="tooltip-list-item-name"
+        class="g2-tooltip-list-item-name"
         style="display: flex; align-items: center; max-width: 216px;"
       >
         <span
-          class="tooltip-list-item-marker"
+          class="g2-tooltip-list-item-marker"
           style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
         />
         <span
-          class="tooltip-list-item-name-label"
+          class="g2-tooltip-list-item-name-label"
           title="sold"
           style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
         >
@@ -29,7 +29,7 @@
         </span>
       </span>
       <span
-        class="tooltip-list-item-value"
+        class="g2-tooltip-list-item-value"
         title="275"
         style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
       >
diff --git a/__tests__/integration/snapshots/api/chart-emit-series-tooltip/step0.html b/__tests__/integration/snapshots/api/chart-emit-series-tooltip/step0.html
index ba61791da5..d2d9bdd24d 100644
--- a/__tests__/integration/snapshots/api/chart-emit-series-tooltip/step0.html
+++ b/__tests__/integration/snapshots/api/chart-emit-series-tooltip/step0.html
@@ -1,33 +1,33 @@
 <div
   xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
+  class="g2-tooltip"
   style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 454.78197172373046px; top: 241.0857864376269px;"
 >
   <div
-    class="tooltip-title"
+    class="g2-tooltip-title"
     style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
   >
     Tue, 16 Nov 2010 00:00:00 GMT
   </div>
   <ul
-    class="tooltip-list"
+    class="g2-tooltip-list"
     style="margin: 0px; list-style-type: none; padding: 0px;"
   >
     <li
-      class="tooltip-list-item"
+      class="g2-tooltip-list-item"
       data-index="0"
       style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
     >
       <span
-        class="tooltip-list-item-name"
+        class="g2-tooltip-list-item-name"
         style="display: flex; align-items: center; max-width: 216px;"
       >
         <span
-          class="tooltip-list-item-marker"
+          class="g2-tooltip-list-item-marker"
           style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
         />
         <span
-          class="tooltip-list-item-name-label"
+          class="g2-tooltip-list-item-name-label"
           title="close"
           style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
         >
@@ -35,7 +35,7 @@
         </span>
       </span>
       <span
-        class="tooltip-list-item-value"
+        class="g2-tooltip-list-item-value"
         title="300.5"
         style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
       >
diff --git a/__tests__/integration/snapshots/api/chart-emit-series-tooltip/step1.html b/__tests__/integration/snapshots/api/chart-emit-series-tooltip/step1.html
index 0192756a69..ee0490cbde 100644
--- a/__tests__/integration/snapshots/api/chart-emit-series-tooltip/step1.html
+++ b/__tests__/integration/snapshots/api/chart-emit-series-tooltip/step1.html
@@ -1,33 +1,33 @@
 <div
   xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
+  class="g2-tooltip"
   style="pointer-events: none; position: absolute; visibility: hidden; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 454.78197172373046px; top: 241.0857864376269px;"
 >
   <div
-    class="tooltip-title"
+    class="g2-tooltip-title"
     style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
   >
     Tue, 16 Nov 2010 00:00:00 GMT
   </div>
   <ul
-    class="tooltip-list"
+    class="g2-tooltip-list"
     style="margin: 0px; list-style-type: none; padding: 0px;"
   >
     <li
-      class="tooltip-list-item"
+      class="g2-tooltip-list-item"
       data-index="0"
       style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
     >
       <span
-        class="tooltip-list-item-name"
+        class="g2-tooltip-list-item-name"
         style="display: flex; align-items: center; max-width: 216px;"
       >
         <span
-          class="tooltip-list-item-marker"
+          class="g2-tooltip-list-item-marker"
           style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
         />
         <span
-          class="tooltip-list-item-name-label"
+          class="g2-tooltip-list-item-name-label"
           title="close"
           style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
         >
@@ -35,7 +35,7 @@
         </span>
       </span>
       <span
-        class="tooltip-list-item-value"
+        class="g2-tooltip-list-item-value"
         title="300.5"
         style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
       >
diff --git a/__tests__/integration/snapshots/api/markChangeDataTooltip.html b/__tests__/integration/snapshots/api/markChangeDataTooltip.html
index f6b4cca4ba..2368148588 100644
--- a/__tests__/integration/snapshots/api/markChangeDataTooltip.html
+++ b/__tests__/integration/snapshots/api/markChangeDataTooltip.html
@@ -1,33 +1,33 @@
 <div
   xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
+  class="g2-tooltip"
   style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 210px; top: 310px;"
 >
   <div
-    class="tooltip-title"
+    class="g2-tooltip-title"
     style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
   >
     test2
   </div>
   <ul
-    class="tooltip-list"
+    class="g2-tooltip-list"
     style="margin: 0px; list-style-type: none; padding: 0px;"
   >
     <li
-      class="tooltip-list-item"
+      class="g2-tooltip-list-item"
       data-index="0"
       style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
     >
       <span
-        class="tooltip-list-item-name"
+        class="g2-tooltip-list-item-name"
         style="display: flex; align-items: center; max-width: 216px;"
       >
         <span
-          class="tooltip-list-item-marker"
+          class="g2-tooltip-list-item-marker"
           style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
         />
         <span
-          class="tooltip-list-item-name-label"
+          class="g2-tooltip-list-item-name-label"
           title="frequency"
           style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
         >
@@ -35,7 +35,7 @@
         </span>
       </span>
       <span
-        class="tooltip-list-item-value"
+        class="g2-tooltip-list-item-value"
         title="11"
         style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
       >
diff --git a/__tests__/integration/snapshots/tooltip/aapl-area-missing-data-transpose/step0.html b/__tests__/integration/snapshots/tooltip/aapl-area-missing-data-transpose/step0.html
index a45e4b4c89..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/aapl-area-missing-data-transpose/step0.html
+++ b/__tests__/integration/snapshots/tooltip/aapl-area-missing-data-transpose/step0.html
@@ -1,46 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 110px; top: 98px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    Thu, 10 Jan 2008 00:00:00 GMT
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: black; width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="close"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          close
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="NaN"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        NaN
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/aapl-line-area-basic-sample-mount/step0.html b/__tests__/integration/snapshots/tooltip/aapl-line-area-basic-sample-mount/step0.html
index 47e433703a..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/aapl-line-area-basic-sample-mount/step0.html
+++ b/__tests__/integration/snapshots/tooltip/aapl-line-area-basic-sample-mount/step0.html
@@ -1,46 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 60px; top: 210px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    Sun, 13 May 2007 00:00:00 GMT
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="close"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          close
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="109.36"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        109.36
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/aapl-line-area-basic-sample-mount/step1.html b/__tests__/integration/snapshots/tooltip/aapl-line-area-basic-sample-mount/step1.html
index c334c6681e..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/aapl-line-area-basic-sample-mount/step1.html
+++ b/__tests__/integration/snapshots/tooltip/aapl-line-area-basic-sample-mount/step1.html
@@ -1,46 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 560px; top: 210px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    Mon, 13 Feb 2012 00:00:00 GMT
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="close"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          close
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="509.46"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        509.46
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/aapl-line-area-basic-sample/step0.html b/__tests__/integration/snapshots/tooltip/aapl-line-area-basic-sample/step0.html
index 7cc3adc376..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/aapl-line-area-basic-sample/step0.html
+++ b/__tests__/integration/snapshots/tooltip/aapl-line-area-basic-sample/step0.html
@@ -1,46 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 510px; top: 210px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    Fri, 06 May 2011 00:00:00 GMT
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="close"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          close
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="346.66"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        346.66
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/aapl-line-slider-filter/step1.html b/__tests__/integration/snapshots/tooltip/aapl-line-slider-filter/step1.html
index 8e9ce06630..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/aapl-line-slider-filter/step1.html
+++ b/__tests__/integration/snapshots/tooltip/aapl-line-slider-filter/step1.html
@@ -1,40 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 210px; top: 310px;"
->
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="close"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          close
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="94.37"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        94.37
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/aapl-line/step0.html b/__tests__/integration/snapshots/tooltip/aapl-line/step0.html
index adf263f3c1..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/aapl-line/step0.html
+++ b/__tests__/integration/snapshots/tooltip/aapl-line/step0.html
@@ -1,46 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 210px; top: 310px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    Thu, 11 Sep 2008 00:00:00 GMT
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="close"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          close
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="148.94"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        148.94
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/aapl2-candlestick-chart/step0.html b/__tests__/integration/snapshots/tooltip/aapl2-candlestick-chart/step0.html
index ff408a2477..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/aapl2-candlestick-chart/step0.html
+++ b/__tests__/integration/snapshots/tooltip/aapl2-candlestick-chart/step0.html
@@ -1,133 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    Fri, 17 Nov 2017 00:00:00 GMT
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: black; width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="low"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          low
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="169.64"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        169.64
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(228, 26, 28); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="close"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          close
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="170.15"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        170.15
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="2"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(228, 26, 28); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="open"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          open
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="171.04"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        171.04
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="3"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: black; width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="high"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          high
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="171.39"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        171.39
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/alphabet-interval-channel/step0.html b/__tests__/integration/snapshots/tooltip/alphabet-interval-channel/step0.html
index f6e1a70357..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/alphabet-interval-channel/step0.html
+++ b/__tests__/integration/snapshots/tooltip/alphabet-interval-channel/step0.html
@@ -1,46 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    A
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: steelblue; width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="frequency"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          frequency
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="0.08167"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        0.08167
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/alphabet-interval-custom-dom/step0.html b/__tests__/integration/snapshots/tooltip/alphabet-interval-custom-dom/step0.html
index 6c5a8e9dcf..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/alphabet-interval-custom-dom/step0.html
+++ b/__tests__/integration/snapshots/tooltip/alphabet-interval-custom-dom/step0.html
@@ -1,16 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div>
-    <dv>
-      <h2>A</h2>
-      <span>(0, 0)</span>
-      <ul style="padding-left: 1em">
-        <li style="color: steelblue">letter: A</li>
-        <li style="color: steelblue">frequency: 0.08167</li>
-      </ul>
-    </dv>
-  </div>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/alphabet-interval-custom-dom/step1.html b/__tests__/integration/snapshots/tooltip/alphabet-interval-custom-dom/step1.html
index 65f0122e35..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/alphabet-interval-custom-dom/step1.html
+++ b/__tests__/integration/snapshots/tooltip/alphabet-interval-custom-dom/step1.html
@@ -1,16 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div>
-    <dv>
-      <h2>B</h2>
-      <span>(0, 0)</span>
-      <ul style="padding-left: 1em">
-        <li style="color: steelblue">letter: B</li>
-        <li style="color: steelblue">frequency: 0.01492</li>
-      </ul>
-    </dv>
-  </div>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/alphabet-interval-custom-string/step0.html b/__tests__/integration/snapshots/tooltip/alphabet-interval-custom-string/step0.html
index 75e848984d..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/alphabet-interval-custom-string/step0.html
+++ b/__tests__/integration/snapshots/tooltip/alphabet-interval-custom-string/step0.html
@@ -1,14 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <dv>
-    <h2>A</h2>
-    <span>(0, 0)</span>
-    <ul style="padding-left: 1em">
-      <li style="color: steelblue">letter: A</li>
-      <li style="color: steelblue">frequency: 0.08167</li>
-    </ul>
-  </dv>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/alphabet-interval-custom-string/step1.html b/__tests__/integration/snapshots/tooltip/alphabet-interval-custom-string/step1.html
index 34523f5e81..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/alphabet-interval-custom-string/step1.html
+++ b/__tests__/integration/snapshots/tooltip/alphabet-interval-custom-string/step1.html
@@ -1,14 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <dv>
-    <h2>B</h2>
-    <span>(0, 0)</span>
-    <ul style="padding-left: 1em">
-      <li style="color: steelblue">letter: B</li>
-      <li style="color: steelblue">frequency: 0.01492</li>
-    </ul>
-  </dv>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/alphabet-interval-full/step0.html b/__tests__/integration/snapshots/tooltip/alphabet-interval-full/step0.html
index a79428536e..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/alphabet-interval-full/step0.html
+++ b/__tests__/integration/snapshots/tooltip/alphabet-interval-full/step0.html
@@ -1,75 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    steelblue
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: steelblue; width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="letter"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          letter
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="A"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        A
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: steelblue; width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="frequency"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          frequency
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="0.08167"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        0.08167
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/alphabet-interval-multi-field/step0.html b/__tests__/integration/snapshots/tooltip/alphabet-interval-multi-field/step0.html
index e3ee1df8a7..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/alphabet-interval-multi-field/step0.html
+++ b/__tests__/integration/snapshots/tooltip/alphabet-interval-multi-field/step0.html
@@ -1,75 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    A
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: steelblue; width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="letter"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          letter
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="A"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        A
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: steelblue; width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="frequency"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          frequency
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="0.08167"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        0.08167
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/alphabet-interval-multi/step0.html b/__tests__/integration/snapshots/tooltip/alphabet-interval-multi/step0.html
index e3ee1df8a7..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/alphabet-interval-multi/step0.html
+++ b/__tests__/integration/snapshots/tooltip/alphabet-interval-multi/step0.html
@@ -1,75 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    A
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: steelblue; width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="letter"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          letter
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="A"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        A
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: steelblue; width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="frequency"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          frequency
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="0.08167"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        0.08167
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/alphabet-interval-null-items/step0.html b/__tests__/integration/snapshots/tooltip/alphabet-interval-null-items/step0.html
index d980bbffca..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/alphabet-interval-null-items/step0.html
+++ b/__tests__/integration/snapshots/tooltip/alphabet-interval-null-items/step0.html
@@ -1,16 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    A
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  />
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/alphabet-interval-object/step0.html b/__tests__/integration/snapshots/tooltip/alphabet-interval-object/step0.html
index a64c1aa7ee..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/alphabet-interval-object/step0.html
+++ b/__tests__/integration/snapshots/tooltip/alphabet-interval-object/step0.html
@@ -1,75 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    A
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: red; width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="F"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          F
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="0.08167"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        0.08167
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: yellow; width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="L"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          L
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="A"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        A
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/alphabet-interval-title/step0.html b/__tests__/integration/snapshots/tooltip/alphabet-interval-title/step0.html
index a8885cb062..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/alphabet-interval-title/step0.html
+++ b/__tests__/integration/snapshots/tooltip/alphabet-interval-title/step0.html
@@ -1,46 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    0.08167
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: steelblue; width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="frequency"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          frequency
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="0.08167"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        0.08167
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/alphabet-interval-tooltip-render-update/step0.html b/__tests__/integration/snapshots/tooltip/alphabet-interval-tooltip-render-update/step0.html
index f7ff97fafb..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/alphabet-interval-tooltip-render-update/step0.html
+++ b/__tests__/integration/snapshots/tooltip/alphabet-interval-tooltip-render-update/step0.html
@@ -1,10 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div>
-    <h2>A</h2>
-    <span>frequency: 0.08167</span>
-  </div>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/alphabet-interval-tooltip-render-update/step1.html b/__tests__/integration/snapshots/tooltip/alphabet-interval-tooltip-render-update/step1.html
index 22cb338daf..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/alphabet-interval-tooltip-render-update/step1.html
+++ b/__tests__/integration/snapshots/tooltip/alphabet-interval-tooltip-render-update/step1.html
@@ -1,10 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div>
-    <h2>B</h2>
-    <span>frequency: 0.01492</span>
-  </div>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/alphabet-interval1d-mounted/step0.html b/__tests__/integration/snapshots/tooltip/alphabet-interval1d-mounted/step0.html
index f6e1a70357..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/alphabet-interval1d-mounted/step0.html
+++ b/__tests__/integration/snapshots/tooltip/alphabet-interval1d-mounted/step0.html
@@ -1,46 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    A
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: steelblue; width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="frequency"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          frequency
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="0.08167"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        0.08167
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/alphabet-interval1d/step0.html b/__tests__/integration/snapshots/tooltip/alphabet-interval1d/step0.html
index f6e1a70357..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/alphabet-interval1d/step0.html
+++ b/__tests__/integration/snapshots/tooltip/alphabet-interval1d/step0.html
@@ -1,46 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    A
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: steelblue; width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="frequency"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          frequency
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="0.08167"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        0.08167
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/body-point2d/step0.html b/__tests__/integration/snapshots/tooltip/body-point2d/step0.html
index 84b5819781..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/body-point2d/step0.html
+++ b/__tests__/integration/snapshots/tooltip/body-point2d/step0.html
@@ -1,75 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    female
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="height"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          height
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="161.2"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        161.2
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="weight"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          weight
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="51.6"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        51.6
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/cars3-line-xd/step0.html b/__tests__/integration/snapshots/tooltip/cars3-line-xd/step0.html
index 20fc2a90f4..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/cars3-line-xd/step0.html
+++ b/__tests__/integration/snapshots/tooltip/cars3-line-xd/step0.html
@@ -1,220 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    8
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(84, 48, 5); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="economy (mpg)"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          economy (mpg)
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="13"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        13
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(84, 48, 5); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="cylinders"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          cylinders
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="8"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        8
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="2"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(84, 48, 5); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="displacement (cc)"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          displacement (cc)
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="360"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        360
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="3"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(84, 48, 5); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="power (hp)"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          power (hp)
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="175"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        175
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="4"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(84, 48, 5); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="weight (lb)"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          weight (lb)
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="3821"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        3821
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="5"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(84, 48, 5); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="0-60 mph (s)"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          0-60 mph (s)
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="11"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        11
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="6"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(84, 48, 5); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="year"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          year
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="73"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        73
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/cassette-area-series/step0.html b/__tests__/integration/snapshots/tooltip/cassette-area-series/step0.html
index abcde53b97..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/cassette-area-series/step0.html
+++ b/__tests__/integration/snapshots/tooltip/cassette-area-series/step0.html
@@ -1,162 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 110px; top: 310px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    Sat, 01 Jan 1977 00:00:00 GMT
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="8 - Track"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          8 - Track
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="14.7691k"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        14.7691k
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(111, 94, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="LP/EP"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          LP/EP
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="11.3476k"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        11.3476k
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="2"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Other Tapes"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Other Tapes
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="14.7691k"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        14.7691k
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="3"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(111, 94, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Vinyl Single"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Vinyl Single
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="2.08702k"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        2.08702k
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="4"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Cassette"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Cassette
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="1.053k"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        1.053k
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/energy-sankey-custom/step0.html b/__tests__/integration/snapshots/tooltip/energy-sankey-custom/step0.html
index cb8e619d3c..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/energy-sankey-custom/step0.html
+++ b/__tests__/integration/snapshots/tooltip/energy-sankey-custom/step0.html
@@ -1,46 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    Agricultural 'waste'
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(78, 121, 167); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="value"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          value
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="124.729"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        124.729
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/energy-sankey-custom/step1.html b/__tests__/integration/snapshots/tooltip/energy-sankey-custom/step1.html
index 1cc26a70dd..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/energy-sankey-custom/step1.html
+++ b/__tests__/integration/snapshots/tooltip/energy-sankey-custom/step1.html
@@ -1,69 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(255, 157, 167); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="source"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          source
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="Pumped heat"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        Pumped heat
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(255, 157, 167); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="target"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          target
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="Heating and cooling - homes"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        Heating and cooling - homes
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/flare-point-circle-pack-custom/step0.html b/__tests__/integration/snapshots/tooltip/flare-point-circle-pack-custom/step0.html
index cce7afa931..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/flare-point-circle-pack-custom/step0.html
+++ b/__tests__/integration/snapshots/tooltip/flare-point-circle-pack-custom/step0.html
@@ -1,46 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    flare
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(163, 245, 207); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="value"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          value
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="956129"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        956129
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/flare-tree-custom/step0.html b/__tests__/integration/snapshots/tooltip/flare-tree-custom/step0.html
index d7a453a258..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/flare-tree-custom/step0.html
+++ b/__tests__/integration/snapshots/tooltip/flare-tree-custom/step0.html
@@ -1,46 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    flare
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(0, 0, 0); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="value"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          value
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="956129"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        956129
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/flare-tree-custom/step1.html b/__tests__/integration/snapshots/tooltip/flare-tree-custom/step1.html
index a6b934ebe3..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/flare-tree-custom/step1.html
+++ b/__tests__/integration/snapshots/tooltip/flare-tree-custom/step1.html
@@ -1,69 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(153, 153, 153); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="source"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          source
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="flare"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        flare
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(153, 153, 153); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="target"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          target
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="flex"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        flex
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/flare-treemap-default/step0.html b/__tests__/integration/snapshots/tooltip/flare-treemap-default/step0.html
index 982549e381..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/flare-treemap-default/step0.html
+++ b/__tests__/integration/snapshots/tooltip/flare-treemap-default/step0.html
@@ -1,46 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    flare.vis.Visualization
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(78, 121, 167); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="value"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          value
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="16540"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        16540
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/forecast-range-area-line-transpose/step0.html b/__tests__/integration/snapshots/tooltip/forecast-range-area-line-transpose/step0.html
index 8712a9dfc3..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/forecast-range-area-line-transpose/step0.html
+++ b/__tests__/integration/snapshots/tooltip/forecast-range-area-line-transpose/step0.html
@@ -1,127 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 250px; top: 310px;"
->
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="y"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          y
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="1.45231138640967"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        1.45231138640967
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(255, 107, 59); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="y"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          y
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="1.83852277548915"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        1.83852277548915
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="2"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: orange; width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="y"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          y
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="0.328739731259988"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        0.328739731259988
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="3"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: orange; width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="y1"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          y1
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="1.62978411402078"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        1.62978411402078
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/forecast-range-area-line/step0.html b/__tests__/integration/snapshots/tooltip/forecast-range-area-line/step0.html
index 42e1ff1ee2..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/forecast-range-area-line/step0.html
+++ b/__tests__/integration/snapshots/tooltip/forecast-range-area-line/step0.html
@@ -1,127 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 250px; top: 310px;"
->
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="y"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          y
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="0.89441218858635"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        0.89441218858635
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(255, 107, 59); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="y"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          y
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="1.30182293816554"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        1.30182293816554
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="2"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: orange; width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="y"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          y
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="-0.0632578758817437"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        -0.0632578758817437
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="3"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: orange; width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="y1"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          y1
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="0.790173258069052"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        0.790173258069052
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/indices-line-chart-facet/step0.html b/__tests__/integration/snapshots/tooltip/indices-line-chart-facet/step0.html
index 319d99a85f..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/indices-line-chart-facet/step0.html
+++ b/__tests__/integration/snapshots/tooltip/indices-line-chart-facet/step0.html
@@ -1,162 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 110px; top: 310px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    Fri, 20 Sep 2013 00:00:00 GMT
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="AAPL"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          AAPL
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="66.772858"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        66.772858
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(90, 216, 166); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="AMZN"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          AMZN
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="316.339996"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        316.339996
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="2"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(93, 112, 146); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="GOOG"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          GOOG
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="448.637054"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        448.637054
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="3"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(246, 189, 22); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="IBM"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          IBM
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="190.020004"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        190.020004
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="4"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(111, 94, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="MSFT"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          MSFT
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="32.790001"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        32.790001
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/indices-line-chart-facet/step1.html b/__tests__/integration/snapshots/tooltip/indices-line-chart-facet/step1.html
index b7bcac7ac2..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/indices-line-chart-facet/step1.html
+++ b/__tests__/integration/snapshots/tooltip/indices-line-chart-facet/step1.html
@@ -1,162 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 510px; top: 310px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    Mon, 17 Apr 2017 00:00:00 GMT
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="AAPL"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          AAPL
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="141.830002"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        141.830002
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(90, 216, 166); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="AMZN"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          AMZN
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="901.98999"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        901.98999
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="2"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(93, 112, 146); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="GOOG"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          GOOG
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="837.169983"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        837.169983
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="3"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(246, 189, 22); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="IBM"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          IBM
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="171.100006"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        171.100006
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="4"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(111, 94, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="MSFT"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          MSFT
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="65.480003"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        65.480003
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/indices-line-custom/step0.html b/__tests__/integration/snapshots/tooltip/indices-line-custom/step0.html
index 7c90e788fe..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/indices-line-custom/step0.html
+++ b/__tests__/integration/snapshots/tooltip/indices-line-custom/step0.html
@@ -1,19 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 210px; top: 310px;"
->
-  <div>
-    <dv>
-      <h2>Mon, 02 Jun 2014 00:00:00 GMT</h2>
-      <span>(200, 300)</span>
-      <ul style="padding-left: 1em">
-        <li style="color: #5AD8A6">AMZN: 1.167592848376513</li>
-        <li style="color: #6F5EF9">MSFT: 1.2349380028742962</li>
-        <li style="color: #5B8FF9">AAPL: 1.3824382731917897</li>
-        <li style="color: #5D7092">GOOG: 1.2637379241764328</li>
-        <li style="color: #F6BD16">IBM: 0.9171235298210918</li>
-      </ul>
-    </dv>
-  </div>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/indices-line-custom/step1.html b/__tests__/integration/snapshots/tooltip/indices-line-custom/step1.html
index 4f71df20ba..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/indices-line-custom/step1.html
+++ b/__tests__/integration/snapshots/tooltip/indices-line-custom/step1.html
@@ -1,19 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 310px; top: 310px;"
->
-  <div>
-    <dv>
-      <h2>Mon, 09 Feb 2015 00:00:00 GMT</h2>
-      <span>(300, 300)</span>
-      <ul style="padding-left: 1em">
-        <li style="color: #5AD8A6">AMZN: 1.4009299610249153</li>
-        <li style="color: #6F5EF9">MSFT: 1.2824705504835165</li>
-        <li style="color: #5B8FF9">AAPL: 1.8428991734661926</li>
-        <li style="color: #5D7092">GOOG: 1.204187825354074</li>
-        <li style="color: #F6BD16">IBM: 0.7692497615980157</li>
-      </ul>
-    </dv>
-  </div>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/indices-line-formatter/step0.html b/__tests__/integration/snapshots/tooltip/indices-line-formatter/step0.html
index 9a0d13e2a0..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/indices-line-formatter/step0.html
+++ b/__tests__/integration/snapshots/tooltip/indices-line-formatter/step0.html
@@ -1,162 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 210px; top: 310px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    2014
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(90, 216, 166); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="AMZN"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          AMZN
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="332.551"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        332.551
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(93, 112, 146); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="GOOG"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          GOOG
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="558.271"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        558.271
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="2"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(246, 189, 22); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="IBM"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          IBM
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="182.304"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        182.304
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="3"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="AAPL"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          AAPL
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="92.2647"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        92.2647
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="4"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(111, 94, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="MSFT"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          MSFT
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="42.4535"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        42.4535
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/indices-line-items/step0.html b/__tests__/integration/snapshots/tooltip/indices-line-items/step0.html
index b122835062..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/indices-line-items/step0.html
+++ b/__tests__/integration/snapshots/tooltip/indices-line-items/step0.html
@@ -1,162 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 210px; top: 310px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    Mon, 02 Jun 2014 00:00:00 GMT
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(90, 216, 166); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="AMZN"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          AMZN
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="1.2"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        1.2
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(111, 94, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="MSFT"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          MSFT
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="1.2"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        1.2
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="2"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="AAPL"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          AAPL
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="1.4"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        1.4
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="3"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(93, 112, 146); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="GOOG"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          GOOG
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="1.3"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        1.3
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="4"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(246, 189, 22); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="IBM"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          IBM
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="0.9"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        0.9
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/indices-line-point-reverse/step0.html b/__tests__/integration/snapshots/tooltip/indices-line-point-reverse/step0.html
index 54bb7fa658..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/indices-line-point-reverse/step0.html
+++ b/__tests__/integration/snapshots/tooltip/indices-line-point-reverse/step0.html
@@ -1,75 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 110px; top: 310px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    Tue, 14 May 2013 00:00:00 GMT
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="AMZN"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          AMZN
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="268.329987"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        268.329987
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(90, 216, 166); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="AAPL"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          AAPL
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="63.408573"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        63.408573
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/indices-line-point-reverse/step1.html b/__tests__/integration/snapshots/tooltip/indices-line-point-reverse/step1.html
index d38aad4025..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/indices-line-point-reverse/step1.html
+++ b/__tests__/integration/snapshots/tooltip/indices-line-point-reverse/step1.html
@@ -1,75 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 510px; top: 310px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    Fri, 24 May 2013 00:00:00 GMT
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="AMZN"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          AMZN
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="261.73999"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        261.73999
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(90, 216, 166); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="AAPL"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          AAPL
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="63.592857"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        63.592857
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/indices-line-reverse/step0.html b/__tests__/integration/snapshots/tooltip/indices-line-reverse/step0.html
index 4cfed4c42c..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/indices-line-reverse/step0.html
+++ b/__tests__/integration/snapshots/tooltip/indices-line-reverse/step0.html
@@ -1,162 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 110px; top: 310px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    Tue, 27 Aug 2013 00:00:00 GMT
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(246, 189, 22); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="AMZN"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          AMZN
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="280.929993"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        280.929993
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(93, 112, 146); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="GOOG"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          GOOG
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="422.328156"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        422.328156
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="2"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(90, 216, 166); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="IBM"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          IBM
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="182.740005"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        182.740005
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="3"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(111, 94, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="AAPL"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          AAPL
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="69.798569"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        69.798569
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="4"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="MSFT"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          MSFT
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="33.259998"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        33.259998
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/indices-line-reverse/step1.html b/__tests__/integration/snapshots/tooltip/indices-line-reverse/step1.html
index 6dd9f584ee..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/indices-line-reverse/step1.html
+++ b/__tests__/integration/snapshots/tooltip/indices-line-reverse/step1.html
@@ -1,162 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 510px; top: 310px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    Mon, 20 Jun 2016 00:00:00 GMT
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(246, 189, 22); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="AMZN"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          AMZN
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="714.01001"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        714.01001
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(93, 112, 146); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="GOOG"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          GOOG
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="693.710022"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        693.710022
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="2"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(90, 216, 166); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="IBM"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          IBM
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="153.610001"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        153.610001
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="3"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(111, 94, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="AAPL"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          AAPL
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="95.099998"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        95.099998
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="4"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="MSFT"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          MSFT
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="50.07"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        50.07
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/indices-line-series/step0.html b/__tests__/integration/snapshots/tooltip/indices-line-series/step0.html
index 93dcb5ed97..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/indices-line-series/step0.html
+++ b/__tests__/integration/snapshots/tooltip/indices-line-series/step0.html
@@ -1,162 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 110px; top: 310px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    Mon, 28 Oct 2013 00:00:00 GMT
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="AMZN"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          AMZN
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="358.160004"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        358.160004
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="GOOG"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          GOOG
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="504.22052"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        504.22052
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="2"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="IBM"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          IBM
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="177.350006"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        177.350006
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="3"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="AAPL"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          AAPL
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="75.697144"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        75.697144
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="4"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="MSFT"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          MSFT
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="35.57"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        35.57
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/indices-line/step0.html b/__tests__/integration/snapshots/tooltip/indices-line/step0.html
index ec48bdbad7..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/indices-line/step0.html
+++ b/__tests__/integration/snapshots/tooltip/indices-line/step0.html
@@ -1,162 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 210px; top: 310px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    Mon, 02 Jun 2014 00:00:00 GMT
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(90, 216, 166); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="AMZN"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          AMZN
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="1.167592848376513"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        1.167592848376513
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(111, 94, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="MSFT"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          MSFT
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="1.2349380028742962"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        1.2349380028742962
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="2"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="AAPL"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          AAPL
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="1.3824382731917897"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        1.3824382731917897
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="3"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(93, 112, 146); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="GOOG"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          GOOG
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="1.2637379241764328"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        1.2637379241764328
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="4"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(246, 189, 22); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="IBM"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          IBM
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="0.9171235298210918"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        0.9171235298210918
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/languages-interval-stack/step0.html b/__tests__/integration/snapshots/tooltip/languages-interval-stack/step0.html
index d891dfd795..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/languages-interval-stack/step0.html
+++ b/__tests__/integration/snapshots/tooltip/languages-interval-stack/step0.html
@@ -1,40 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(90, 216, 166); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="value"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          value
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="220"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        220
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/london-tube-line-geo/step0.html b/__tests__/integration/snapshots/tooltip/london-tube-line-geo/step0.html
index b9f5a8a037..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/london-tube-line-geo/step0.html
+++ b/__tests__/integration/snapshots/tooltip/london-tube-line-geo/step0.html
@@ -1,16 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    Kingston upon Thames
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  />
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/london-tube-line-geo/step1.html b/__tests__/integration/snapshots/tooltip/london-tube-line-geo/step1.html
index 7631d6cc99..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/london-tube-line-geo/step1.html
+++ b/__tests__/integration/snapshots/tooltip/london-tube-line-geo/step1.html
@@ -1,69 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(29, 33, 41); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="cx"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          cx
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="-0.34127462993183943"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        -0.34127462993183943
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(29, 33, 41); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="cy"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          cy
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="51.59771852185307"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        51.59771852185307
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/miserable-force-custom/step0.html b/__tests__/integration/snapshots/tooltip/miserable-force-custom/step0.html
index 3034d658da..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/miserable-force-custom/step0.html
+++ b/__tests__/integration/snapshots/tooltip/miserable-force-custom/step0.html
@@ -1,70 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(0, 0, 0); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="source"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          source
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="Structural basis of PROTAC cooperative recognition for selective protein degradation."
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        Structural basis of PROTAC cooperative recognition for selective protein
-        degradation.
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(0, 0, 0); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="target"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          target
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="109-294-662-661-65X"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        109-294-662-661-65X
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/miserable-force-custom/step1.html b/__tests__/integration/snapshots/tooltip/miserable-force-custom/step1.html
index daf0b2ca93..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/miserable-force-custom/step1.html
+++ b/__tests__/integration/snapshots/tooltip/miserable-force-custom/step1.html
@@ -1,47 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    Cited Works
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(78, 121, 167); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="key"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          key
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="Structural basis of PROTAC cooperative recognition for selective protein degradation."
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        Structural basis of PROTAC cooperative recognition for selective protein
-        degradation.
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/mock-line-falsy/step0.html b/__tests__/integration/snapshots/tooltip/mock-line-falsy/step0.html
index 7d03c7466f..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/mock-line-falsy/step0.html
+++ b/__tests__/integration/snapshots/tooltip/mock-line-falsy/step0.html
@@ -1,46 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 210px; top: 310px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    北京
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="value"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          value
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="null"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        null
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/mock-line-falsy/step1.html b/__tests__/integration/snapshots/tooltip/mock-line-falsy/step1.html
index d5d37285e0..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/mock-line-falsy/step1.html
+++ b/__tests__/integration/snapshots/tooltip/mock-line-falsy/step1.html
@@ -1,46 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 285px; top: 310px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    河北
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="value"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          value
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="0"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        0
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/mock-line-falsy/step2.html b/__tests__/integration/snapshots/tooltip/mock-line-falsy/step2.html
index 0dd86785e7..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/mock-line-falsy/step2.html
+++ b/__tests__/integration/snapshots/tooltip/mock-line-falsy/step2.html
@@ -1,46 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 430px; top: 310px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    海南
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="value"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          value
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="undefined"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        undefined
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/morley-box-channel/step0.html b/__tests__/integration/snapshots/tooltip/morley-box-channel/step0.html
index d3691d2c71..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/morley-box-channel/step0.html
+++ b/__tests__/integration/snapshots/tooltip/morley-box-channel/step0.html
@@ -1,162 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    1070
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(170, 170, 170); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="min"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          min
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="740"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        740
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(170, 170, 170); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="q1"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          q1
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="850"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        850
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="2"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(170, 170, 170); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="q2"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          q2
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="940"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        940
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="3"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(170, 170, 170); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="q3"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          q3
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="980"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        980
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="4"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: red; width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="max"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          max
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="1070"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        1070
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/morley-box-channel/step1.html b/__tests__/integration/snapshots/tooltip/morley-box-channel/step1.html
index 1a6b95448f..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/morley-box-channel/step1.html
+++ b/__tests__/integration/snapshots/tooltip/morley-box-channel/step1.html
@@ -1,46 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    650
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(0, 0, 0); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Expt"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Expt
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="1"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        1
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/morley-box-default-extend/step0.html b/__tests__/integration/snapshots/tooltip/morley-box-default-extend/step0.html
index d2e1956614..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/morley-box-default-extend/step0.html
+++ b/__tests__/integration/snapshots/tooltip/morley-box-default-extend/step0.html
@@ -1,162 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    1
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="min"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          min
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="650"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        650
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="q1"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          q1
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="850"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        850
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="2"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="q2"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          q2
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="940"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        940
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="3"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="q3"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          q3
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="980"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        980
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="4"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="max"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          max
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="1070"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        1070
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/morley-box-default/step0.html b/__tests__/integration/snapshots/tooltip/morley-box-default/step0.html
index 605496dc56..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/morley-box-default/step0.html
+++ b/__tests__/integration/snapshots/tooltip/morley-box-default/step0.html
@@ -1,162 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    1
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(170, 170, 170); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="min"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          min
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="740"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        740
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(170, 170, 170); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="q1"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          q1
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="850"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        850
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="2"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(170, 170, 170); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="q2"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          q2
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="940"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        940
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="3"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(170, 170, 170); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="q3"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          q3
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="980"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        980
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="4"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(170, 170, 170); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="max"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          max
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="1070"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        1070
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/morley-box-default/step1.html b/__tests__/integration/snapshots/tooltip/morley-box-default/step1.html
index 93da31798a..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/morley-box-default/step1.html
+++ b/__tests__/integration/snapshots/tooltip/morley-box-default/step1.html
@@ -1,46 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    1
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(0, 0, 0); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="outlier"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          outlier
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="650"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        650
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/morley-box/step0.html b/__tests__/integration/snapshots/tooltip/morley-box/step0.html
index b559fdb8f3..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/morley-box/step0.html
+++ b/__tests__/integration/snapshots/tooltip/morley-box/step0.html
@@ -1,162 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    1
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(170, 170, 170); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="min"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          min
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="0.74k"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        0.74k
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(170, 170, 170); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="q1"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          q1
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="0.85k"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        0.85k
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="2"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(170, 170, 170); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="q2"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          q2
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="0.94k"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        0.94k
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="3"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(170, 170, 170); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="q3"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          q3
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="0.98k"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        0.98k
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="4"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: red; width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="max"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          max
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="1.07k"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        1.07k
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/population-by-state-area-normalize-stacked/step0.html b/__tests__/integration/snapshots/tooltip/population-by-state-area-normalize-stacked/step0.html
index f14e4a9fef..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/population-by-state-area-normalize-stacked/step0.html
+++ b/__tests__/integration/snapshots/tooltip/population-by-state-area-normalize-stacked/step0.html
@@ -1,539 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 110px; top: 310px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    Wed, 01 Jan 1800 00:00:00 GMT
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(246, 189, 22); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Kentucky"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Kentucky
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="4.16%"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        4.16%
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(246, 189, 22); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Tennessee"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Tennessee
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="1.99%"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        1.99%
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="2"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(93, 112, 146); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Delaware"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Delaware
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="1.21%"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        1.21%
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="3"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(93, 112, 146); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="West Virginia"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          West Virginia
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="1.48%"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        1.48%
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="4"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(93, 112, 146); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="South Carolina"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          South Carolina
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="6.51%"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        6.51%
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="5"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(93, 112, 146); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Maryland"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Maryland
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="6.43%"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        6.43%
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="6"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(93, 112, 146); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Georgia"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Georgia
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="3.06%"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        3.06%
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="7"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(93, 112, 146); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Virginia"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Virginia
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="15.21%"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        15.21%
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="8"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(93, 112, 146); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="North Carolina"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          North Carolina
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="9.01%"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        9.01%
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="9"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(90, 216, 166); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="New Jersey"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          New Jersey
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="3.98%"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        3.98%
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="10"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(90, 216, 166); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Pennsylvania"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Pennsylvania
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="11.35%"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        11.35%
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="11"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(90, 216, 166); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="New York"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          New York
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="11.10%"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        11.10%
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="12"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Vermont"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Vermont
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="2.91%"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        2.91%
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="13"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="New Hampshire"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          New Hampshire
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="3.46%"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        3.46%
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="14"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Rhode Island"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Rhode Island
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="1.30%"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        1.30%
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="15"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Maine"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Maine
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="2.86%"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        2.86%
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="16"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Connecticut"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Connecticut
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="4.73%"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        4.73%
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="17"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Massachusetts"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Massachusetts
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="7.97%"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        7.97%
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/profit-interval-legend-filter-ordinal/step1.html b/__tests__/integration/snapshots/tooltip/profit-interval-legend-filter-ordinal/step1.html
index 7b0e5071af..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/profit-interval-legend-filter-ordinal/step1.html
+++ b/__tests__/integration/snapshots/tooltip/profit-interval-legend-filter-ordinal/step1.html
@@ -1,75 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    Jan.
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="end"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          end
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="387264"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        387264
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="start"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          start
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="0"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        0
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/provinces-line-group-name/step0.html b/__tests__/integration/snapshots/tooltip/provinces-line-group-name/step0.html
index f2a38db1bf..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/provinces-line-group-name/step0.html
+++ b/__tests__/integration/snapshots/tooltip/provinces-line-group-name/step0.html
@@ -1,104 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 460px; top: 310px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    3
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(90, 216, 166); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="number"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          number
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="244"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        244
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(90, 216, 166); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="province"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          province
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="四川省"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        四川省
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="2"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(90, 216, 166); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="sub_type"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          sub_type
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="xx"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        xx
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/score-by-item-area-radar/step0.html b/__tests__/integration/snapshots/tooltip/score-by-item-area-radar/step0.html
index 000ba3250b..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/score-by-item-area-radar/step0.html
+++ b/__tests__/integration/snapshots/tooltip/score-by-item-area-radar/step0.html
@@ -1,75 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 210px; top: 310px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    Support
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="a"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          a
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="30"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        30
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(90, 216, 166); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="b"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          b
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="40"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        40
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/seattle-weather-interval-aggregated/step0.html b/__tests__/integration/snapshots/tooltip/seattle-weather-interval-aggregated/step0.html
index 0560a2a6e4..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/seattle-weather-interval-aggregated/step0.html
+++ b/__tests__/integration/snapshots/tooltip/seattle-weather-interval-aggregated/step0.html
@@ -1,46 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    0
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(174, 199, 232); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="count"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          count
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="124"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        124
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/state-ages-interval-normalized/step0.html b/__tests__/integration/snapshots/tooltip/state-ages-interval-normalized/step0.html
index 3e475e61f0..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/state-ages-interval-normalized/step0.html
+++ b/__tests__/integration/snapshots/tooltip/state-ages-interval-normalized/step0.html
@@ -1,46 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    AL
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="population"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          population
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="0.12362274857864762"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        0.12362274857864762
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/state-ages-interval-shared/step0.html b/__tests__/integration/snapshots/tooltip/state-ages-interval-shared/step0.html
index 32b4f06d84..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/state-ages-interval-shared/step0.html
+++ b/__tests__/integration/snapshots/tooltip/state-ages-interval-shared/step0.html
@@ -1,278 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    CA
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="&lt;10"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          &lt;10
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="5038433"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        5038433
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(90, 216, 166); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="10-19"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          10-19
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="5170341"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        5170341
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="2"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(93, 112, 146); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="20-29"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          20-29
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="5809455"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        5809455
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="3"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(246, 189, 22); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="30-39"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          30-39
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="5354112"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        5354112
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="4"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(111, 94, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="40-49"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          40-49
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="5179258"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        5179258
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="5"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(109, 200, 236); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="50-59"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          50-59
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="5042094"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        5042094
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="6"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(148, 95, 185); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="60-69"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          60-69
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="3737461"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        3737461
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="7"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(255, 152, 69); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="70-79"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          70-79
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="2011678"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        2011678
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="8"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(30, 148, 147); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="≥80"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          ≥80
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="1311374"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        1311374
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/symbols-line-missing-data/step0.html b/__tests__/integration/snapshots/tooltip/symbols-line-missing-data/step0.html
index e20d059eab..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/symbols-line-missing-data/step0.html
+++ b/__tests__/integration/snapshots/tooltip/symbols-line-missing-data/step0.html
@@ -1,46 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 210px; top: 310px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    2000-02-03
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="foo1"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          foo1
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="34"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        34
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/symbols-line-missing-data/step1.html b/__tests__/integration/snapshots/tooltip/symbols-line-missing-data/step1.html
index dcdc92d36d..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/symbols-line-missing-data/step1.html
+++ b/__tests__/integration/snapshots/tooltip/symbols-line-missing-data/step1.html
@@ -1,46 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 410px; top: 310px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    2000-02-04
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(90, 216, 166); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="foo2"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          foo2
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="31"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        31
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/temperature2-line-threshold/step0.html b/__tests__/integration/snapshots/tooltip/temperature2-line-threshold/step0.html
index d41b7eaf33..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/temperature2-line-threshold/step0.html
+++ b/__tests__/integration/snapshots/tooltip/temperature2-line-threshold/step0.html
@@ -1,46 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 210px; top: 310px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    Fri, 02 Dec 2011 00:00:00 GMT
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: red; width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="value"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          value
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="62.2"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        62.2
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/temperatures-line-discrete/step0.html b/__tests__/integration/snapshots/tooltip/temperatures-line-discrete/step0.html
index 79c669f9cf..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/temperatures-line-discrete/step0.html
+++ b/__tests__/integration/snapshots/tooltip/temperatures-line-discrete/step0.html
@@ -1,75 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 210px; top: 310px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    Apr
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Tokyo"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Tokyo
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="14.5"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        14.5
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(90, 216, 166); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="London"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          London
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="8.5"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        8.5
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/temperatures-line-point-discrete/step0.html b/__tests__/integration/snapshots/tooltip/temperatures-line-point-discrete/step0.html
index 79c669f9cf..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/temperatures-line-point-discrete/step0.html
+++ b/__tests__/integration/snapshots/tooltip/temperatures-line-point-discrete/step0.html
@@ -1,75 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 210px; top: 310px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    Apr
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Tokyo"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Tokyo
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="14.5"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        14.5
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(90, 216, 166); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="London"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          London
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="8.5"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        8.5
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/unemployment-area-stack/step0.html b/__tests__/integration/snapshots/tooltip/unemployment-area-stack/step0.html
index 19f4da6b03..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/unemployment-area-stack/step0.html
+++ b/__tests__/integration/snapshots/tooltip/unemployment-area-stack/step0.html
@@ -1,423 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 210px; top: 310px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    Invalid Date
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(222, 207, 234); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Mining and Extraction"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Mining and Extraction
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="28"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        28
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(148, 95, 185); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Agriculture"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Agriculture
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="269"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        269
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="2"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(211, 238, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Information"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Information
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="266"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        266
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="3"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(109, 200, 236); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Transportation and Utilities"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Transportation and Utilities
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="313"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        313
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="4"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(211, 206, 253); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Other"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Other
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="314"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        314
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="5"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(111, 94, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Self-employed"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Self-employed
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="217"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        217
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="6"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(252, 235, 185); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Finance"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Finance
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="287"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        287
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="7"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(246, 189, 22); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Government"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Government
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="477"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        477
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="8"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(206, 212, 222); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Education and Health"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Education and Health
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="540"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        540
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="9"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(93, 112, 146); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Construction"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Construction
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="1009"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        1009
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="10"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(205, 243, 228); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Business services"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Business services
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="964"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        964
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="11"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(90, 216, 166); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Leisure and hospitality"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Leisure and hospitality
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="976"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        976
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="12"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(205, 221, 253); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Manufacturing"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Manufacturing
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="1367"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        1367
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="13"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Wholesale and Retail Trade"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Wholesale and Retail Trade
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="1269"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        1269
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/unemployment-choropleth/step0.html b/__tests__/integration/snapshots/tooltip/unemployment-choropleth/step0.html
index ebedf1882a..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/unemployment-choropleth/step0.html
+++ b/__tests__/integration/snapshots/tooltip/unemployment-choropleth/step0.html
@@ -1,46 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    22051
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(218, 241, 180); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="rate"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          rate
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="0.065"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        0.065
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/unemployment2-rect-bin-x/step0.html b/__tests__/integration/snapshots/tooltip/unemployment2-rect-bin-x/step0.html
index a0e048a676..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/unemployment2-rect-bin-x/step0.html
+++ b/__tests__/integration/snapshots/tooltip/unemployment2-rect-bin-x/step0.html
@@ -1,46 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    5, 5.5
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="count"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          count
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="380"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        380
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/value-area-line-unique/step0.html b/__tests__/integration/snapshots/tooltip/value-area-line-unique/step0.html
index 25bff00ce2..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/value-area-line-unique/step0.html
+++ b/__tests__/integration/snapshots/tooltip/value-area-line-unique/step0.html
@@ -1,46 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 210px; top: 310px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    1993
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(91, 143, 249); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="value"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          value
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="15900"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        15900
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/weather-line-interval/step0.html b/__tests__/integration/snapshots/tooltip/weather-line-interval/step0.html
index 103d0c54a7..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/weather-line-interval/step0.html
+++ b/__tests__/integration/snapshots/tooltip/weather-line-interval/step0.html
@@ -1,75 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 310px; top: 310px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    May
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(145, 204, 117); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Precipitation"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Precipitation
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="28.7"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        28.7
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(238, 102, 102); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Temperature"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Temperature
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="6.3"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        6.3
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/weather-line-interval/step1.html b/__tests__/integration/snapshots/tooltip/weather-line-interval/step1.html
index ad8784adb9..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/weather-line-interval/step1.html
+++ b/__tests__/integration/snapshots/tooltip/weather-line-interval/step1.html
@@ -1,104 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 330px; top: 310px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    Jun
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(145, 204, 117); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Precipitation"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Precipitation
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="70.7"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        70.7
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(238, 102, 102); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Temperature"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Temperature
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="10.2"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        10.2
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="2"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(84, 112, 198); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="Evaporation"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          Evaporation
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="76.7"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        76.7
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/__tests__/integration/snapshots/tooltip/wind-vector-wind/step0.html b/__tests__/integration/snapshots/tooltip/wind-vector-wind/step0.html
index 6e00064d58..ec747fa47d 100644
--- a/__tests__/integration/snapshots/tooltip/wind-vector-wind/step0.html
+++ b/__tests__/integration/snapshots/tooltip/wind-vector-wind/step0.html
@@ -1,75 +1 @@
-<div
-  xmlns="http://www.w3.org/1999/xhtml"
-  class="tooltip"
-  style="pointer-events: none; position: absolute; visibility: visible; z-index: 8; transition: visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), left 0.4s cubic-bezier(0.23, 1, 0.32, 1), top 0.4s cubic-bezier(0.23, 1, 0.32, 1); background-color: rgba(255, 255, 255, 0.96); box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.12); border-radius: 4px; color: rgba(0, 0, 0, 0.65); font-size: 12px; line-height: 20px; padding: 12px; min-width: 120px; max-width: 360px; font-family: Roboto-Regular; left: 10px; top: 10px;"
->
-  <div
-    class="tooltip-title"
-    style="color: rgba(0, 0, 0, 0.45); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-  >
-    3.1189485109180706
-  </div>
-  <ul
-    class="tooltip-list"
-    style="margin: 0px; list-style-type: none; padding: 0px;"
-  >
-    <li
-      class="tooltip-list-item"
-      data-index="0"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(58, 83, 139); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="longitude"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          longitude
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="0.125"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        0.125
-      </span>
-    </li>
-    <li
-      class="tooltip-list-item"
-      data-index="1"
-      style="list-style-type: none; display: flex; line-height: 2em; align-items: center; justify-content: space-between; white-space: nowrap;"
-    >
-      <span
-        class="tooltip-list-item-name"
-        style="display: flex; align-items: center; max-width: 216px;"
-      >
-        <span
-          class="tooltip-list-item-marker"
-          style="background: rgb(58, 83, 139); width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px;"
-        />
-        <span
-          class="tooltip-list-item-name-label"
-          title="latitude"
-          style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-        >
-          latitude
-        </span>
-      </span>
-      <span
-        class="tooltip-list-item-value"
-        title="45.125"
-        style="display: inline-block; float: right; flex: 1; text-align: right; min-width: 28px; margin-left: 30px; color: rgba(0, 0, 0, 0.85); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"
-      >
-        45.125
-      </span>
-    </li>
-  </ul>
-</div>;
+null
\ No newline at end of file
diff --git a/package.json b/package.json
index 4ff816efdc..1b3f912a07 100644
--- a/package.json
+++ b/package.json
@@ -51,7 +51,7 @@
     "@antv/g": "^5.7.4",
     "@antv/g-canvas": "^1.7.4",
     "@antv/g-plugin-dragndrop": "^1.6.1",
-    "@antv/gui": "^0.5.0-alpha.18",
+    "@antv/gui": "^0.5.0-alpha.22",
     "@antv/path-util": "^3.0.1",
     "@antv/scale": "^0.4.7",
     "@antv/util": "^3.3.2",