Merge pull request #226 from aws/dogusata/dont-linkify-pure-text-link…

…s-in-markdown

added link rendering handler to markedjs

package.json

@@ -1,7 +1,7 @@
 {
     "name": "@aws/mynah-ui",
     "displayName": "AWS Mynah UI",
-    "version": "4.21.5",
+    "version": "4.21.6",
     "description": "AWS Toolkit VSCode and Intellij IDE Extension Mynah UI",
     "publisher": "Amazon Web Services",
     "license": "Apache License 2.0",

src/main.ts

@@ -268,11 +268,18 @@ export class MynahUI {
     // Apply global fix for marked listitem content is not getting parsed.
     marked.use({
       renderer: {
-        listitem: (item: Tokens.ListItem) => `
-<li>
+        listitem: (item: Tokens.ListItem) => `<li>
 ${item.task ? `<input ${item.checked === true ? 'checked' : ''} disabled type="checkbox">` : ''}
 ${(item.task ? marked.parseInline : marked.parse)(item.text, { breaks: false }) as string}
-</li>`
+</li>`,
+        link: (token) => {
+          const pattern = /^\[([^\]]+)\]\(([^)]+)\)$/;
+          // Expect raw formatted only in [TEXT](URL)
+          if (!pattern.test(token.raw)) {
+            return token.href;
+          }
+          return `<a href="${token.href}" target="_blank" title="${token.title ?? token.text}">${token.text}</a>`;
+        }
       },
     });
 

ui-tests/__test__/flows/markdown-parser/markdown-parser.ts

@@ -67,9 +67,9 @@ export const parseMarkdown = async (page: Page, skipScreenshots?: boolean): Prom
   expect(await answerCard.evaluate(node => node.querySelector('ol > li:first-child > input[checked][disabled][type="checkbox"]'))).toBeDefined();
 
   // Anchors and IMG
-  expect(await answerCard.evaluate(node => node.querySelectorAll('a[href="https://github.com/aws/mynah-ui"]').length)).toBe(2);
+  // We're not expecting any link except [TEXT](URL) format, we should have only 1 link.
+  expect(await answerCard.evaluate(node => node.querySelectorAll('a[href="https://github.com/aws/mynah-ui"]').length)).toBe(1);
   expect(await answerCard.evaluate(node => node.querySelectorAll('a[href="https://github.com/aws/mynah-ui"]')[0]?.innerHTML)).toBe('mynah-ui');
-  expect(await answerCard.evaluate(node => node.querySelectorAll('a[href="https://github.com/aws/mynah-ui"]')[1]?.innerHTML)).toBe('https://github.com/aws/mynah-ui');
   expect(await answerCard.evaluate(node => node.querySelector('img[src="https://placehold.co/600x400"]'))).toBeDefined();
 
   // Table