Allow passing a preamble.sty for MathJax

src/@types/index.d.ts

@@ -30,6 +30,7 @@ export interface SlidesExtendedSettings {
     paneMode: "split" | "tab" | "sidebar";
     themeDirectory: string;
     center: boolean;
+    preamblePath: string;
 }
 
 export type ChartJsOptions = {
@@ -67,6 +68,7 @@ export type Options = {
     width: number;
     enableCustomControls: boolean;
     transition: string;
+    preamble: string;
     // biome-ignore lint/suspicious/noExplicitAny: minimal adaptation to Chart.js types
     [key: string]: any;
 };

src/obsidian/obsidianUtils.ts

@@ -186,6 +186,23 @@ export class ObsidianUtils implements MediaCollector {
         return this.settings;
     }
 
+    async getPreamble(): Promise<string> {
+        if (!this.settings.preamblePath) {
+            return "";
+        }
+        try {
+            const preamble = await this.app.vault.adapter.read(
+                this.settings.preamblePath,
+            );
+            return preamble;
+        } catch (_e) {
+            console.warn(
+                `Slides Extended: Preamble file not found at '${this.settings.preamblePath}'. Ignoring.`,
+            );
+            return "";
+        }
+    }
+
     private getTFile(filename: string): TFile | null {
         if (filename.startsWith("[[") && filename.endsWith("]]")) {
             filename = filename.substring(2, filename.length - 2).trim();
@@ -243,6 +260,10 @@ export class ObsidianUtils implements MediaCollector {
         return file;
     }
 
+    getExportDirectory(override?: string): string {
+        return override ?? this.exportDir;
+    }
+
     getAbsolutePath(relativePath: string): string {
         const markdownFile = this.getTFile(relativePath);
         return this.absolute(markdownFile?.path);

src/plugin/load-mathjax.js

@@ -29,8 +29,37 @@ window.MathJax = {
     },
     startup: {
         ready: () => {
+            const preamblePath = window.mathJaxPreamblePath;
+            const preamblePromise =
+                preamblePath &&
+                preamblePath.trim().length > 0 &&
+                preamblePath.trim() !== "undefined"
+                    ? fetch(preamblePath)
+                          .then((response) => {
+                              if (!response.ok) {
+                                  throw new Error(
+                                      `Failed to load preamble file: ${response.statusText}`,
+                                  );
+                              }
+                              return response.text();
+                          })
+                          .catch((err) => {
+                              console.error(
+                                  `Slides Extended: Could not load preamble file at '${preamblePath}'.`,
+                                  err,
+                              );
+                              return ""; // Resolve with empty string on failure
+                          })
+                    : Promise.resolve("");
+
             MathJax.startup.defaultReady();
-            MathJax.startup.promise.then(() => {
+            MathJax.startup.promise.then(async () => {
+                const preamble = await preamblePromise;
+                if (preamble && preamble.trim().length > 0) {
+                    // Process the preamble. This makes definitions available globally.
+                    MathJax.tex2chtml(preamble);
+                }
+
                 console.debug("MathJax initialized and ready");
                 mathJaxReady = true;
 

src/slidesExtended-SettingTab.ts

@@ -259,6 +259,22 @@ export class SlidesExtendedSettingTab extends PluginSettingTab {
                     });
             });
 
+        containerEl.createEl("h2", { text: "MathJax" });
+
+        new Setting(containerEl)
+            .setName("Preamble path")
+            .setDesc(
+                "Path to MathJax preamble file. This file will be included in your slides. (Requires reload!)",
+            )
+            .addText((text) =>
+                text
+                    .setPlaceholder("preamble.sty")
+                    .setValue(this.newSettings.preamblePath)
+                    .onChange((value) => {
+                        this.newSettings.preamblePath = value;
+                    }),
+            );
+
         containerEl.createEl("h2", { text: "Plugins" });
 
         new Setting(containerEl)

src/slidesExtended-constants.ts

@@ -28,10 +28,12 @@ export const DEFAULT_SETTINGS: SlidesExtendedSettings = {
     paneMode: "split",
     themeDirectory: "",
     center: true,
+    preamblePath: "preamble.sty",
 };
 export const DEFAULTS: Options = {
     bg: "",
     center: true,
+    preamble: "",
     css: "",
     defaultTemplate: "",
     enableCustomControls: true,

src/template/embed.html

@@ -19,7 +19,19 @@
     {{/remoteCSSPaths}}
 
     <script defer src="{{{base}}}dist/fontawesome/all.min.js"></script>
-    <script defer src="{{{base}}}plugin/load-mathjax.js"></script>
+    {{#preamblePath}}
+    <script>
+        window.mathJaxPreamblePath = '{{{preamblePath}}}';
+    </script>
+    {{/preamblePath}}
+    <script>
+        (function() {
+            const script = document.createElement('script');
+            script.defer = true;
+            script.src = `{{{base}}}plugin/load-mathjax.js?v=${new Date().getTime()}`;
+            document.head.appendChild(script);
+        })();
+    </script>
 
     <script type="text/javascript">
 
@@ -157,4 +169,4 @@
     <!-- created with {{! ignore me }}Slides Extended embed.html template -->
 </body>
 
-</html>
+</html>

src/template/reveal.html

@@ -29,7 +29,19 @@
     {{/remoteCSSPaths}}
 
     <script defer src="{{{base}}}dist/fontawesome/all.min.js"></script>
-    <script defer src="{{{base}}}plugin/load-mathjax.js"></script>
+    {{#preamblePath}}
+    <script>
+        window.mathJaxPreamblePath = '{{{preamblePath}}}';
+    </script>
+    {{/preamblePath}}
+    <script>
+        (function() {
+            const script = document.createElement('script');
+            script.defer = true;
+            script.src = `{{{base}}}plugin/load-mathjax.js?v=${new Date().getTime()}`;
+            document.head.appendChild(script);
+        })();
+    </script>
 
     <script type="text/javascript">
         function pageInIframe() {
@@ -264,4 +276,4 @@
     </script>
     <!-- created with {{! ignore me }}Slides Extended reveal.html template -->
 </body>
-</html>
+</html>

test/buildValidation.unit.test.ts

@@ -30,10 +30,14 @@ describe("Build Validation", () => {
                 for (const match of matches) {
                     const path = match[1];
 
-                    it(`should have ${path} in build output`, () => {
-                        const fullPath = join(BUILD_DIR, path);
-                        expect(existsSync(fullPath)).toBe(true);
-                    });
+                    // The load-mathjax.js script is now loaded dynamically with a cache-busting
+                    // timestamp, so we can't statically verify its path.
+                    if (!path.startsWith("plugin/load-mathjax.js")) {
+                        it(`should have ${path} in build output`, () => {
+                            const fullPath = join(BUILD_DIR, path);
+                            expect(existsSync(fullPath)).toBe(true);
+                        });
+                    }
                 }
             });
         }