demo: fix lexer guessing based on filename

3 files changed, 11 insertions, 15 deletions

diff --git a/doc/_static/demo-worker.js b/doc/_static/demo-worker.js
index 946c7f7d..efb8b123 100644
--- a/doc/_static/demo-worker.js
+++ b/doc/_static/demo-worker.js
@@ -30,6 +30,7 @@ self.onmessage = async (event) => {
         self.postMessage({html});
     } else if (event.data.guess_lexer) {
         self.pyodide.globals['code'] = event.data.guess_lexer.code;
+        self.pyodide.globals['filename'] = event.data.guess_lexer.filename;
         const lexer = self.pyodide.runPython(`
             import sys
             sys.setrecursionlimit(1000)
@@ -41,7 +42,11 @@ self.onmessage = async (event) => {
             if type(code) == memoryview:
                 code = bytes(code)
 
-            pygments.lexers.guess_lexer(code).aliases[0]
+            if filename:
+                lexer = pygments.lexers.guess_lexer_for_filename(filename, code)
+            else:
+                lexer = pygments.lexers.guess_lexer(code)
+            lexer.aliases[0]
         `);
         self.postMessage({lexer});
     } else {
diff --git a/doc/_static/demo.js b/doc/_static/demo.js
index 279c3820..9e226a22 100644
--- a/doc/_static/demo.js
+++ b/doc/_static/demo.js
@@ -49,18 +49,6 @@ highlightWorker.onmessage = async (msg) => {
     }
 };
 
-function new_file() {
-    pyodide.globals.fname = document.getElementById("file").files[0].name;
-    var alias = pyodide.runPython('pygments.lexers.find_lexer_class_for_filename(fname).aliases[0]');
-    var sel = document.getElementById("lang");
-    for (var i = 0; i < sel.length; i++) {
-        if (sel.options[i].value == alias) {
-            sel.selectedIndex = i;
-            break;
-        }
-    }
-}
-
 async function highlight(guessedLexer) {
     var lexer = langSelect.value || guessedLexer;
     var file = document.getElementById("file").files[0];
@@ -77,7 +65,10 @@ async function highlight(guessedLexer) {
     loadingDiv.hidden = false;
 
     if (!lexer) {
-        highlightWorker.postMessage({guess_lexer: {code}});
+        const guess_lexer = {code};
+        if (file)
+            guess_lexer.filename = file.name;
+        highlightWorker.postMessage({guess_lexer});
         document.getElementById('loading-text').textContent = 'guessing lexer...';
         return;
     }
diff --git a/doc/_templates/demo.html b/doc/_templates/demo.html
index 9190aeec..f37784c4 100644
--- a/doc/_templates/demo.html
+++ b/doc/_templates/demo.html
@@ -33,7 +33,7 @@
         </p>
         <p>
             <label>Upload a file here:
-                <input type="file" id="file" onchange="new_file()"> or enter code below:
+                <input type="file" id="file"> or enter code below:
             </label>
         </p>
 	    <p>