Checkbox type tag vanished using Cycle.JS with Snabbdom and Typescript (Parcel Bundler)

Question

I have just tried to implement Typescript with a simple toggle-example in Cycle.JS.

Here is the setup:

package.json

{
  "name": "parcel-cycle-playground",
  "version": "0.1.0",
  "main": "index.js",
  "scripts": {
    "dev": "parcel index.html"
  },
  "dependencies": {
    "@cycle/dom": "^23.1.0",
    "@cycle/http": "^15.4.0",
    "@cycle/run": "^5.7.0",
    "xstream": "^11.14.0"
  },
  "devDependencies": {
    "parcel": "^2.8.0",
    "process": "^0.11.10"
  }
}

tsconfig.json (copied from Snabbdom homepage)

{
  "compilerOptions": {
    "jsx": "react",
    "jsxFactory": "jsx",
    "jsxFragmentFactory": "Fragment"
  }
}

app.jsx

import { jsx, VNode } from "snabbdom";
// import xs from "xstream";
import run from "@cycle/run";
import { makeDOMDriver } from "@cycle/dom";

const intent = sources => {
    const domSource = sources.DOM;

    return {
        toggleClicked$: domSource.select('.input').events('click')
    }
}

const model = actions => {
    const toggleState$ =  actions.toggleClicked$
        .map(ev => ev.target.checked)
        .startWith(false)

    return toggleState$
}

const view = (state$): VNode => {
    return state$.map(toggled =>
        <div>
            <input type="checkbox" className="input" /> Toggle me
            <p>{ toggled ? 'ON' : 'off'}</p>
        </div>
    )
}

const main = sources => {
    const actions = intent(sources);

    return {
        DOM: view(model(actions))
    }
}

run(main, {
    DOM: makeDOMDriver('#app')
});

The checkbox is rendered as text-input, the type-tag is gone:

I'm just starting with Typescript and can't figure out, where the problem is.

The vanilla version of the simple example works perfectly fine. The input field rendered as text-input right after switching to typescript.

Answer 1

As of the Snabbdom documentation there is another syntax:

<input attrs={{ type: "checkbox" }} />

Don't know why it has worked without Typescript. Maybe with Babel under the hood of Parcel.