import { assert } from 'chai' // workaround linter issue // eslint-disable-next-line @typescript-eslint/no-unused-vars import { jsx } from '../../package/jsx' import '../../package/jsx-global' describe('snabbdom', function () { describe('jsx', function () { it('can be used as a jsxFactory method', function () { const vnode =
Hello World
assert.deepStrictEqual(vnode, { sel: 'div', data: { title: 'Hello World' }, children: undefined, elm: undefined, text: 'Hello World', key: undefined }) }) it('creates text property for text only child', function () { const vnode =
foo bar
assert.deepStrictEqual(vnode, { sel: 'div', data: {}, children: undefined, elm: undefined, text: 'foo bar', key: undefined }) }) it('creates an array of children for multiple children', function () { const vnode =
{'foo'}{'bar'}
assert.deepStrictEqual(vnode, { sel: 'div', data: {}, children: [ { sel: undefined, data: undefined, children: undefined, elm: undefined, text: 'foo', key: undefined }, { sel: undefined, data: undefined, children: undefined, elm: undefined, text: 'bar', key: undefined }, ], elm: undefined, text: undefined, key: undefined }) }) it('flattens children', function () { const vnode = (

A Heading

some description {['part1', 'part2'].map(part => {part})}
) assert.deepStrictEqual(vnode, { sel: 'section', data: {}, children: [ { sel: 'h1', data: {}, children: undefined, elm: undefined, text: 'A Heading', key: undefined }, { sel: undefined, data: undefined, children: undefined, elm: undefined, text: 'some description', key: undefined }, { sel: 'span', data: {}, children: undefined, elm: undefined, text: 'part1', key: undefined }, { sel: 'span', data: {}, children: undefined, elm: undefined, text: 'part2', key: undefined }, ], elm: undefined, text: undefined, key: undefined }) }) it('removes falsey children', function () { const showLogin = false const showCaptcha = false const loginAttempts = 0 const userName = '' const profilePic = undefined const isLoggedIn = true const vnode = (
Login Form {showLogin && } {showCaptcha ? : null} {userName} {profilePic} Login Attempts: {loginAttempts} Logged In: {isLoggedIn}
) assert.deepStrictEqual(vnode, { sel: 'div', data: {}, children: [ { sel: undefined, data: undefined, children: undefined, elm: undefined, text: 'Login Form', key: undefined }, { sel: undefined, data: undefined, children: undefined, elm: undefined, text: 'Login Attempts: ', key: undefined }, { sel: undefined, data: undefined, children: undefined, elm: undefined, text: '0', key: undefined }, { sel: undefined, data: undefined, children: undefined, elm: undefined, text: 'Logged In: ', key: undefined }, { sel: undefined, data: undefined, children: undefined, elm: undefined, text: 'true', key: undefined }, ], elm: undefined, text: undefined, key: undefined }) }) it('works with a function component', function () { // workaround linter issue // eslint-disable-next-line @typescript-eslint/no-unused-vars const Part = ({ part }: {part: string}) => {part} const vnode = (
Snabbdom and tsx {['work', 'like', 'a', 'charm!'].map(part => )} {'πŸ’ƒπŸ•ΊπŸŽ‰'}
) assert.deepStrictEqual(vnode, { sel: 'div', data: {}, children: [ { sel: 'a', data: { attrs: { href: 'https://github.com/snabbdom/snabbdom' } }, children: undefined, elm: undefined, text: 'Snabbdom', key: undefined }, { sel: undefined, data: undefined, children: undefined, elm: undefined, text: 'and tsx', key: undefined }, { sel: 'span', data: {}, children: undefined, elm: undefined, text: 'work', key: undefined }, { sel: 'span', data: {}, children: undefined, elm: undefined, text: 'like', key: undefined }, { sel: 'span', data: {}, children: undefined, elm: undefined, text: 'a', key: undefined }, { sel: 'span', data: {}, children: undefined, elm: undefined, text: 'charm!', key: undefined }, { sel: undefined, data: undefined, children: undefined, elm: undefined, text: 'πŸ’ƒπŸ•ΊπŸŽ‰', key: undefined }, ], elm: undefined, text: undefined, key: undefined }) }) }) })