chore: add more test coverage (#88)

deno.json

@@ -2,7 +2,7 @@
   "tasks": {
     "build": "deno run --allow-read --allow-write --allow-net --allow-run --allow-env ./style/patch.ts && deno fmt",
     "check:types": "deno check **/*.ts",
-    "coverage": "deno test --allow-read --coverage=cov_profile",
+    "coverage": "rm -rf cov_profile && deno test --allow-read --coverage=cov_profile",
     "dev": "deno run -A --unstable --watch --no-check ./example/main.ts",
     "ok": "deno fmt --check && deno lint && deno task check:types && deno task test",
     "report": "deno coverage cov_profile --html",

deps.ts

@@ -21,4 +21,4 @@ export { default as sanitizeHtml } from "https://esm.sh/[email protected]?tar
 
 export { escape as htmlEscape } from "https://esm.sh/[email protected]?pin=v135";
 
-export { default as katex } from "https://esm.sh/[email protected]/dist/katex.mjs?pin=v135";
+export { default as katex } from "https://esm.sh/[email protected]?pin=v135";

mod.ts

@@ -36,8 +36,8 @@ export class Renderer extends Marked.Renderer {
     return `<h${level} id="${slug}"><a class="anchor" aria-hidden="true" tabindex="-1" href="#${slug}"><svg class="octicon octicon-link" viewBox="0 0 16 16" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z"></path></svg></a>${text}</h${level}>`;
   }
 
-  image(src: string, title: string | null, alt: string | null) {
-    return `<img src="${src}" alt="${alt ?? ""}" title="${title ?? ""}" />`;
+  image(src: string, title: string | null, alt: string) {
+    return `<img src="${src}" alt="${alt}" title="${title ?? ""}" />`;
   }
 
   code(code: string, language?: string) {
@@ -246,7 +246,7 @@ export function render(markdown: string, opts: RenderOptions = {}): string {
     allowedTags,
     allowedAttributes: {
       ...sanitizeHtml.defaults.allowedAttributes,
-      img: ["src", "alt", "height", "width", "align"],
+      img: ["src", "alt", "height", "width", "align", "title"],
       video: [
         "src",
         "alt",
@@ -258,8 +258,9 @@ export function render(markdown: string, opts: RenderOptions = {}): string {
         "playsinline",
         "poster",
         "controls",
+        "title",
       ],
-      a: ["id", "aria-hidden", "href", "tabindex", "rel", "target"],
+      a: ["id", "aria-hidden", "href", "tabindex", "rel", "target", "title"],
       svg: ["viewbox", "width", "height", "aria-hidden", "background"],
       path: ["fill-rule", "d"],
       circle: ["cx", "cy", "r", "stroke", "stroke-width", "fill", "alpha"],

test/test.ts

@@ -1,4 +1,7 @@
-import { assertEquals } from "https://deno.land/[email protected]/assert/assert_equals.ts";
+import {
+  assertEquals,
+  assertStringIncludes,
+} from "https://deno.land/[email protected]/assert/mod.ts";
 import { DOMParser } from "https://deno.land/x/[email protected]/deno-dom-wasm.ts";
 import { render, Renderer } from "../mod.ts";
 
@@ -232,3 +235,55 @@ Deno.test(
     assertEquals(html, expected.trim());
   },
 );
+
+Deno.test("image title and no alt", () => {
+  const markdown = `![](image.jpg "best title")`;
+  const expected = `<p><img src="image.jpg" title="best title" /></p>\n`;
+
+  const html = render(markdown);
+  assertEquals(html, expected);
+});
+
+Deno.test("js language", () => {
+  const markdown = "```js\nconst foo = 'bar';\n```";
+  const expected =
+    `<div class="highlight highlight-source-js notranslate"><pre><span class="token keyword">const</span> foo <span class="token operator">=</span> <span class="token string">'bar'</span><span class="token punctuation">;</span></pre></div>`;
+
+  const html = render(markdown);
+  assertEquals(html, expected);
+});
+
+Deno.test("link with title", () => {
+  const markdown = `[link](https://example.com "asdf")`;
+  const expected =
+    `<p><a href="https://example.com" title="asdf" rel="noopener noreferrer">link</a></p>\n`;
+  const html = render(markdown);
+  assertEquals(html, expected);
+});
+
+Deno.test("expect console warning from invalid math", () => {
+  const originalWarn = console.warn;
+  const warnCalls: string[] = [];
+  console.warn = (...args) => {
+    warnCalls.push(args[0].message);
+  };
+
+  const html = render("$$ +& $$", { allowMath: true });
+  const expected =
+    `<p>$$ +&amp; <span class="katex"><span class="katex-mathml"><math xmlns="http://www.w3.org/1998/Math/MathML"><semantics><mrow></mrow><annotation encoding="application/x-tex"></annotation></semantics></math></span><span class="katex-html" aria-hidden="true"></span></span></p>\n`;
+  assertEquals(html, expected);
+  assertStringIncludes(
+    warnCalls[0],
+    "KaTeX parse error: Expected 'EOF', got '&' at position 2: +&̲",
+  );
+
+  const html2 = render(" $&$", { allowMath: true });
+  const expected2 = `<p> $&amp;$</p>\n`;
+  assertEquals(html2, expected2);
+  assertStringIncludes(
+    warnCalls[1],
+    "KaTeX parse error: Expected 'EOF', got '&' at position 1: &̲",
+  );
+
+  console.warn = originalWarn;
+});