Added visual tests for Material theme.

vaadin · Aug 23, 2018 · 49b4e10 · 49b4e10
1 parent b6ab6b2
commit 49b4e10
Show file tree

Hide file tree

Showing 135 changed files with 54 additions and 32 deletions.
diff --git a/.gitignore b/.gitignore
@@ -3,4 +3,4 @@ node_modules
 package-lock.json
 yarn.lock
 coverage
-
+analysis.json
diff --git a/test/visual/basic.html b/test/visual/basic.html
@@ -4,9 +4,12 @@
   <meta charset="UTF-8">
   <title></title>
   <script src="../../../webcomponentsjs/webcomponents-lite.js"></script>
+  <script>
+    const theme = window.location.search.replace(/.*theme=(\w+).*/, '$1') || 'lumo';
+    document.write(`<link rel="import" href="../../theme/${theme}/form-layout.html">`);
+    document.write(`<link rel="import" href="../../theme/${theme}/vaadin-form-item.html">`);
+  </script>
   <link rel="import" href="../../../polymer/polymer-element.html">
-  <link rel="import" href="../../vaadin-form-layout.html">
-  <link rel="import" href="../../vaadin-form-item.html">
   <script>
     window.addEventListener('WebComponentsReady', function() {
       setTimeout(function() {

diff --git a/test/visual/br.html b/test/visual/br.html
@@ -5,8 +5,11 @@
   <title></title>
   <script src="../../../webcomponentsjs/webcomponents-lite.js"></script>
   <link rel="import" href="../../../polymer/polymer-element.html">
-  <link rel="import" href="../../vaadin-form-layout.html">
-  <link rel="import" href="../../vaadin-form-item.html">
+  <script>
+    const theme = window.location.search.replace(/.*theme=(\w+).*/, '$1') || 'lumo';
+    document.write(`<link rel="import" href="../../theme/${theme}/form-layout.html">`);
+    document.write(`<link rel="import" href="../../theme/${theme}/vaadin-form-item.html">`);
+  </script>
   <script>
     window.addEventListener('WebComponentsReady', function() {
       setTimeout(function() {

diff --git a/test/visual/colspan.html b/test/visual/colspan.html
@@ -5,8 +5,11 @@
   <title></title>
   <script src="../../../webcomponentsjs/webcomponents-lite.js"></script>
   <link rel="import" href="../../../polymer/polymer-element.html">
-  <link rel="import" href="../../vaadin-form-layout.html">
-  <link rel="import" href="../../vaadin-form-item.html">
+  <script>
+    const theme = window.location.search.replace(/.*theme=(\w+).*/, '$1') || 'lumo';
+    document.write(`<link rel="import" href="../../theme/${theme}/form-layout.html">`);
+    document.write(`<link rel="import" href="../../theme/${theme}/vaadin-form-item.html">`);
+  </script>
   <script>
     window.addEventListener('WebComponentsReady', function() {
       setTimeout(function() {

diff --git a/test/visual/css-properties.html b/test/visual/css-properties.html
@@ -5,8 +5,11 @@
   <title></title>
   <script src="../../../webcomponentsjs/webcomponents-lite.js"></script>
   <link rel="import" href="../../../polymer/polymer-element.html">
-  <link rel="import" href="../../vaadin-form-layout.html">
-  <link rel="import" href="../../vaadin-form-item.html">
+  <script>
+    const theme = window.location.search.replace(/.*theme=(\w+).*/, '$1') || 'lumo';
+    document.write(`<link rel="import" href="../../theme/${theme}/form-layout.html">`);
+    document.write(`<link rel="import" href="../../theme/${theme}/vaadin-form-item.html">`);
+  </script>
   <script>
     window.addEventListener('WebComponentsReady', function() {
       setTimeout(function() {

diff --git a/test/visual/responsive-steps.html b/test/visual/responsive-steps.html
@@ -5,8 +5,11 @@
   <title></title>
   <script src="../../../webcomponentsjs/webcomponents-lite.js"></script>
   <link rel="import" href="../../../polymer/polymer-element.html">
-  <link rel="import" href="../../vaadin-form-layout.html">
-  <link rel="import" href="../../vaadin-form-item.html">
+  <script>
+    const theme = window.location.search.replace(/.*theme=(\w+).*/, '$1') || 'lumo';
+    document.write(`<link rel="import" href="../../theme/${theme}/form-layout.html">`);
+    document.write(`<link rel="import" href="../../theme/${theme}/vaadin-form-item.html">`);
+  </script>
   <script>
     window.addEventListener('WebComponentsReady', function() {
       setTimeout(function() {

diff --git a/test/visual/screens/vaadin-form-layout/basic-lumo/10em/chrome.png b/test/visual/screens/vaadin-form-layout/basic-lumo/10em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/basic-lumo/10em/firefox.png b/test/visual/screens/vaadin-form-layout/basic-lumo/10em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/basic-lumo/20em/chrome.png b/test/visual/screens/vaadin-form-layout/basic-lumo/20em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/basic-lumo/20em/firefox.png b/test/visual/screens/vaadin-form-layout/basic-lumo/20em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/basic-lumo/default/chrome.png b/test/visual/screens/vaadin-form-layout/basic-lumo/default/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/basic-lumo/default/firefox.png b/test/visual/screens/vaadin-form-layout/basic-lumo/default/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/basic-material/10em/chrome.png b/test/visual/screens/vaadin-form-layout/basic-material/10em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/basic-material/10em/firefox.png b/test/visual/screens/vaadin-form-layout/basic-material/10em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/basic-material/20em/chrome.png b/test/visual/screens/vaadin-form-layout/basic-material/20em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/basic-material/20em/firefox.png b/test/visual/screens/vaadin-form-layout/basic-material/20em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/basic-material/default/chrome.png b/test/visual/screens/vaadin-form-layout/basic-material/default/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/basic-material/default/firefox.png b/test/visual/screens/vaadin-form-layout/basic-material/default/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/basic/10em/chrome.png b/test/visual/screens/vaadin-form-layout/basic/10em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/basic/10em/firefox.png b/test/visual/screens/vaadin-form-layout/basic/10em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/basic/20em/chrome.png b/test/visual/screens/vaadin-form-layout/basic/20em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/basic/20em/firefox.png b/test/visual/screens/vaadin-form-layout/basic/20em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/basic/default/chrome.png b/test/visual/screens/vaadin-form-layout/basic/default/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/basic/default/firefox.png b/test/visual/screens/vaadin-form-layout/basic/default/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/br-lumo/10em/chrome.png b/test/visual/screens/vaadin-form-layout/br-lumo/10em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/br-lumo/10em/firefox.png b/test/visual/screens/vaadin-form-layout/br-lumo/10em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/br-lumo/20em/chrome.png b/test/visual/screens/vaadin-form-layout/br-lumo/20em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/br-lumo/20em/firefox.png b/test/visual/screens/vaadin-form-layout/br-lumo/20em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/br-lumo/default/chrome.png b/test/visual/screens/vaadin-form-layout/br-lumo/default/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/br-lumo/default/firefox.png b/test/visual/screens/vaadin-form-layout/br-lumo/default/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/br-material/10em/chrome.png b/test/visual/screens/vaadin-form-layout/br-material/10em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/br-material/10em/firefox.png b/test/visual/screens/vaadin-form-layout/br-material/10em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/br-material/20em/chrome.png b/test/visual/screens/vaadin-form-layout/br-material/20em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/br-material/20em/firefox.png b/test/visual/screens/vaadin-form-layout/br-material/20em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/br-material/default/chrome.png b/test/visual/screens/vaadin-form-layout/br-material/default/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/br-material/default/firefox.png b/test/visual/screens/vaadin-form-layout/br-material/default/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/br/10em/chrome.png b/test/visual/screens/vaadin-form-layout/br/10em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/br/10em/firefox.png b/test/visual/screens/vaadin-form-layout/br/10em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/br/20em/chrome.png b/test/visual/screens/vaadin-form-layout/br/20em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/br/20em/firefox.png b/test/visual/screens/vaadin-form-layout/br/20em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/br/default/chrome.png b/test/visual/screens/vaadin-form-layout/br/default/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/br/default/firefox.png b/test/visual/screens/vaadin-form-layout/br/default/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/colspan-lumo/10em/chrome.png b/test/visual/screens/vaadin-form-layout/colspan-lumo/10em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/colspan-lumo/10em/firefox.png b/test/visual/screens/vaadin-form-layout/colspan-lumo/10em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/colspan-lumo/20em/chrome.png b/test/visual/screens/vaadin-form-layout/colspan-lumo/20em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/colspan-lumo/20em/firefox.png b/test/visual/screens/vaadin-form-layout/colspan-lumo/20em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/colspan-lumo/default/chrome.png b/test/visual/screens/vaadin-form-layout/colspan-lumo/default/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/colspan-lumo/default/firefox.png b/test/visual/screens/vaadin-form-layout/colspan-lumo/default/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/colspan-material/10em/chrome.png b/test/visual/screens/vaadin-form-layout/colspan-material/10em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/colspan-material/10em/firefox.png b/test/visual/screens/vaadin-form-layout/colspan-material/10em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/colspan-material/20em/chrome.png b/test/visual/screens/vaadin-form-layout/colspan-material/20em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/colspan-material/20em/firefox.png b/test/visual/screens/vaadin-form-layout/colspan-material/20em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/colspan-material/default/chrome.png b/test/visual/screens/vaadin-form-layout/colspan-material/default/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/colspan-material/default/firefox.png b/test/visual/screens/vaadin-form-layout/colspan-material/default/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/colspan/10em/chrome.png b/test/visual/screens/vaadin-form-layout/colspan/10em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/colspan/10em/firefox.png b/test/visual/screens/vaadin-form-layout/colspan/10em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/colspan/20em/chrome.png b/test/visual/screens/vaadin-form-layout/colspan/20em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/colspan/20em/firefox.png b/test/visual/screens/vaadin-form-layout/colspan/20em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/colspan/default/chrome.png b/test/visual/screens/vaadin-form-layout/colspan/default/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/colspan/default/firefox.png b/test/visual/screens/vaadin-form-layout/colspan/default/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/css-properties-lumo/10em/chrome.png b/test/visual/screens/vaadin-form-layout/css-properties-lumo/10em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/css-properties-lumo/10em/firefox.png b/test/visual/screens/vaadin-form-layout/css-properties-lumo/10em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/css-properties-lumo/20em/chrome.png b/test/visual/screens/vaadin-form-layout/css-properties-lumo/20em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/css-properties-lumo/20em/firefox.png b/test/visual/screens/vaadin-form-layout/css-properties-lumo/20em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/css-properties-lumo/default/chrome.png b/test/visual/screens/vaadin-form-layout/css-properties-lumo/default/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/css-properties-lumo/default/firefox.png b/test/visual/screens/vaadin-form-layout/css-properties-lumo/default/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/css-properties-material/10em/chrome.png b/test/visual/screens/vaadin-form-layout/css-properties-material/10em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/css-properties-material/10em/firefox.png b/test/visual/screens/vaadin-form-layout/css-properties-material/10em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/css-properties-material/20em/chrome.png b/test/visual/screens/vaadin-form-layout/css-properties-material/20em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/css-properties-material/20em/firefox.png b/test/visual/screens/vaadin-form-layout/css-properties-material/20em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/css-properties-material/default/chrome.png b/test/visual/screens/vaadin-form-layout/css-properties-material/default/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/css-properties-material/default/firefox.png b/test/visual/screens/vaadin-form-layout/css-properties-material/default/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/css-properties/10em/chrome.png b/test/visual/screens/vaadin-form-layout/css-properties/10em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/css-properties/10em/firefox.png b/test/visual/screens/vaadin-form-layout/css-properties/10em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/css-properties/20em/chrome.png b/test/visual/screens/vaadin-form-layout/css-properties/20em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/css-properties/20em/firefox.png b/test/visual/screens/vaadin-form-layout/css-properties/20em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/css-properties/default/chrome.png b/test/visual/screens/vaadin-form-layout/css-properties/default/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/css-properties/default/firefox.png b/test/visual/screens/vaadin-form-layout/css-properties/default/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/responsive-steps-lumo/10em/chrome.png b/test/visual/screens/vaadin-form-layout/responsive-steps-lumo/10em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/responsive-steps-lumo/10em/firefox.png b/test/visual/screens/vaadin-form-layout/responsive-steps-lumo/10em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/responsive-steps-lumo/20em/chrome.png b/test/visual/screens/vaadin-form-layout/responsive-steps-lumo/20em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/responsive-steps-lumo/20em/firefox.png b/test/visual/screens/vaadin-form-layout/responsive-steps-lumo/20em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/responsive-steps-lumo/default/chrome.png b/test/visual/screens/vaadin-form-layout/responsive-steps-lumo/default/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/responsive-steps-lumo/default/firefox.png b/test/visual/screens/vaadin-form-layout/responsive-steps-lumo/default/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/responsive-steps-material/10em/chrome.png b/test/visual/screens/vaadin-form-layout/responsive-steps-material/10em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/responsive-steps-material/10em/firefox.png b/test/visual/screens/vaadin-form-layout/responsive-steps-material/10em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/responsive-steps-material/20em/chrome.png b/test/visual/screens/vaadin-form-layout/responsive-steps-material/20em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/responsive-steps-material/20em/firefox.png b/test/visual/screens/vaadin-form-layout/responsive-steps-material/20em/firefox.png
diff --git a/.../visual/screens/vaadin-form-layout/responsive-steps-material/default/chrome.png b/.../visual/screens/vaadin-form-layout/responsive-steps-material/default/chrome.png
diff --git a/...visual/screens/vaadin-form-layout/responsive-steps-material/default/firefox.png b/...visual/screens/vaadin-form-layout/responsive-steps-material/default/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/responsive-steps/10em/chrome.png b/test/visual/screens/vaadin-form-layout/responsive-steps/10em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/responsive-steps/10em/firefox.png b/test/visual/screens/vaadin-form-layout/responsive-steps/10em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/responsive-steps/20em/chrome.png b/test/visual/screens/vaadin-form-layout/responsive-steps/20em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/responsive-steps/20em/firefox.png b/test/visual/screens/vaadin-form-layout/responsive-steps/20em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/responsive-steps/default/chrome.png b/test/visual/screens/vaadin-form-layout/responsive-steps/default/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/responsive-steps/default/firefox.png b/test/visual/screens/vaadin-form-layout/responsive-steps/default/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/single-column-lumo/10em/chrome.png b/test/visual/screens/vaadin-form-layout/single-column-lumo/10em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/single-column-lumo/10em/firefox.png b/test/visual/screens/vaadin-form-layout/single-column-lumo/10em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/single-column-lumo/20em/chrome.png b/test/visual/screens/vaadin-form-layout/single-column-lumo/20em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/single-column-lumo/20em/firefox.png b/test/visual/screens/vaadin-form-layout/single-column-lumo/20em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/single-column-lumo/default/chrome.png b/test/visual/screens/vaadin-form-layout/single-column-lumo/default/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/single-column-lumo/default/firefox.png b/test/visual/screens/vaadin-form-layout/single-column-lumo/default/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/single-column-material/10em/chrome.png b/test/visual/screens/vaadin-form-layout/single-column-material/10em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/single-column-material/10em/firefox.png b/test/visual/screens/vaadin-form-layout/single-column-material/10em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/single-column-material/20em/chrome.png b/test/visual/screens/vaadin-form-layout/single-column-material/20em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/single-column-material/20em/firefox.png b/test/visual/screens/vaadin-form-layout/single-column-material/20em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/single-column-material/default/chrome.png b/test/visual/screens/vaadin-form-layout/single-column-material/default/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/single-column-material/default/firefox.png b/test/visual/screens/vaadin-form-layout/single-column-material/default/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/single-column/10em/chrome.png b/test/visual/screens/vaadin-form-layout/single-column/10em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/single-column/10em/firefox.png b/test/visual/screens/vaadin-form-layout/single-column/10em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/single-column/20em/chrome.png b/test/visual/screens/vaadin-form-layout/single-column/20em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/single-column/20em/firefox.png b/test/visual/screens/vaadin-form-layout/single-column/20em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/single-column/default/chrome.png b/test/visual/screens/vaadin-form-layout/single-column/default/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/single-column/default/firefox.png b/test/visual/screens/vaadin-form-layout/single-column/default/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/styling-lumo/10em/chrome.png b/test/visual/screens/vaadin-form-layout/styling-lumo/10em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/styling-lumo/10em/firefox.png b/test/visual/screens/vaadin-form-layout/styling-lumo/10em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/styling-lumo/20em/chrome.png b/test/visual/screens/vaadin-form-layout/styling-lumo/20em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/styling-lumo/20em/firefox.png b/test/visual/screens/vaadin-form-layout/styling-lumo/20em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/styling-lumo/default/chrome.png b/test/visual/screens/vaadin-form-layout/styling-lumo/default/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/styling-lumo/default/firefox.png b/test/visual/screens/vaadin-form-layout/styling-lumo/default/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/styling-material/10em/chrome.png b/test/visual/screens/vaadin-form-layout/styling-material/10em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/styling-material/10em/firefox.png b/test/visual/screens/vaadin-form-layout/styling-material/10em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/styling-material/20em/chrome.png b/test/visual/screens/vaadin-form-layout/styling-material/20em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/styling-material/20em/firefox.png b/test/visual/screens/vaadin-form-layout/styling-material/20em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/styling-material/default/chrome.png b/test/visual/screens/vaadin-form-layout/styling-material/default/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/styling-material/default/firefox.png b/test/visual/screens/vaadin-form-layout/styling-material/default/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/styling/10em/chrome.png b/test/visual/screens/vaadin-form-layout/styling/10em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/styling/10em/firefox.png b/test/visual/screens/vaadin-form-layout/styling/10em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/styling/20em/chrome.png b/test/visual/screens/vaadin-form-layout/styling/20em/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/styling/20em/firefox.png b/test/visual/screens/vaadin-form-layout/styling/20em/firefox.png
diff --git a/test/visual/screens/vaadin-form-layout/styling/default/chrome.png b/test/visual/screens/vaadin-form-layout/styling/default/chrome.png
diff --git a/test/visual/screens/vaadin-form-layout/styling/default/firefox.png b/test/visual/screens/vaadin-form-layout/styling/default/firefox.png
diff --git a/test/visual/single-column.html b/test/visual/single-column.html
@@ -5,8 +5,11 @@
   <title></title>
   <script src="../../../webcomponentsjs/webcomponents-lite.js"></script>
   <link rel="import" href="../../../polymer/polymer-element.html">
-  <link rel="import" href="../../vaadin-form-layout.html">
-  <link rel="import" href="../../vaadin-form-item.html">
+  <script>
+    const theme = window.location.search.replace(/.*theme=(\w+).*/, '$1') || 'lumo';
+    document.write(`<link rel="import" href="../../theme/${theme}/form-layout.html">`);
+    document.write(`<link rel="import" href="../../theme/${theme}/vaadin-form-item.html">`);
+  </script>
   <script>
     window.addEventListener('WebComponentsReady', function() {
       setTimeout(function() {

diff --git a/test/visual/styling.html b/test/visual/styling.html
@@ -5,8 +5,11 @@
   <title></title>
   <script src="../../../webcomponentsjs/webcomponents-lite.js"></script>
   <link rel="import" href="../../../polymer/polymer-element.html">
-  <link rel="import" href="../../vaadin-form-layout.html">
-  <link rel="import" href="../../vaadin-form-item.html">
+  <script>
+    const theme = window.location.search.replace(/.*theme=(\w+).*/, '$1') || 'lumo';
+    document.write(`<link rel="import" href="../../theme/${theme}/form-layout.html">`);
+    document.write(`<link rel="import" href="../../theme/${theme}/vaadin-form-item.html">`);
+  </script>
   <script>
     window.addEventListener('WebComponentsReady', function() {
       setTimeout(function() {

diff --git a/test/visual/test.js b/test/visual/test.js
@@ -35,23 +35,24 @@ gemini.suite('vaadin-form-layout', function(rootSuite) {
   rootSuite
     .before(wait)
     .after(goToAboutBlank);
-
-  [
-    'basic',
-    'single-column',
-    'responsive-steps',
-    'colspan',
-    'br',
-    'css-properties',
-    'styling'
-  ].forEach(testName => {
-    gemini.suite(testName, function(suite) {
-      suite
-        .setUrl(`${testName}.html`)
-        .setCaptureElements('#capture')
-        .capture('default')
-        .capture('20em', setBodyWidth('20em'))
-        .capture('10em', setBodyWidth('10em'));
+  ['lumo', 'material'].forEach(theme => {
+    [
+      'basic',
+      'single-column',
+      'responsive-steps',
+      'colspan',
+      'br',
+      'css-properties',
+      'styling'
+    ].forEach(testName => {
+      gemini.suite(`${testName}-${theme}`, function(suite) {
+        suite
+          .setUrl(`${testName}.html?theme=${theme}`)
+          .setCaptureElements('#capture')
+          .capture('default')
+          .capture('20em', setBodyWidth('20em'))
+          .capture('10em', setBodyWidth('10em'));
+      });
     });
   });
 });