<commit_before>import TypedHTML from '../../index';
import { Sequence } from 'spica/sequence';
import { sqid } from 'spica/sqid';

declare const _: { shuffle<T>(as: T[]): T[]; };

describe('Integration: Typed DOM', function () {
  describe('spec', function () {
    it('empty', function () {
      const dom = TypedHTML.p();
      assert(dom.element.outerHTML === '<p></p>');
      assert(dom.children === void 0);
    });

    it('factory', function () {
      const dom = TypedHTML.p(() => {
        const el = document.createElement('p');
        el.id = 'test';
        return el;
      });
      assert(dom.element.id === 'test');
      assert(dom.children === void 0);
    });

    it('text', function () {
      const dom = TypedHTML.p(`a`);
      assert(dom.element.outerHTML === '<p>a</p>');
      assert(dom.children === 'a');
    });

    it('text children update', function () {
      const dom = TypedHTML.p(`a` as string);
      dom.children = 'b';
      assert(dom.element.outerHTML === '<p>b</p>');
      assert(dom.children === 'b');
    });

    it('text with factory', function () {
      const dom = TypedHTML.p(`a`, () => {
        const el = document.createElement('p');
        el.id = 'test';
        return el;
      });
      assert(dom.element.id === 'test');
      assert(dom.children === 'a');
    });

    it('collection', function () {
      const dom = TypedHTML.ul([
        TypedHTML.li(`1` as string),
        TypedHTML.li(`2`)
      ]);
      assert(dom.element.outerHTML === '<ul><li>1</li><li>2</li></ul>');
      assert(dom.children.length === 2);
      assert(dom.children.every(({element}, i) => element === dom.element.children[i]));
    });

    it('collection children update', function () {
      const dom = TypedHTML.ul([
        TypedHTML.li(`1` as string)
      ]);
      dom.children = [
        TypedHTML.li('2'),
        TypedHTML.li('3')
      ];
      assert(dom.element.outerHTML === '<ul><li>2</li><li>3</li></ul>');
      assert(dom.children.length === 2);
      assert(dom.children.every(({element}, i) => element === dom.element.children[i]));
      dom.children = [
        TypedHTML.li('4')
      ];
      assert(dom.element.outerHTML === '<ul><li>4</li></ul>');
      assert(dom.children.length === 1);
      assert(dom.children.every(({element}, i) => element === dom.element.children[i]));

      // property test
      const ss = Array(3).fill(0).map(() => TypedHTML.li(``));
      void Sequence.zip(
        Sequence.cycle([[...Array(3).fill(0).map(() => TypedHTML.li(``)), ...ss]]),
        Sequence.cycle([[...Array(3).fill(0).map(() => TypedHTML.li(``)), ...ss]]))
        .take(1000)
        .map(lss =>
          lss
            .map(ls =>
              _.shuffle(ls.slice(-ls.length % (Math.random() * ls.length | 0)))))
        .extract()
        .forEach(([os, ns]) => {
          dom.children = os;
          Sequence.zip(
            Sequence.from(Array.from(dom.element.children)),
            Sequence.from(os.map(({element}) => element)))
            .extract()
            .forEach(([a, b]) =>
              void assert(a === b));
          dom.children = ns;
          Sequence.zip(
            Sequence.from(Array.from(dom.element.children)),
            Sequence.from(ns.map(({element}) => element)))
            .extract()
            .forEach(([a, b]) =>
              void assert(a === b));
        });
    });

    it('collection children partial update', function () {
      const dom = TypedHTML.ul([
        TypedHTML.li()
      ]);
      assert.throws(() => dom.children[0] = TypedHTML.li());
      assert.throws(() => dom.children.push(TypedHTML.li()));
      assert.throws(() => dom.children.pop());
      assert.throws(() => dom.children.length = 0);
      assert(dom.children.length === 1);
      assert(dom.children.every(({element}, i) => element === dom.element.children[i]));
    });

    it('collection with factory', function () {
      const dom = TypedHTML.ul([], () => {
        const el = document.createElement('ul');
        el.id = 'test';
        return el;
      });
      assert(dom.element.id === 'test');
      assert.deepStrictEqual(dom.children, []);
    });

    it('struct', function () {
      const dom = TypedHTML.article({
        title: TypedHTML.h1(`title`),
        content: TypedHTML.p([TypedHTML.a()])
      });
      assert(dom.element.outerHTML === '<article><h1>title</h1><p><a></a></p></article>');
      assert(dom.children.title.element === dom.element.firstChild);
      assert(dom.children.content.element === dom.element.lastChild);
    });

    it('struct children update', function () {
      const dom = TypedHTML.article({
        title: TypedHTML.h1(`a` as string)
      });
      dom.children = {
        title: TypedHTML.h1(`b`)
      };
      assert(dom.children.title.element.textContent === 'b');
      assert(dom.children.title.element === dom.element.firstChild);
      assert(dom.children.title.children === 'b');
    });

    it('struct children partial update', function () {
      const dom = TypedHTML.article({
        title: TypedHTML.h1(`a` as string)
      });
      dom.children.title = TypedHTML.h1(`b`);
      assert(dom.children.title.element.textContent === 'b');
      assert(dom.children.title.element === dom.element.firstChild);
      assert(dom.children.title.children === 'b');<commit_msg>test(integration): add tests<commit_after>import TypedHTML from '../../index';
import { Sequence } from 'spica/sequence';
import { sqid } from 'spica/sqid';

declare const _: { shuffle<T>(as: T[]): T[]; };

describe('Integration: Typed DOM', function () {
  describe('spec', function () {
    it('empty', function () {
      const dom = TypedHTML.p();
      assert(dom.element.outerHTML === '<p></p>');
      assert(dom.children === void 0);
    });

    it('factory', function () {
      const dom = TypedHTML.p(() => {
        const el = document.createElement('p');
        el.id = 'test';
        return el;
      });
      assert(dom.element.id === 'test');
      assert(dom.children === void 0);
    });

    it('text', function () {
      const dom = TypedHTML.p(`a`);
      assert(dom.element.outerHTML === '<p>a</p>');
      assert(dom.children === 'a');
    });

    it('text children update', function () {
      const dom = TypedHTML.p(`a` as string);
      dom.children = 'b';
      assert(dom.element.outerHTML === '<p>b</p>');
      assert(dom.children === 'b');
    });

    it('text with factory', function () {
      const dom = TypedHTML.p(`a`, () => {
        const el = document.createElement('p');
        el.id = 'test';
        return el;
      });
      assert(dom.element.id === 'test');
      assert(dom.children === 'a');
    });

    it('collection', function () {
      const dom = TypedHTML.ul([
        TypedHTML.li(`1` as string),
        TypedHTML.li(`2`)
      ]);
      assert(dom.element.outerHTML === '<ul><li>1</li><li>2</li></ul>');
      assert(dom.children.length === 2);
      assert(dom.children.every(({element}, i) => element === dom.element.children[i]));
    });

    it('collection children update', function () {
      const dom = TypedHTML.ul([
        TypedHTML.li(`1` as string)
      ]);
      dom.children = [
        TypedHTML.li('2'),
        TypedHTML.li('3')
      ];
      assert(dom.element.outerHTML === '<ul><li>2</li><li>3</li></ul>');
      assert(dom.children.length === 2);
      assert(dom.children.every(({element}, i) => element === dom.element.children[i]));
      dom.children = [
        TypedHTML.li('4')
      ];
      assert(dom.element.outerHTML === '<ul><li>4</li></ul>');
      assert(dom.children.length === 1);
      assert(dom.children.every(({element}, i) => element === dom.element.children[i]));

      // property test
      const ss = Array(3).fill(0).map(() => TypedHTML.li(``));
      void Sequence.zip(
        Sequence.cycle([[...Array(3).fill(0).map(() => TypedHTML.li(``)), ...ss]]),
        Sequence.cycle([[...Array(3).fill(0).map(() => TypedHTML.li(``)), ...ss]]))
        .take(1000)
        .map(lss =>
          lss
            .map(ls =>
              _.shuffle(ls.slice(-ls.length % (Math.random() * ls.length | 0)))))
        .extract()
        .forEach(([os, ns]) => {
          dom.children = os;
          Sequence.zip(
            Sequence.from(Array.from(dom.element.children)),
            Sequence.from(os.map(({element}) => element)))
            .extract()
            .forEach(([a, b]) =>
              void assert(a === b));
          dom.children = ns;
          Sequence.zip(
            Sequence.from(Array.from(dom.element.children)),
            Sequence.from(ns.map(({element}) => element)))
            .extract()
            .forEach(([a, b]) =>
              void assert(a === b));
        });
    });

    it('collection children partial update', function () {
      const dom = TypedHTML.ul([
        TypedHTML.li()
      ]);
      assert.throws(() => dom.children[0] = TypedHTML.li());
      assert.throws(() => dom.children.push(TypedHTML.li()));
      assert.throws(() => dom.children.pop());
      assert.throws(() => dom.children.length = 0);
      assert(dom.children.length === 1);
      assert(dom.children.every(({element}, i) => element === dom.element.children[i]));
    });

    it('collection with factory', function () {
      const dom = TypedHTML.ul([], () => {
        const el = document.createElement('ul');
        el.id = 'test';
        return el;
      });
      assert(dom.element.id === 'test');
      assert.deepStrictEqual(dom.children, []);
    });

    it('struct', function () {
      const dom = TypedHTML.article({
        title: TypedHTML.h1(`title`),
        content: TypedHTML.p([TypedHTML.a()])
      });
      assert(dom.element.outerHTML === '<article><h1>title</h1><p><a></a></p></article>');
      assert(dom.children.title.element === dom.element.firstChild);
      assert(dom.children.content.element === dom.element.lastChild);
    });

    it('struct empty', function () {
      const dom = TypedHTML.div({});
      assert.deepStrictEqual(dom.children, {});
    });

    it('struct children update', function () {
      const dom = TypedHTML.article({
        title: TypedHTML.h1(`a` as string)
      });
      dom.children = {
        title: TypedHTML.h1(`b`)
      };
      assert(dom.children.title.element.textContent === 'b');
      assert(dom.children.title.element === dom.element.firstChild);
      assert(dom.children.title.children === 'b');
    });

    it('struct children partial update', function () {
      const dom = TypedHTML.article({
        title: TypedHTML.h1(`a` as string)
      });
      dom.children.title = TypedHTML.h1(`b`);
      assert(dom.children.title.element.textContent === 'b');
      assert(dom.children.title.element === dom.element.firstChild);
      assert(dom.children.title.children === 'b');
{'fraction_non_alphanumeric': 0.20814146251611715, 'fraction_numerical': 0.00681525142751888, 'mean_word_length': 2.3608789848344167, 'pattern_counts': {'":': 0, '<': 65, '<?xml version=': 0, '>': 107, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '321495', 'n_tokens_mistral': 3420, 'n_tokens_neox': 3355, 'n_words': 580}