import { note } from './note';
import { run, parse as parse_ } from '../api';
import { Opts } from '../api/parse';
import { List, Node } from '../combinator/parser';
import { html } from 'typed-dom/dom';
import { normalize } from '../debug.test';

const parse = (s: string, o?: Opts) => parse_(s, { test: true, ...o });

describe('Unit: processor/note', () => {
  describe('annotation', () => {
    it('empty', () => {
      const lists = {
        annotations: new List<Node<HTMLElement>>(),
        references: new List<Node<HTMLElement>>(),
      };
      const target = run(parse('', lists));
      [...note(target, lists)];
      assert.deepStrictEqual(
        [...target.children].map(el => normalize(el.outerHTML)),
        []);
    });

    it('1', () => {
      const lists = {
        annotations: new List<Node<HTMLElement>>(),
        references: new List<Node<HTMLElement>>(),
      };
      const target = run(parse('((a b))', lists));
      for (let i = 0; i < 3; ++i) {
        assert.deepStrictEqual([...note(target, lists)].length, 1);
        assert.deepStrictEqual(
          [...target.children].map(el => normalize(el.outerHTML)),
          [
            html('p', [
              html('sup', { class: 'annotation', id: 'annotation::ref:a_b:1', title: 'a b' }, [
                html('a', { href: '#annotation::def:a_b:1' }, '*1')
              ]),
            ]).outerHTML,
            html('ol', { class: 'annotations' }, [
              html('li', { id: 'annotation::def:a_b:1', 'data-marker': '*1' }, [
                html('span', 'a b'),
                html('sup', [html('a', { href: '#annotation::ref:a_b:1' }, '^1')]),
              ]),
            ]).outerHTML,
          ]);
      }
    });

    it('2', () => {
      const lists = {
        annotations: new List<Node<HTMLElement>>(),
        references: new List<Node<HTMLElement>>(),
      };
      const target = run(parse('((1))((12345678901234567890))', lists));
      for (let i = 0; i < 3; ++i) {
        assert.deepStrictEqual([...note(target, lists)].length, 1);
        assert.deepStrictEqual(
          [...target.children].map(el => normalize(el.outerHTML)),
          [
            html('p', [
              html('sup', { class: 'annotation', id: 'annotation::ref:1:1', title: '1' }, [
                html('a', { href: '#annotation::def:1:1' }, '*1')
              ]),
              html('sup', { class: 'annotation', id: 'annotation::ref:12345678901234567890:1', title: '12345678901234567890' }, [
                html('a', { href: '#annotation::def:12345678901234567890:1' }, '*2')
              ]),
            ]).outerHTML,
            html('ol', { class: 'annotations' }, [
              html('li', { id: 'annotation::def:1:1', 'data-marker': '*1' }, [
                html('span', '1'),
                html('sup', [html('a', { href: '#annotation::ref:1:1' }, '^1')]),
              ]),
              html('li', { id: 'annotation::def:12345678901234567890:1', 'data-marker': '*2' }, [
                html('span', '12345678901234567890'),
                html('sup', [html('a', { href: '#annotation::ref:12345678901234567890:1' }, '^2')]),
              ]),
            ]).outerHTML,
          ]);
      }
    });

    it('unify', () => {
      const lists = {
        annotations: new List<Node<HTMLElement>>(),
        references: new List<Node<HTMLElement>>(),
      };
      const target = run(parse('((1))((2))((3))((2))((4))', lists));
      for (let i = 0; i < 3; ++i) {
        [...note(target, lists)];
        assert.deepStrictEqual(
          [...target.children].map(el => normalize(el.outerHTML)),
          [
            html('p', [
              html('sup', { class: 'annotation', id: 'annotation::ref:1:1', title: '1' }, [
                html('a', { href: '#annotation::def:1:1' }, '*1')
              ]),
              html('sup', { class: 'annotation', id: 'annotation::ref:2:1', title: '2' }, [
                html('a', { href: '#annotation::def:2:1' }, '*2')
              ]),
              html('sup', { class: 'annotation', id: 'annotation::ref:3:1', title: '3' }, [
                html('a', { href: '#annotation::def:3:1' }, '*3')
              ]),
              html('sup', { class: 'annotation', id: 'annotation::ref:2:2', title: '2' }, [
                html('a', { href: '#annotation::def:2:1' }, '*2')
              ]),
              html('sup', { class: 'annotation', id: 'annotation::ref:4:1', title: '4' }, [
                html('a', { href: '#annotation::def:4:1' }, '*4')
              ]),
            ]).outerHTML,
            html('ol', { class: 'annotations' }, [
              html('li', { id: 'annotation::def:1:1', 'data-marker': '*1' }, [
                html('span', '1'),
                html('sup', [html('a', { href: '#annotation::ref:1:1' }, '^1')]),
              ]),
              html('li', { id: 'annotation::def:2:1', 'data-marker': '*2' }, [
                html('span', '2'),
                html('sup', [
                  html('a', { href: '#annotation::ref:2:1' }, '^2'),
                  html('a', { href: '#annotation::ref:2:2' }, '^4'),
                ]),
              ]),
              html('li', { id: 'annotation::def:3:1', 'data-marker': '*3' }, [
                html('span', '3'),
                html('sup', [html('a', { href: '#annotation::ref:3:1' }, '^3')]),
              ]),
              html('li', { id: 'annotation::def:4:1', 'data-marker': '*4' }, [
                html('span', '4'),
                html('sup', [html('a', { href: '#annotation::ref:4:1' }, '^5')]),
              ]),
            ]).outerHTML,
          ]);
      }
    });

    it('separation', () => {
      const lists = {
        annotations: new List<Node<HTMLElement>>(),
        references: new List<Node<HTMLElement>>(),
      };
      const target = run(parse([
        '!>> ((1))\n> ((2))\n~~~',
        '~~~~example/markdown\n((3))\n~~~~',
        '((4))',
      ].join('\n\n'), lists));
      for (let i = 0; i < 3; ++i) {
        [...note(target, lists)];
        assert.deepStrictEqual(
          [...target.children].map(el => normalize(el.outerHTML)),
          [
            '<blockquote><blockquote><section><p><sup class="annotation" id="annotation:random:ref:1:1" title="1"><a href="#annotation:random:def:1:1">*1</a></sup></p><ol class="annotations"><li id="annotation:random:def:1:1" data-marker="*1"><span>1</span><sup><a href="#annotation:random:ref:1:1">^1</a></sup></li></ol><h2>References</h2><ol class="references"></ol></section></blockquote><section><p><sup class="annotation" id="annotation:random:ref:2:1" title="2"><a href="#annotation:random:def:2:1">*1</a></sup><br>~~~</p><ol class="annotations"><li id="annotation:random:def:2:1" data-marker="*1"><span>2</span><sup><a href="#annotation:random:ref:2:1">^1</a></sup></li></ol><h2>References</h2><ol class="references"></ol></section></blockquote>',
            '<aside class="example" data-type="markdown"><pre translate="no">((3))</pre><hr><section><p><sup class="annotation" id="annotation:random:ref:3:1" title="3"><a href="#annotation:random:def:3:1">*1</a></sup></p><ol class="annotations"><li id="annotation:random:def:3:1" data-marker="*1"><span>3</span><sup><a href="#annotation:random:ref:3:1">^1</a></sup></li></ol><h2>References</h2><ol class="references"></ol></section></aside>',
            '<p><sup class="annotation" id="annotation::ref:4:1" title="4"><a href="#annotation::def:4:1">*1</a></sup></p>',
            '<ol class="annotations"><li id="annotation::def:4:1" data-marker="*1"><span>4</span><sup><a href="#annotation::ref:4:1">^1</a></sup></li></ol>',
          ]);
      }
    });

    it('split', () => {
      const lists = {
        annotations: new List<Node<HTMLElement>>(),
        references: new List<Node<HTMLElement>>(),
      };
      const target = run(parse('((1))\n\n## a\n\n((2))((1))((3))((2))\n\n## b\n\n((2))', lists));
      for (let i = 0; i < 3; ++i) {
        [...note(target, lists)];
        assert.deepStrictEqual(
          [...target.children].map(el => normalize(el.outerHTML)),
          [
            html('p', [
              html('sup', { class: 'annotation', id: 'annotation::ref:1:1', title: '1' }, [
                html('a', { href: '#annotation::def:1:1' }, '*1')
              ]),
            ]).outerHTML,
            html('ol', { class: 'annotations' }, [
              html('li', { id: 'annotation::def:1:1', 'data-marker': '*1' }, [
                html('span', '1'),
                html('sup', [html('a', { href: '#annotation::ref:1:1' }, '^1')]),
              ]),
            ]).outerHTML,
            html('h2', { id: 'index::a' }, 'a').outerHTML,
            html('p', [
              html('sup', { class: 'annotation', id: 'annotation::ref:2:1', title: '2' }, [
                html('a', { href: '#annotation::def:2:1' }, '*2')
              ]),
              html('sup', { class: 'annotation', id: 'annotation::ref:1:2', title: '1' }, [
                html('a', { href: '#annotation::def:1:2' }, '*3')
              ]),
              html('sup', { class: 'annotation', id: 'annotation::ref:3:1', title: '3' }, [
                html('a', { href: '#annotation::def:3:1' }, '*4')
              ]),
              html('sup', { class: 'annotation', id: 'annotation::ref:2:2', title: '2' }, [
                html('a', { href: '#annotation::def:2:1' }, '*2')
              ]),
            ]).outerHTML,
            html('ol', { class: 'annotations' }, [
              html('li', { id: 'annotation::def:2:1', 'data-marker': '*2' }, [
                html('span', '2'),
                html('sup', [
                  html('a', { href: '#annotation::ref:2:1' }, '^2'),
                  html('a', { href: '#annotation::ref:2:2' }, '^5'),
                ]),
              ]),
              html('li', { id: 'annotation::def:1:2', 'data-marker': '*3' }, [
                html('span', '1'),
                html('sup', [html('a', { href: '#annotation::ref:1:2' }, '^3')]),
              ]),
              html('li', { id: 'annotation::def:3:1', 'data-marker': '*4' }, [
                html('span', '3'),
                html('sup', [html('a', { href: '#annotation::ref:3:1' }, '^4')]),
              ]),
            ]).outerHTML,
            html('h2', { id: 'index::b' }, 'b').outerHTML,
            html('p', [
              html('sup', { class: 'annotation', id: 'annotation::ref:2:3', title: '2' }, [
                html('a', { href: '#annotation::def:2:2' }, '*5')
              ]),
            ]).outerHTML,
            html('ol', { class: 'annotations' }, [
              html('li', { id: 'annotation::def:2:2', 'data-marker': '*5' }, [
                html('span', '2'),
                html('sup', [html('a', { href: '#annotation::ref:2:3' }, '^6')]),
              ]),
            ]).outerHTML,
          ]);
      }
    });

    it('id', () => {
      const lists = {
        annotations: new List<Node<HTMLElement>>(),
        references: new List<Node<HTMLElement>>(),
      };
      const target = run(parse('((a b))', lists));
      for (let i = 0; i < 3; ++i) {
        assert.deepStrictEqual([...note(target, lists, undefined, { id: '0' })].length, 1);
        assert.deepStrictEqual(
          [...target.children].map(el => normalize(el.outerHTML)),
          [
            html('p', [
              html('sup', { class: 'annotation', id: 'annotation:0:ref:a_b:1', title: 'a b' }, [
                html('a', { href: '#annotation:0:def:a_b:1' }, '*1')
              ]),
            ]).outerHTML,
            html('ol', { class: 'annotations' }, [
              html('li', { id: 'annotation:0:def:a_b:1', 'data-marker': '*1' }, [
                html('span', 'a b'),
                html('sup', [html('a', { href: '#annotation:0:ref:a_b:1' }, '^1')]),
              ]),
            ]).outerHTML,
          ]);
      }
    });

    it('nest', () => {
      const lists = {
        annotations: new List<Node<HTMLElement>>(),
        references: new List<Node<HTMLElement>>(),
      };
      const target = run(parse('((a((b))))((a))((b))', lists));
      for (let i = 0; i < 3; ++i) {
        [...note(target, lists)];
        assert.deepStrictEqual(
          [...target.children].map(el => normalize(el.outerHTML)),
          [
            html('p', [
              html('sup', { class: 'annotation', id: 'annotation::ref:a((b)):1', title: 'a((b))' }, [
                html('a', { href: '#annotation::def:a((b)):1' }, '*1')
              ]),
              html('sup', { class: 'annotation', id: 'annotation::ref:a:1', title: 'a' }, [
                html('a', { href: '#annotation::def:a:1' }, '*3')
              ]),
              html('sup', { class: 'annotation', id: 'annotation::ref:b:2', title: 'b' }, [
                html('a', { href: '#annotation::def:b:1' }, '*2')
              ]),
            ]).outerHTML,
            html('ol', { class: 'annotations' }, [
              html('li', { id: 'annotation::def:a((b)):1', 'data-marker': '*1' }, [
                html('span', [
                  'a',
                  html('sup', { class: 'annotation', id: 'annotation::ref:b:1', title: 'b' }, [
                    html('a', { href: '#annotation::def:b:1' }, '*2')
                  ]),
                ]),
                html('sup', [
                  html('a', { href: '#annotation::ref:a((b)):1' }, '^1'),
                ])
              ]),
              html('li', { id: 'annotation::def:b:1', 'data-marker': '*2' }, [
                html('span', [
                  'b',
                ]),
                html('sup', [
                  html('a', { href: '#annotation::ref:b:1' }, '^2'),
                  html('a', { href: '#annotation::ref:b:2' }, '^4'),
                ])
              ]),
              html('li', { id: 'annotation::def:a:1', 'data-marker': '*3' }, [
                html('span', [
                  'a',
                ]),
                html('sup', [
                  html('a', { href: '#annotation::ref:a:1' }, '^3'),
                ])
              ]),
            ]).outerHTML,
          ]);
      }
    });

  });

  describe('reference', () => {
    it('1', () => {
      const lists = {
        annotations: new List<Node<HTMLElement>>(),
        references: new List<Node<HTMLElement>>(),
      };
      const target = run(parse('[[a b]]', lists));
      const notes = { references: html('ol') };
      for (let i = 0; i < 3; ++i) {
        [...note(target, lists, notes)];
        assert.deepStrictEqual(
          [...target.children].map(el => normalize(el.outerHTML)),
          [
            html('p', [
              html('sup', { class: 'reference', id: 'reference::ref:a_b:1', title: 'a b' }, [
                html('a', { href: '#reference::def:a_b' }, '[1]')
              ]),
            ]).outerHTML,
          ]);
        assert.deepStrictEqual(
          [normalize(notes.references.outerHTML)],
          [
            html('ol', [
              html('li', { id: 'reference::def:a_b' }, [
                html('span', 'a b'),
                html('sup', [html('a', { href: '#reference::ref:a_b:1' }, '^1')]),
              ]),
            ]).outerHTML,
          ]);
      }
    });

    it('abbr', () => {
      const lists = {
        annotations: new List<Node<HTMLElement>>(),
        references: new List<Node<HTMLElement>>(),
      };
      const target = run(parse('[[^A 1]][[^A 1|b]][[^A 1]]', lists));
      const notes = { references: html('ol') };
      for (let i = 0; i < 3; ++i) {
        [...note(target, lists, notes)];
        assert.deepStrictEqual(
          [...target.children].map(el => normalize(el.outerHTML)),
          [
            html('p', [
              html('sup', { class: 'reference', 'data-abbr': 'A 1', id: 'reference::ref:A_1:1', title: 'b' }, [
                html('a', { href: '#reference::def:A_1' }, '[A 1]')
              ]),
              html('sup', { class: 'reference', 'data-abbr': 'A 1', id: 'reference::ref:A_1:2', title: 'b' }, [
                html('a', { href: '#reference::def:A_1' }, '[A 1]')
              ]),
              html('sup', { class: 'reference', 'data-abbr': 'A 1', id: 'reference::ref:A_1:3', title: 'b' }, [
                html('a', { href: '#reference::def:A_1' }, '[A 1]')
              ]),
            ]).outerHTML,
          ]);
        assert.deepStrictEqual(
          [normalize(notes.references.outerHTML)],
          [
            html('ol', [
              html('li', { id: 'reference::def:A_1' }, [
                html('span', 'b'),
                html('sup', [
                  html('a', { href: '#reference::ref:A_1:1' }, '^1'),
                  html('a', { href: '#reference::ref:A_1:2', title: 'b' }, '^2'),
                  html('a', { href: '#reference::ref:A_1:3' }, '^3'),
                ])
              ]),
            ]).outerHTML,
          ]);
      }
    });

    it('nest', () => {
      const lists = {
        annotations: new List<Node<HTMLElement>>(),
        references: new List<Node<HTMLElement>>(),
      };
      const target = run(parse('((a[[^B]]))[[^B|c]]', lists));
      const notes = { references: html('ol') };
      for (let i = 0; i < 3; ++i) {
        [...note(target, lists, notes)];
        assert.deepStrictEqual(
          [...target.children].map(el => normalize(el.outerHTML)),
          [
            html('p', [
              html('sup', { class: 'annotation', id: 'annotation::ref:a[[^B]]:1', title: 'a[[^B]]' }, [
                html('a', { href: '#annotation::def:a[[^B]]:1' }, '*1')
              ]),
              html('sup', { class: 'reference', 'data-abbr': 'B', id: 'reference::ref:B:2', title: 'c' }, [
                html('a', { href: '#reference::def:B' }, '[B]')
              ]),
            ]).outerHTML,
            html('ol', { class: 'annotations' }, [
              html('li', { id: 'annotation::def:a[[^B]]:1', 'data-marker': '*1' }, [
                html('span', [
                  'a',
                  html('sup', { class: 'reference', 'data-abbr': 'B', id: 'reference::ref:B:1', title: 'c' }, [
                    html('a', { href: '#reference::def:B' }, '[B]')
                  ]),
                ]),
                html('sup', [html('a', { href: '#annotation::ref:a[[^B]]:1' }, '^1')])
              ]),
            ]).outerHTML,
          ]);
        assert.deepStrictEqual(
          [normalize(notes.references.outerHTML)],
          [
            html('ol', [
              html('li', { id: 'reference::def:B' }, [
                html('span', 'c'),
                html('sup', [
                  html('a', { href: '#reference::ref:B:1' }, '^1'),
                  html('a', { href: '#reference::ref:B:2', title: 'c' }, '^2'),
                ]),
              ]),
            ]).outerHTML,
          ]);
      }
    });

  });

});