Fix theme color mode switching when highlight.js is disabled

docs/about/release-notes.md

@@ -30,6 +30,7 @@ The current members of the MkDocs-NG team.
 * Fix anchor link validation so `mkdocs build -v --strict` still fails when missing anchors are reported as warnings. #30
 * Fix `validation.links.not_found` is always reported as INFO for excluded pages. #32
 * Fix `mkdocs serve` cleanup so temporary site directories are removed when the process receives `SIGTERM`. #36
+* Fix mkdocs theme color mode switching when `highlightjs` is disabled. #39
 
 ### Maintenance
 

mkdocs/tests/theme_tests.py

@@ -1,4 +1,6 @@
 import os
+import shutil
+import subprocess
 import unittest
 from unittest import mock
 
@@ -125,3 +127,28 @@ def test_empty_config_file(self):
                     "locale": parse_locale("en"),
                 },
             )
+
+    @unittest.skipUnless(shutil.which("node"), "node is not installed")
+    def test_darkmode_without_highlightjs_stylesheets(self):
+        darkmode_js = os.path.join(theme_dir, "mkdocs", "js", "darkmode.js")
+        script = f"""
+            global.localStorage = {{ getItem: () => null, setItem: () => {{}} }};
+            global.window = {{
+                matchMedia: () => ({{
+                    matches: false,
+                    addEventListener: () => {{}},
+                    removeEventListener: () => {{}},
+                }}),
+            }};
+            global.document = {{
+                documentElement: {{
+                    getAttribute: () => 'light',
+                    setAttribute: () => {{}},
+                }},
+                getElementById: () => null,
+                querySelectorAll: () => [],
+            }};
+            require({darkmode_js!r});
+        """
+
+        subprocess.run(["node", "-e", script], check=True)

mkdocs/themes/mkdocs/js/darkmode.js

@@ -3,12 +3,14 @@ function setColorMode(mode) {
     var hljs_light = document.getElementById('hljs-light'),
         hljs_dark = document.getElementById('hljs-dark');
     document.documentElement.setAttribute('data-bs-theme', mode);
-    if (mode == 'dark') {
-        hljs_light.disabled = true;
-        hljs_dark.disabled = false;
-    } else {
-        hljs_dark.disabled = true;
-        hljs_light.disabled = false;
+    if (hljs_light && hljs_dark) {
+        if (mode == 'dark') {
+            hljs_light.disabled = true;
+            hljs_dark.disabled = false;
+        } else {
+            hljs_dark.disabled = true;
+            hljs_light.disabled = false;
+        }
     }
 }