fix: Percent-encode Markdown reserved symbols in URLs (#26)

Encode symbols in URLS which break some MD renderers, like in Discord embeds, where URLs containing these symbols sometimes break.
crosstype · Oct 24, 2021 · 83d4fff · 83d4fff
1 parent 43c3c2d
commit 83d4fff
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 4 deletions.
diff --git a/src/config.ts b/src/config.ts
@@ -187,19 +187,40 @@ export const defaultTranslators: TranslatorConfigObject = {
     const href = node.getAttribute('href');
     if (!href) return {};
 
+    // Encodes symbols that can cause problems in markdown
+    let encodedHref = '';
+    for (const chr of href) {
+      switch (chr) {
+        case '(':
+          encodedHref += '%28';
+          break;
+        case ')':
+          encodedHref += '%29';
+          break;
+        case '_':
+          encodedHref += '%5F';
+          break;
+        case '*':
+          encodedHref += '%2A';
+          break;
+        default:
+          encodedHref += chr;
+      }
+    }
+
     const title = node.getAttribute('title');
 
     // Inline link, when possible
     // See: https://github.com/crosstype/node-html-markdown/issues/17
-    if (node.textContent === href) return { content: `<${href}>` };
+    if (node.textContent === href) return { content: `<${encodedHref}>` };
 
     return {
       postprocess: ({ content }) => content.replace(/(?:\r?\n)+/g, ' '),
       childTranslators: visitor.instance.aTagTranslators,
       prefix: '[',
       postfix: ']' + (!options.useLinkReferenceDefinitions
-               ? `(${href}${title ? ` "${title}"` : ''})`
-               : `[${visitor.addOrGetUrlDefinition(href)}]`)
+               ? `(${encodedHref}${title ? ` "${title}"` : ''})`
+               : `[${visitor.addOrGetUrlDefinition(encodedHref)}]`)
     }
   },
 

diff --git a/test/default-tags.test.ts b/test/default-tags.test.ts
@@ -44,14 +44,17 @@ describe(`Default Tags`, () => {
 
   test(`Link (a)`, () => {
     const url = 'http://www.github.com/crosstype';
+    const specialUrl = 'http://www.github.com/crosstype/**/_test(123)';
+    const encodedSpecialUrl = 'http://www.github.com/crosstype/%2A%2A/%5Ftest%28123%29';
     const res = translate(`
         <a href="${url}">a<br><br>b<strong>c</strong></a>
         <a>a<strong>b</strong></a> <!-- This node is treated as text due to no href -->
         <a href="${url}">${url}</a>
         <!-- see: https://github.com/crosstype/node-html-markdown/issues/25 -->
         <a href="${url}">a<a href="2">nested</a><img src="${url}">b</a>
+        <b><i><a href="${specialUrl}" title="a">b</a></i></b>
     `);
-    expect(res).toBe(`[a b**c**](${url}) a**b** <${url}> [a](${url})[nested](2)![](${url})b `);
+    expect(res).toBe(`[a b**c**](${url}) a**b** <${url}> [a](${url})[nested](2)![](${url})b **_[b](${encodedSpecialUrl} "a")_** `);
   });
 
   test(`Image (img)`, () => {