@glossarist/concept-browser 0.3.3 → 0.3.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@glossarist/concept-browser",
-  "version": "0.3.3",
+  "version": "0.3.4",
   "description": "Vue SPA for browsing Glossarist terminology datasets with cross-reference resolution, graph visualization, and multi-language support",
   "type": "module",
   "bin": {

package/src/__tests__/asciidoc-lite.test.ts

@@ -0,0 +1,92 @@
+import { describe, it, expect } from 'vitest';
+import { renderAsciiDocLite } from '../utils/asciidoc-lite';
+
+describe('renderAsciiDocLite', () => {
+  it('returns empty string for empty input', () => {
+    expect(renderAsciiDocLite('')).toBe('');
+  });
+
+  it('wraps plain text in <p>', () => {
+    expect(renderAsciiDocLite('Hello world')).toBe('<p>Hello world</p>');
+  });
+
+  it('creates separate paragraphs on blank lines', () => {
+    const result = renderAsciiDocLite('First\n\nSecond');
+    expect(result).toContain('<p>First</p>');
+    expect(result).toContain('<p>Second</p>');
+  });
+
+  it('renders headings (level + 1, h1 reserved)', () => {
+    expect(renderAsciiDocLite('== Heading 2')).toContain('<h3>Heading 2</h3>');
+    expect(renderAsciiDocLite('=== Heading 3')).toContain('<h4>Heading 3</h4>');
+    expect(renderAsciiDocLite('===== Heading 5')).toContain('<h6>Heading 5</h6>');
+  });
+
+  it('renders bold text', () => {
+    expect(renderAsciiDocLite('some *bold* text')).toContain('<strong>bold</strong>');
+  });
+
+  it('renders italic text', () => {
+    expect(renderAsciiDocLite('some _italic_ text')).toContain('<em>italic</em>');
+  });
+
+  it('renders monospace text', () => {
+    expect(renderAsciiDocLite('use `code` here')).toContain('<code>code</code>');
+  });
+
+  it('renders AsciiDoc links with label', () => {
+    const result = renderAsciiDocLite('see https://example.com[label] here');
+    expect(result).toContain('<a href="https://example.com"');
+    expect(result).toContain('>label</a>');
+  });
+
+  it('renders bare URLs as links', () => {
+    const result = renderAsciiDocLite('visit https://example.com now');
+    expect(result).toContain('<a href="https://example.com"');
+  });
+
+  it('renders unordered lists', () => {
+    const result = renderAsciiDocLite('* item one\n* item two');
+    expect(result).toContain('<ul>');
+    expect(result).toContain('<li');
+    expect(result).toContain('item one');
+    expect(result).toContain('item two');
+  });
+
+  it('renders ordered lists', () => {
+    const result = renderAsciiDocLite('. first\n. second');
+    expect(result).toContain('<ol>');
+    expect(result).toContain('first');
+    expect(result).toContain('second');
+  });
+
+  it('renders source blocks with ---- delimiter', () => {
+    const result = renderAsciiDocLite('----\nlet x = 1;\n----');
+    expect(result).toContain('<pre><code>');
+    expect(result).toContain('let x = 1;');
+  });
+
+  it('renders source blocks with .... delimiter', () => {
+    const result = renderAsciiDocLite('....\nsome text\n....');
+    expect(result).toContain('<pre><code>');
+    expect(result).toContain('some text');
+  });
+
+  it('escapes HTML in source blocks', () => {
+    const result = renderAsciiDocLite('----\n<a href="evil">\n----');
+    expect(result).toContain('&lt;a href=&quot;evil&quot;&gt;');
+    expect(result).not.toContain('<a href="evil">');
+  });
+
+  it('handles multi-line paragraphs', () => {
+    const result = renderAsciiDocLite('line one\nline two\n\nnew paragraph');
+    expect(result).toContain('<p>line one line two</p>');
+    expect(result).toContain('<p>new paragraph</p>');
+  });
+
+  it('handles nested list levels', () => {
+    const result = renderAsciiDocLite('* top\n** nested');
+    expect(result).toContain('list-level-1');
+    expect(result).toContain('list-level-2');
+  });
+});

package/src/__tests__/markdown-lite.test.ts

@@ -0,0 +1,88 @@
+import { describe, it, expect } from 'vitest';
+import { renderMarkdown } from '../utils/markdown-lite';
+
+describe('renderMarkdown', () => {
+  it('returns empty string for empty input', () => {
+    expect(renderMarkdown('')).toBe('');
+  });
+
+  it('wraps plain text in <p>', () => {
+    expect(renderMarkdown('Hello world')).toBe('<p>Hello world</p>');
+  });
+
+  it('creates separate paragraphs on blank lines', () => {
+    const result = renderMarkdown('First\n\nSecond');
+    expect(result).toContain('<p>First</p>');
+    expect(result).toContain('<p>Second</p>');
+  });
+
+  it('renders headings (level + 1, h1 reserved)', () => {
+    expect(renderMarkdown('## Heading 2')).toContain('<h3>Heading 2</h3>');
+    expect(renderMarkdown('### Heading 3')).toContain('<h4>Heading 3</h4>');
+    expect(renderMarkdown('#### Heading 4')).toContain('<h5>Heading 4</h5>');
+  });
+
+  it('renders bold text', () => {
+    expect(renderMarkdown('some **bold** text')).toContain('<strong>bold</strong>');
+  });
+
+  it('renders italic text', () => {
+    expect(renderMarkdown('some *italic* text')).toContain('<em>italic</em>');
+  });
+
+  it('renders inline code', () => {
+    expect(renderMarkdown('use `code` here')).toContain('<code>code</code>');
+  });
+
+  it('renders markdown links', () => {
+    const result = renderMarkdown('[label](https://example.com)');
+    expect(result).toContain('<a href="https://example.com"');
+    expect(result).toContain('>label</a>');
+  });
+
+  it('renders unordered lists', () => {
+    const result = renderMarkdown('- one\n- two');
+    expect(result).toContain('<ul>');
+    expect(result).toContain('<li>one</li>');
+    expect(result).toContain('<li>two</li>');
+  });
+
+  it('renders ordered lists', () => {
+    const result = renderMarkdown('1. first\n2. second');
+    expect(result).toContain('<ol>');
+    expect(result).toContain('<li>first</li>');
+  });
+
+  it('renders blockquotes', () => {
+    const result = renderMarkdown('> quoted text');
+    expect(result).toContain('<blockquote>');
+    expect(result).toContain('quoted text');
+  });
+
+  it('renders code fences', () => {
+    const result = renderMarkdown('```\nlet x = 1;\n```');
+    expect(result).toContain('<pre><code>');
+    expect(result).toContain('let x = 1;');
+  });
+
+  it('renders code fences with language', () => {
+    const result = renderMarkdown('```js\nconst x = 1;\n```');
+    expect(result).toContain('class="language-js"');
+  });
+
+  it('escapes HTML in code fences', () => {
+    const result = renderMarkdown('```\n<a href="evil">\n```');
+    expect(result).toContain('&lt;a href="evil"&gt;');
+  });
+
+  it('renders horizontal rules', () => {
+    const result = renderMarkdown('---');
+    expect(result).toContain('<hr>');
+  });
+
+  it('handles multi-line paragraphs', () => {
+    const result = renderMarkdown('line one\nline two\n\nnew paragraph');
+    expect(result).toContain('<p>line one line two</p>');
+    expect(result).toContain('<p>new paragraph</p>');
+  });
+});

package/src/__tests__/plurimath.test.ts

@@ -0,0 +1,71 @@
+import { describe, it, expect, vi } from 'vitest';
+
+// Mock @plurimath/plurimath to avoid loading the 2.7MB Opal runtime in tests
+vi.mock('@plurimath/plurimath', () => ({
+  default: class MockPlurimath {
+    constructor(private data: string, private format: string) {}
+    toMathml() {
+      if (this.data === 'ERROR') throw new Error('parse error');
+      return `<math xmlns="http://www.w3.org/1998/Math/MathML" display="block"><mi>${this.data}</mi></math>`;
+    }
+    toAsciimath() { return this.data; }
+    toLatex() { return this.data; }
+    toHtml() { return this.data; }
+    toOmml() { return this.data; }
+    toDisplay() { return this.data; }
+  },
+}));
+
+import { loadPlurimath, renderToMathML, mathToHtml } from '../utils/plurimath';
+
+describe('loadPlurimath', () => {
+  it('loads and returns the Plurimath class', async () => {
+    const Plurimath = await loadPlurimath();
+    expect(Plurimath).toBeDefined();
+    const p = new Plurimath('x', 'asciimath');
+    expect(p.toMathml()).toContain('<math');
+  });
+
+  it('returns the same instance on subsequent calls', async () => {
+    const a = await loadPlurimath();
+    const b = await loadPlurimath();
+    expect(a).toBe(b);
+  });
+});
+
+describe('renderToMathML', () => {
+  it('returns MathML with inline display after loading', async () => {
+    await loadPlurimath();
+    const result = renderToMathML('x^2', 'asciimath');
+    expect(result).toContain('<math');
+    expect(result).toContain('display="inline"');
+    expect(result).not.toContain('display="block"');
+  });
+
+  it('returns null on parse error', async () => {
+    await loadPlurimath();
+    expect(renderToMathML('ERROR', 'asciimath')).toBeNull();
+  });
+});
+
+describe('mathToHtml', () => {
+  it('wraps MathML in math-inline span', async () => {
+    await loadPlurimath();
+    const result = mathToHtml('x', 'asciimath', false);
+    expect(result).toContain('class="math-inline"');
+    expect(result).toContain('<math');
+  });
+
+  it('adds math-bold class when bold is true', async () => {
+    await loadPlurimath();
+    const result = mathToHtml('x', 'asciimath', true);
+    expect(result).toContain('class="math-inline math-bold"');
+  });
+
+  it('returns fallback code element on error', async () => {
+    await loadPlurimath();
+    const result = mathToHtml('ERROR', 'asciimath', false);
+    expect(result).toContain('class="math-fallback"');
+    expect(result).toContain('ERROR');
+  });
+});

package/src/__tests__/v-math.test.ts

@@ -0,0 +1,78 @@
+import { describe, it, expect, vi, beforeEach } from 'vitest';
+
+// Mock plurimath module before importing v-math
+vi.mock('../utils/plurimath', () => ({
+  loadPlurimath: vi.fn(() => {
+    // Simulate loading — resolve immediately
+    return Promise.resolve(MockPlurimath);
+  }),
+  mathToHtml: vi.fn((expr: string, format: string, bold: boolean) => {
+    if (expr === 'SKIP') return `<code class="math-fallback">${expr}</code>`;
+    return `<span class="math-inline${bold ? ' math-bold' : ''}"><math><mi>${expr}</mi></math></span>`;
+  }),
+}));
+
+class MockPlurimath {
+  constructor() {}
+}
+
+import { vMath } from '../directives/v-math';
+import { loadPlurimath, mathToHtml } from '../utils/plurimath';
+
+describe('v-math directive', () => {
+  let container: HTMLElement;
+
+  beforeEach(() => {
+    container = document.createElement('div');
+    vi.clearAllMocks();
+  });
+
+  it('does nothing when no math-pending elements exist', () => {
+    container.innerHTML = '<p>plain text</p>';
+    vMath.mounted!(container, {} as any);
+    expect(container.innerHTML).toBe('<p>plain text</p>');
+  });
+
+  it('triggers loadPlurimath when math-pending elements exist', async () => {
+    container.innerHTML = '<span class="math-pending" data-expr="x^2" data-format="asciimath">x^2</span>';
+    vMath.mounted!(container, {} as any);
+    expect(loadPlurimath).toHaveBeenCalled();
+  });
+
+  it('replaces math-pending elements after loading', async () => {
+    container.innerHTML = '<span class="math-pending" data-expr="x^2" data-format="asciimath">x^2</span>';
+    vMath.mounted!(container, {} as any);
+
+    // Wait for loadPlurimath promise to resolve and upgrade to run
+    await vi.waitFor(() => {
+      expect(mathToHtml).toHaveBeenCalledWith('x^2', 'asciimath', false);
+    });
+  });
+
+  it('handles bold math-pending elements', async () => {
+    container.innerHTML = '<span class="math-pending math-bold" data-expr="alpha" data-format="asciimath">alpha</span>';
+    vMath.mounted!(container, {} as any);
+
+    await vi.waitFor(() => {
+      expect(mathToHtml).toHaveBeenCalledWith('alpha', 'asciimath', true);
+    });
+  });
+
+  it('skips elements without data-expr', async () => {
+    container.innerHTML = '<span class="math-pending">no expr</span>';
+    vMath.mounted!(container, {} as any);
+
+    await vi.waitFor(() => {
+      expect(mathToHtml).not.toHaveBeenCalled();
+    });
+  });
+
+  it('uses default format asciimath when data-format is missing', async () => {
+    container.innerHTML = '<span class="math-pending" data-expr="x">x</span>';
+    vMath.mounted!(container, {} as any);
+
+    await vi.waitFor(() => {
+      expect(mathToHtml).toHaveBeenCalledWith('x', 'asciimath', false);
+    });
+  });
+});