<commit_before>/* eslint-env jasmine, mocha */
/** @jsx boreH */

import * as IncrementalDOM from 'incremental-dom';
import { Component, define, h, prop, props, vdom } from '../../../src/index';
import afterMutations from '../../lib/after-mutations';
import fixture from '../../lib/fixture';
import { h as boreH, mount } from 'bore';

describe('vdom/properties', () => {
  it('class -> className', () => {
    const Elem = define(class extends Component {
      renderCallback () {
        vdom.element('div', { class: 'test' });
      }
    });
    return mount(<Elem />).wait()
      .then(w => expect(w.has('.test')).to.equal(true));
  });

  it('applies custom semantics to the className attribute when used in a stack context', () => {
    const helper = (_, children) => children();
    const Elem = define(class extends Component {
      renderCallback () {
        vdom.elementOpen(helper);
        vdom.elementOpen('div', null, null, 'className', 'inner');
        vdom.elementClose('div');
        vdom.elementClose(helper);
      }
    });
    return mount(<Elem />).wait()
      .then(w => expect(w.has('.inner')).to.equal(true));
  });

  it('false should remove the attribute', done => {
    const elem = new (define(class extends Component {
      static get props () {
        return {
          test: prop.boolean()
        };
      }
      renderCallback () {
        vdom.element('div', { test: this.test });
      }
    }))();
    fixture(elem);
    let div;
    afterMutations(
      () => (div = elem.shadowRoot.firstChild),
      () => (elem.test = true),
      () => expect(div.hasAttribute('test')).to.equal(true),
      () => (elem.test = false),
      () => expect(div.hasAttribute('test')).to.equal(false),
      done
    );
  });

  it('should set props as properties instead of attributes on ctor references', () => {
    let fixture = document.createElement('div');
    const Elem = define(class extends Component {
      static get props () {
        return {
          foo: {}
        };
      }
    });

    IncrementalDOM.patch(fixture, () => {
      vdom.element(Elem, { foo: 'bar', bar: 'baz' });
      const elem = fixture.firstChild;
      expect(elem.foo).to.equal('bar');
      expect(elem.bar).to.equal(undefined);
      expect(elem.getAttribute('foo')).to.be.null;
      expect(elem.getAttribute('bar')).to.equal('baz');
    });
  });

  describe('re-rendering', () => {
    let Elem1;
    let Elem2;

    beforeEach(() => {
      Elem1 = define(class extends Component {
        static get props () {
          return {<commit_msg>Revert "test(svg): remove svg test as polyfills break this and we have no control over them"<commit_after>/* eslint-env jasmine, mocha */
/** @jsx boreH */

import * as IncrementalDOM from 'incremental-dom';
import { Component, define, h, prop, props, vdom } from '../../../src/index';
import afterMutations from '../../lib/after-mutations';
import fixture from '../../lib/fixture';
import { h as boreH, mount } from 'bore';

describe('vdom/properties', () => {
  it('class -> className', () => {
    const Elem = define(class extends Component {
      renderCallback () {
        vdom.element('div', { class: 'test' });
      }
    });
    return mount(<Elem />).wait()
      .then(w => expect(w.has('.test')).to.equal(true));
  });

  it('applies custom semantics to the className attribute when used in a stack context', () => {
    const helper = (_, children) => children();
    const Elem = define(class extends Component {
      renderCallback () {
        vdom.elementOpen(helper);
        vdom.elementOpen('div', null, null, 'className', 'inner');
        vdom.elementClose('div');
        vdom.elementClose(helper);
      }
    });
    return mount(<Elem />).wait()
      .then(w => expect(w.has('.inner')).to.equal(true));
  });

  it('false should remove the attribute', done => {
    const elem = new (define(class extends Component {
      static get props () {
        return {
          test: prop.boolean()
        };
      }
      renderCallback () {
        vdom.element('div', { test: this.test });
      }
    }))();
    fixture(elem);
    let div;
    afterMutations(
      () => (div = elem.shadowRoot.firstChild),
      () => (elem.test = true),
      () => expect(div.hasAttribute('test')).to.equal(true),
      () => (elem.test = false),
      () => expect(div.hasAttribute('test')).to.equal(false),
      done
    );
  });

  it('should not set properties on SVG elements', done => {
    expect(() => {
      const Test = define(class extends Component {
        renderCallback () {
          vdom.element('svg', { width: 100 });
        }
      });
      fixture(new Test());
      afterMutations(done);
    }).to.not.throw(Error);
  });

  it('should set props as properties instead of attributes on ctor references', () => {
    let fixture = document.createElement('div');
    const Elem = define(class extends Component {
      static get props () {
        return {
          foo: {}
        };
      }
    });

    IncrementalDOM.patch(fixture, () => {
      vdom.element(Elem, { foo: 'bar', bar: 'baz' });
      const elem = fixture.firstChild;
      expect(elem.foo).to.equal('bar');
      expect(elem.bar).to.equal(undefined);
      expect(elem.getAttribute('foo')).to.be.null;
      expect(elem.getAttribute('bar')).to.equal('baz');
    });
  });

  describe('re-rendering', () => {
    let Elem1;
    let Elem2;

    beforeEach(() => {
      Elem1 = define(class extends Component {
        static get props () {
          return {
{'fraction_non_alphanumeric': 0.17908025247971146, 'fraction_numerical': 0.0016230838593327321, 'mean_word_length': 2.4968474148802016, 'pattern_counts': {'":': 0, '<': 7, '<?xml version=': 0, '>': 43, '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': '3685627', 'n_tokens_mistral': 1672, 'n_tokens_neox': 1653, 'n_words': 385}