import { describe, it, expect } from './runner.js?v=4';
import { renderMd, formatTodoItems, stripMd } from '../../js/modules/markdown.js';
import { state } from '../../js/modules/state.js';

describe('Markdown: Basic Rendering', () => {
    it('renders paragraph', () => {
        const html = renderMd('hello world');
        expect(html).toContain('hello world');
    });

    it('renders bold and italic', () => {
        const html = renderMd('**bold** and *italic*');
        expect(html).toContain('<strong>bold</strong>');
        expect(html).toContain('<em>italic</em>');
    });

    it('renders headings', () => {
        const html = renderMd('# Title\n## Subtitle');
        expect(html).toContain('<h1');
        expect(html).toContain('<h2');
    });

    it('renders code blocks', () => {
        const html = renderMd('```\ncode\n```');
        expect(html).toContain('<code');
    });

    it('renders links with target=_blank', () => {
        const html = renderMd('[link](https://example.com)');
        expect(html).toContain('target="_blank"');
        expect(html).toContain('rel="noopener');
    });
});

describe('Markdown: Wiki Links', () => {
    it('resolves existing card link', () => {
        const card = state.cards[0];
        if (!card) return;
        const html = renderMd(`see [[${card.title}]]`);
        expect(html).toContain('card-link');
        expect(html).toContain(`data-card-id="${card.id}"`);
    });

    it('marks broken link', () => {
        const html = renderMd('see [[__nonexistent_card_xyzzy__]]');
        expect(html).toContain('broken');
    });

    it('wiki link is case-insensitive', () => {
        const card = state.cards[0];
        if (!card) return;
        const upper = card.title.toUpperCase();
        const html = renderMd(`see [[${upper}]]`);
        expect(html).toContain('card-link');
    });
});

describe('Markdown: Gallery Block', () => {
    it('renders gallery from fenced block', () => {
        const html = renderMd('```gallery\n![img](uploads/test.jpg)\n```');
        expect(html).toContain('md-gallery');
        expect(html).toContain('md-gallery-item');
    });

    it('empty gallery renders nothing', () => {
        const html = renderMd('```gallery\nno images here\n```');
        expect(html).toContain(''); // empty result, no gallery div
    });
});

describe('Markdown: Todo Items', () => {
    it('formatTodoItems converts checkboxes to buttons', () => {
        const container = document.createElement('div');
        container.innerHTML = '<ul><li><input type="checkbox"> task one</li><li><input type="checkbox" checked> task two</li></ul>';
        formatTodoItems(container);
        const buttons = container.querySelectorAll('.todo-cb');
        expect(buttons.length).toBe(2);
    });

    it('checked items have done class', () => {
        const container = document.createElement('div');
        container.innerHTML = '<ul><li><input type="checkbox" checked> done</li></ul>';
        formatTodoItems(container);
        const item = container.querySelector('.todo-item');
        expect(item.classList.contains('todo-done')).toBe(true);
    });
});

describe('Markdown: stripMd', () => {
    it('strips markdown formatting', () => {
        const plain = stripMd('**bold** and *italic* [link](url)');
        expect(plain).toContain('bold');
        expect(plain.includes('**')).toBe(false);
        expect(plain.includes('*')).toBe(false);
    });

    it('strips image references', () => {
        const plain = stripMd('text ![alt](image.jpg) more');
        expect(plain.includes('![alt]')).toBe(false);
    });
});