diff --git a/webapp/src/lib/components/MarkdownRenderer.test.ts b/webapp/src/lib/components/MarkdownRenderer.test.ts
index ea0a6bb..c692e56 100644
--- a/webapp/src/lib/components/MarkdownRenderer.test.ts
+++ b/webapp/src/lib/components/MarkdownRenderer.test.ts
@@ -5,20 +5,72 @@ import MarkdownRenderer from './MarkdownRenderer.svelte';
const TEST_FILES_DIR = 'test/markdown/';
-describe('Callout rendering', () => {
- it('Renders callout correctly ', async () => {
- const plaintext = await readMd('callout.md');
+// rendering links
+describe('rendering [[internal]] links', async () => {
+ const plaintext = await readMd('links.md');
+ it('Renders [[links]] correctly', async () => {
render(MarkdownRenderer, { plaintext: plaintext });
+ const linkEl = await screen.findByText(/^Normal internal link$/);
+ expect(linkEl).toBeInTheDocument();
+ });
- // Expect title to be correct.
+ it('Renders [[links|with alias]] correctly', async () => {
+ render(MarkdownRenderer, { plaintext: plaintext });
+ const linkEl = await screen.findByText(/^Link with alias$/);
+ expect(linkEl).toBeInTheDocument();
+ });
+
+ it('Renders [[links#heading]] correctly', async () => {
+ render(MarkdownRenderer, { plaintext: plaintext });
+ const linkEl = await screen.findByText(/^Page with headings > heading A$/);
+ expect(linkEl).toBeInTheDocument();
+ });
+
+ it('Renders [[links#heading|with alias]] correctly', async () => {
+ render(MarkdownRenderer, { plaintext: plaintext });
+ const linkEl = await screen.findByText(/^Link with heading alias$/);
+ expect(linkEl).toBeInTheDocument();
+ });
+
+ it('Renders [[links#heading|with alias#fakeheading]] correctly', async () => {
+ render(MarkdownRenderer, { plaintext: plaintext });
+ const linkEl = await screen.findByText(/^Link with heading alias#false heading$/);
+ expect(linkEl).toBeInTheDocument();
+ });
+
+ it('Does not render [[]] empty links', async () => {
+ render(MarkdownRenderer, { plaintext: plaintext });
+ const textEl = await screen.findByText('[[]]', { exact: false });
+ expect(textEl).toBeInTheDocument();
+ });
+});
+
+describe('rendering [md style](links)', async () => {
+ const plaintext = await readMd('links.md');
+
+ it('Renders URL-encoded internal links correctly', async () => {
+ render(MarkdownRenderer, { plaintext: plaintext });
+ const linkEl = await screen.findByText(/^Classic internal link (URL encoded)$/);
+ expect(linkEl).toBeInTheDocument();
+ });
+});
+
+describe('Rendering callouts', async () => {
+ const plaintext = await readMd('callout.md');
+
+ it('Renders callout title correctly ', async () => {
+ render(MarkdownRenderer, { plaintext: plaintext });
const titleEl = await screen.findByText('Don!t forget to account for non-letters! //fsd \\n');
expect(titleEl).toBeInTheDocument();
expect(titleEl).toHaveClass('callout-title');
+ });
- // Expect content to be correct.
- expect(await screen.findByText('Sample text.')).toBeInTheDocument();
- expect((await screen.findByText('Sample text.')).parentNode).toHaveClass('callout-content');
+ it('Renders callout content correctly ', async () => {
+ render(MarkdownRenderer, { plaintext: plaintext });
+ const contentEl = await screen.findByText('Sample text.');
+ expect(contentEl).toBeInTheDocument();
+ expect(contentEl.parentElement).toHaveClass('callout-content');
});
});
diff --git a/webapp/src/lib/marked/renderers/InternalLink.svelte b/webapp/src/lib/marked/renderers/InternalLink.svelte
index 6d5d096..e4b2698 100644
--- a/webapp/src/lib/marked/renderers/InternalLink.svelte
+++ b/webapp/src/lib/marked/renderers/InternalLink.svelte
@@ -2,11 +2,24 @@
import FaRegQuestionCircle from 'svelte-icons/fa/FaRegQuestionCircle.svelte';
export let text: string;
+ export let displayText: string;
+
+ if (!displayText) {
+ const aliasMatch = text.match(/^(?:.+)\|(.*)$/);
+ const headerMatch = text.match(/^(.[^|]+)\#(.[^|]*)$/);
+ if (aliasMatch) {
+ displayText = aliasMatch[1];
+ } else if (headerMatch) {
+ displayText = `${headerMatch[1]} > ${headerMatch[2]}`;
+ } else {
+ displayText = text;
+ }
+ }
- {text}
+ {displayText}
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
diff --git a/webapp/test/markdown/links.md b/webapp/test/markdown/links.md
new file mode 100644
index 0000000..11e9dd3
--- /dev/null
+++ b/webapp/test/markdown/links.md
@@ -0,0 +1,20 @@
+# All link types.
+
+## Internal links with [[brackets]]
+
+- [[Normal internal link]]
+- [[Aliased internal link|Link with alias]]
+- [[Page with headings#heading A]] (link to heading)
+- [[Page with headings#heading A|Link with heading alias]] (link to heading with alias)
+- [[Home (fake)#Home|Link with heading alias#false heading]] (link to heading with alias with heading)
+- [[]] empty link
+
+## Internal links (classic style)
+
+- [Classic internal link (URL encoded)](internal%20page)
+- [Classic internal link (tag format)](