Add theme switcher to visual test app (#1198)

It's been possible for some time to change the theme used by the visual test app. This commit adds a select control to the bottom of each page to make this easier.
rouge-ruby · Jun 19, 2019 · 6fb22a5 · 6fb22a5
1 parent c451a82
commit 6fb22a5
Showing 1 changed file with 24 additions and 5 deletions.
diff --git a/spec/visual/templates/layout.erb b/spec/visual/templates/layout.erb
@@ -44,12 +44,31 @@
 <body>
   <%= yield %>
   <footer id="page-footer">
-    <small>Rendered with theme
-      <strong style="text-transform: capitalize">
-        <%= @theme.class.name.gsub(/_/, ' ') %>
-      </strong>
-    </small>
+    <small>Rendered with theme:</small>
+    <select id="theme-selector" onchange="switchTheme()">
+      <% Rouge::Theme.registry.each_key do |name|
+        %><option value="<%= name %>"<% if @theme.class.name == name %> selected<% end %>><%= name %></option>
+      <% end %>
+    </select>
   </footer>
+
+  <script>
+    function switchTheme() {
+      var x, y, z;
+      x = document.getElementById("theme-selector").value;
+      y = location.href;
+
+      if (y.includes('theme=')) {
+        z = y.replace(/theme=.*/, 'theme=' + x);
+      } else if (y.includes('?')) {
+        z = y + '&theme=' + x;
+      } else {
+        z = y + '?theme=' + x;
+      }
+
+      location.assign(z);
+    }
+  </script>
 </body>
 
 </html>