From 59b1556ebd47f67303454a4b249fa63df41429dd Mon Sep 17 00:00:00 2001
From: Michael Ball <michael@mball.co>
Date: Thu, 15 Aug 2024 01:04:34 -0700
Subject: [PATCH] fix spec helper

---
 _includes/head_custom.html | 26 +++++++++++++++++++++++---
 spec/spec_helper.rb        |  2 +-
 2 files changed, 24 insertions(+), 4 deletions(-)

diff --git a/_includes/head_custom.html b/_includes/head_custom.html
index 2e7aafa..5f734bf 100644
--- a/_includes/head_custom.html
+++ b/_includes/head_custom.html
@@ -5,21 +5,41 @@
   <link href="{{ site.baseurl }}/assets/vendor/fontawesome/css/solid.css" rel="stylesheet" />
   <!-- <link href="{{ site.baseurl }}/assets/vendor/fontawesome/css/brands.css" rel="stylesheet" /> -->
 
+<!-- TODO: Contribute to JtD. Needs a better location. -->
 <script>
   document.addEventListener("DOMContentLoaded", function() {
-    if (jtd && localStorage['jtd-theme']) {
+    if (!jtd) { return; }
+
+    // If the browser suggests a color scheme, and user hasn't saved/switch one yet..
+    if (window.matchMedia && !localStorage['jtd-theme']) {
+      if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
+        jtd.setTheme('dark');
+      } else if (window.matchMedia('(prefers-color-scheme: light)').matches) {
+        jtd.setTheme('light');
+      }
+    } else if (localStorage['jtd-theme']) {
       jtd.setTheme(localStorage['jtd-theme']);
     }
 
-    const toggleDarkMode = document.querySelector('.js-toggle-dark-mode');
-    jtd.addEvent(toggleDarkMode, 'click', function() {
+    const toggleSchemeBtn = document.querySelector('.js-toggle-dark-mode');
+    jtd.addEvent(toggleSchemeBtn, 'click', function() {
       if (jtd.getTheme() === 'dark') {
         localStorage['jtd-theme'] = 'light';
         jtd.setTheme('light');
+        toggleSchemeBtn.textContent = '🌙 Dark Mode';
+        toggleSchemeBtn.ariaLabel = 'Switch to Dark Mode';
       } else {
         jtd.setTheme('dark');
         localStorage['jtd-theme'] = 'dark';
+        toggleSchemeBtn.textContent = '🔆 Light Mode';
+        toggleSchemeBtn.ariaLabel = 'Switch to Light Mode';
       }
     });
+
+    const unsetColorScheme = document.querySelector('.js-unset-color-scheme');
+    jtd.addEvent(unsetColorScheme, 'click', function() {
+      delete localStorage['jtd-theme'];
+      jtd.setTheme('default');
+    });
   });
 </script>
diff --git a/spec/spec_helper.rb b/spec/spec_helper.rb
index 8cd31a4..f7c94ab 100644
--- a/spec/spec_helper.rb
+++ b/spec/spec_helper.rb
@@ -57,7 +57,7 @@
 end
 
 Capybara::Screenshot.register_filename_prefix_formatter(:rspec) do |example|
-  example.example_group.top_level_description.gsub(%r{^/}, '').gsub('/', '-').gsub(' is accessible', '')
+  page = example.example_group.top_level_description.gsub(%r{^/}, '').gsub('/', '-').gsub(' is accessible', '')
   standards = example.description.split.last
   "tmp/capybara/screenshot_#{page}_#{standards}"
 end