MD History: Improve test helpers, update synced tabs tests to use them

chrome/browser/resources/md_history/shared_style.html

Index: chrome/browser/resources/md_history/shared_style.html
diff --git a/chrome/browser/resources/md_history/shared_style.html b/chrome/browser/resources/md_history/shared_style.html
index 3c782602b1d74571b6a5b923f7aa141cbbcba1cb..9cddb39252bd564c99046c42e79bc4dfc0400f37 100644
--- a/chrome/browser/resources/md_history/shared_style.html
+++ b/chrome/browser/resources/md_history/shared_style.html
@@ -1,39 +1,8 @@
+<link rel="import" href="chrome://history/shared_vars.html">
+
 <dom-module id="shared-style">
   <template>
     <style>
-      :root {
-        --card-border-color: rgba(0, 0, 0, 0.14);
-        --card-box-shadow: {
-          box-shadow: 0 2px 2px rgba(0, 0, 0, .05),
-                      0 1px 4px rgba(0, 0, 0, .08),
-                      0 1px 1px rgba(0, 0, 0, .2);;
-        };
-        --card-container-filter: {
-          filter: drop-shadow(0 2px 1px rgba(0, 0, 0, .05))
-                  drop-shadow(0 1px 0px rgba(0, 0, 0, .08))
-                  drop-shadow(0 1px 1px rgba(0, 0, 0, .2));
-        };
-        --card-first-last-item-padding: 8px;
-        --card-max-width: 960px;
-        --card-min-width: 550px;
-        --card-padding-between: 20px;
-        --card-padding-side: 24px;
-        --card-sizing: {
-          margin: 0 auto;
-          max-width: var(--card-max-width);
-          min-width: var(--card-min-width);
-          padding: 0 var(--card-padding-side);
-          width: calc(100% - 2 * var(--card-padding-side));
-        };
-        --first-card-padding-top: 24px;
-        --item-height: 44px;
-        --primary-text-color: #333;
-        --secondary-text-color: #757575;
-        --side-bar-width: 256px;
-        --toolbar-grouped-height: 101px;
-        --toolbar-height: 56px;
-      }
-
       [hidden] {
         display: none !important;
       }