fix(marked): zero-md component

duncdrum · duncdrum · commit 7dd4494f4e00 · 2025-01-01T12:46:45.000+01:00
drop outdated dep, use modern web component instead
diff --git a/gulpfile.js b/gulpfile.js
@@ -34,7 +34,7 @@ const paths = {
       "node_modules/prismjs/prism.js",
       "node_modules/prismjs/components/prism-xquery.min.js",
       "node_modules/prismjs/components/prism-java.min.js",
-      "node_modules/marked/lib/marked.js"
+      "node_modules/zero-md/dist/index.min.js"
     ],
     styles: [
       "src/main/xar-resources/resources/css/*",
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -27,8 +27,8 @@
   "dependencies": {
     "bootstrap": "^3.4.1",
     "jquery": "^1.12.4",
-    "marked": "^2.1.1",
-    "prismjs": "^1.23.0"
+    "prismjs": "^1.23.0",
+    "zero-md": "^3.1.6"
   },
   "devDependencies": {
     "cypress": "^13.17.0",
diff --git a/src/main/xar-resources/modules/app.xql b/src/main/xar-resources/modules/app.xql
@@ -276,11 +276,12 @@ declare %private function app:print-function($function as element(xqdoc:function
 };
 
 declare %private
-function app:include-markdown ($path as xs:string) as element(div) {
-    element div {
-        attribute class { "markdown" },
-        $path => util:binary-doc() => util:binary-to-string()
-    }
+function app:include-markdown ($path as xs:string) as element(zero-md) {
+    <zero-md src="{ $path }">
+        <template>
+            <link rel="stylesheet" href="resources/css/exist.css" />
+        </template>
+    </zero-md>
 };
 
 declare %private function app:print-parameters($params as element(xqdoc:param)*) {
@@ -310,7 +311,7 @@ declare %private function app:get-extended-doc($function as element(xqdoc:functi
     for $path in $paths
     return
         if (util:binary-doc-available($path)) then
-            $path
+            ('.' || substring-after($path, $config:app-root))
         else
             ()
 };
diff --git a/src/main/xar-resources/resources/scripts/query.js b/src/main/xar-resources/resources/scripts/query.js
@@ -90,26 +90,4 @@ $(document).on("ready", function() {
 
     $("#fun-query-form *[data-toggle='tooltip']").tooltip();
 
-    // replace markdown element content with rendered HTML
-    const mdContentElement = document.querySelector(".markdown")
-
-    if (mdContentElement) {
-        const renderer = {
-            table(header, body) {            
-                if (body) body = `<tbody>${body}</tbody>`
-                return `<table class="table table-bordered">
-                    <thead>
-                    ${header}
-                    </thead>
-                    ${body}
-                    </table>
-                `;
-            }
-        };
-          
-        marked.use({ renderer });
-          
-        const markdown = marked(mdContentElement.textContent, markedOptions)
-        mdContentElement.innerHTML = markdown    
-    }
 });
diff --git a/src/main/xar-resources/templates/page.html b/src/main/xar-resources/templates/page.html
@@ -9,6 +9,7 @@
         <link rel="stylesheet" type="text/css" href="resources/css/prism-fundocs.css"/>
         <link rel="stylesheet" type="text/css" href="resources/css/exist.css"/>
         <link rel="stylesheet" type="text/css" href="resources/css/fundocs.css"/>
+        <script type="module" src="resources/scripts/index.min.js?register"/>
     </head>
     <body id="grey-top" data-template="lib:parse-params" data-template-start="\{">
         <div class="grey-bot">
@@ -212,7 +213,6 @@ <h3>Login</h3>
         </div>
         <script type="text/javascript" src="resources/scripts/jquery.min.js"></script>
         <script type="text/javascript" src="resources/scripts/bootstrap.min.js"></script>
-        <script type="text/javascript" src="resources/scripts/marked.js"></script>
         <script type="text/javascript" src="resources/scripts/prism.js"></script>
         <script type="text/javascript" src="resources/scripts/prism-java.min.js"></script>
         <script type="text/javascript" src="resources/scripts/prism-xquery.min.js"></script>
diff --git a/src/test/cypress/integration/fundoc_spec.js b/src/test/cypress/integration/fundoc_spec.js
@@ -11,5 +11,20 @@ context('Function Documentation', () => {
       cy.get('h1')
         .contains('Function Documentation')
     })
+  })
+
+  describe('simple search', () => {
+    it('should find article with extended markdown contents', () => {
+      cy.get('#query-field')
+        .type('file:sync')
+      cy.get('.function-head > h4')
+        .should('exist')
+        .click()
+      cy.get('.extended-docs')
+        .should('exist')
+        .click()
+      cy.get('zero-md')
+        .should('exist')
+    })
   })  
 })
