<commit_before>import { h, app } from "../src"

window.requestAnimationFrame = setTimeout

beforeEach(() => {
  document.body.innerHTML = ""
})

test("throttling", done => {
  app({
    view: state =>
      h(
        "div",
        {
          oncreate() {
            expect(document.body.innerHTML).toBe("<div>5</div>")
            done()
          }
        },
        state.value
      ),
    state: {
      value: 1
    },
    actions: {
      up(state) {
        return {
          value: state.value + 1
        }
      }
    },
    events: {
      load(state, actions) {
        actions.up()
        actions.up()
        actions.up()
        actions.up()
      },
      render(state) {
        //
        // Because renders are throttled this event is called only once.
        //
        expect(state).toEqual({ value: 5 })
      }
    }
  })
})

test("interop", done => {
  const emit = app({
    events: {
      foo(state, actions, data) {
        expect(data).toBe("bar")
        done()
      }
    }
  })
  emit("foo", "bar")
})

test("optional view", done => {
  app({
    events: {
      load() {
        done()
      }
    }
  })
})<commit_msg>Add test for updateElement with dynamic props.  (#321)<commit_after>import { h, app } from "../src"

window.requestAnimationFrame = setTimeout

beforeEach(() => {
  document.body.innerHTML = ""
})

test("throttling", done => {
  app({
    view: state =>
      h(
        "div",
        {
          oncreate() {
            expect(document.body.innerHTML).toBe("<div>5</div>")
            done()
          }
        },
        state.value
      ),
    state: {
      value: 1
    },
    actions: {
      up(state) {
        return {
          value: state.value + 1
        }
      }
    },
    events: {
      load(state, actions) {
        actions.up()
        actions.up()
        actions.up()
        actions.up()
      },
      render(state) {
        //
        // Because renders are throttled this event is called only once.
        //
        expect(state).toEqual({ value: 5 })
      }
    }
  })
})

test("interop", done => {
  const emit = app({
    events: {
      foo(state, actions, data) {
        expect(data).toBe("bar")
        done()
      }
    }
  })
  emit("foo", "bar")
})

test("optional view", done => {
  app({
    events: {
      load() {
        done()
      }
    }
  })
})

test("view values update upon state change", done => {
  document.body.innerHTML = `<div id="app"></div>`
  const emit = app({
    root: document.getElementById("app"),
    state: { changeInput: false },
    view: state => h("input", { id: state.changeInput ? "foo" : "bar", "value" : state.changeInput ? "fizz" : "buzz" }),
    actions: {
      updateInput (app, state, actions) {
        state.changeInput = true
        return state
      }
    },
    events: {
      updateView (state, actions) {
        actions.updateInput()
      },
      load () {
        expect(document.body.innerHTML).toBe(
          `<div id="app"></div>`
        )
      }
    }
  })

  const firstRenderId = requestAnimationFrame(() => {
    expect(document.body.innerHTML).toBe(
      `<input id="bar" value="buzz">`
    )

    emit("updateView")

    const secondRenderId = requestAnimationFrame(() => {
      console.log(document.body.innerHTML)
      expect(document.body.innerHTML).toBe(
        `<input id="foo" value="fizz">`
      )
      done()
      cancelAnimationFrame(secondRenderId)
    })

    cancelAnimationFrame(firstRenderId)
  })
})
{'fraction_non_alphanumeric': 0.1620926243567753, 'fraction_numerical': 0.0031446540880503146, 'mean_word_length': 1.701930501930502, 'pattern_counts': {'":': 0, '<': 13, '<?xml version=': 0, '>': 27, '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': '1254940', 'n_tokens_mistral': 1101, 'n_tokens_neox': 1087, 'n_words': 213}