How to use the inferno.createVNode function in inferno

To help you get started, we’ve selected a few inferno examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github infernojs / inferno / packages / inferno / __tests__ / patching.spec.jsx View on Github external
it('Should do nothing if lastVNode strictly equals nextVnode', () => {
    const yar = createVNode(VNodeFlags.HtmlElement, 'div', null, createTextVNode('123'), ChildFlags.HasVNodeChildren, null, null, null);
    const bar = createVNode(VNodeFlags.HtmlElement, 'div', null, createTextVNode('123'), ChildFlags.HasVNodeChildren, null, null, null);
    let foo = createVNode(VNodeFlags.HtmlElement, 'div', null, [bar, yar], ChildFlags.HasNonKeyedChildren, null, null, null);

    render(foo, container);
    expect(container.innerHTML).toEqual('<div><div>123</div><div>123</div></div>');

    foo = createVNode(VNodeFlags.HtmlElement, 'div', null, [bar, yar], ChildFlags.HasNonKeyedChildren, null, null, null);

    render(foo, container);
    expect(container.innerHTML).toEqual('<div><div>123</div><div>123</div></div>');
  });
github infernojs / inferno / packages / inferno-devtools / __tests__ / devtool.spec.tsx View on Github external
expect(devToolRoot._renderedComponent._renderedChildren[1]._renderedChildren[0]._stringText).toBe('1');
    expect(devToolRoot._renderedComponent._renderedChildren[1]._renderedChildren[1]._currentElement).toBe('2');
    expect(devToolRoot._renderedComponent._renderedChildren[1]._renderedChildren[1]._stringText).toBe('2');

    expect(devToolRoot._renderedComponent._renderedChildren[2]._currentElement.type).toBe('div');
    expect(devToolRoot._renderedComponent._renderedChildren[1]._renderedChildren[0]._currentElement).toBe('1');
    expect(devToolRoot._renderedComponent._renderedChildren[2]._renderedChildren[0]._stringText).toBe('1');
    expect(devToolRoot._renderedComponent._renderedChildren[2]._renderedChildren[1]._currentElement).toBe('2');
    expect(devToolRoot._renderedComponent._renderedChildren[2]._renderedChildren[1]._stringText).toBe('2');

    expect(devToolRoot._renderedComponent._renderedChildren[3]._currentElement.type).toBe('div');
    expect(devToolRoot._renderedComponent._renderedChildren[3]._stringText).toBe('1001');

    instance.setState({
      nodes: [
        createVNode(1, 'div', null, 8, 16, null, '1'),
        createVNode(1, 'div', null, [8, 9], 0, null, '2'),
        createVNode(1, 'div', null, [createTextVNode(8), createTextVNode(9)], 0, null, '3'),
        createVNode(1, 'div', null, 899, 16, null, '4')
      ]
    });

    devToolRoot = Mount._instancesByReactRootID[Object.keys(Mount._instancesByReactRootID)[0]];

    expect(devToolRoot._renderedComponent._renderedChildren[0]._currentElement.type).toBe('div');
    expect(devToolRoot._renderedComponent._renderedChildren[0]._stringText).toBe('8');

    expect(devToolRoot._renderedComponent._renderedChildren[1]._currentElement.type).toBe('div');
    expect(devToolRoot._renderedComponent._renderedChildren[1]._renderedChildren[0]._currentElement).toBe('8');
    expect(devToolRoot._renderedComponent._renderedChildren[1]._renderedChildren[0]._stringText).toBe('8');
    expect(devToolRoot._renderedComponent._renderedChildren[1]._renderedChildren[1]._currentElement).toBe('9');
    expect(devToolRoot._renderedComponent._renderedChildren[1]._renderedChildren[1]._stringText).toBe('9');
github infernojs / inferno / packages / inferno-devtools / __tests__ / devtool.spec.tsx View on Github external
expect(devToolRoot._renderedComponent._renderedChildren[1]._renderedChildren[1]._stringText).toBe('2');

    expect(devToolRoot._renderedComponent._renderedChildren[2]._currentElement.type).toBe('div');
    expect(devToolRoot._renderedComponent._renderedChildren[1]._renderedChildren[0]._currentElement).toBe('1');
    expect(devToolRoot._renderedComponent._renderedChildren[2]._renderedChildren[0]._stringText).toBe('1');
    expect(devToolRoot._renderedComponent._renderedChildren[2]._renderedChildren[1]._currentElement).toBe('2');
    expect(devToolRoot._renderedComponent._renderedChildren[2]._renderedChildren[1]._stringText).toBe('2');

    expect(devToolRoot._renderedComponent._renderedChildren[3]._currentElement.type).toBe('div');
    expect(devToolRoot._renderedComponent._renderedChildren[3]._stringText).toBe('1001');

    instance.setState({
      nodes: [
        createVNode(1, 'div', null, 8, 16, null, '1'),
        createVNode(1, 'div', null, [8, 9], 0, null, '2'),
        createVNode(1, 'div', null, [createTextVNode(8), createTextVNode(9)], 0, null, '3'),
        createVNode(1, 'div', null, 899, 16, null, '4')
      ]
    });

    devToolRoot = Mount._instancesByReactRootID[Object.keys(Mount._instancesByReactRootID)[0]];

    expect(devToolRoot._renderedComponent._renderedChildren[0]._currentElement.type).toBe('div');
    expect(devToolRoot._renderedComponent._renderedChildren[0]._stringText).toBe('8');

    expect(devToolRoot._renderedComponent._renderedChildren[1]._currentElement.type).toBe('div');
    expect(devToolRoot._renderedComponent._renderedChildren[1]._renderedChildren[0]._currentElement).toBe('8');
    expect(devToolRoot._renderedComponent._renderedChildren[1]._renderedChildren[0]._stringText).toBe('8');
    expect(devToolRoot._renderedComponent._renderedChildren[1]._renderedChildren[1]._currentElement).toBe('9');
    expect(devToolRoot._renderedComponent._renderedChildren[1]._renderedChildren[1]._stringText).toBe('9');

    expect(devToolRoot._renderedComponent._renderedChildren[2]._currentElement.type).toBe('div');
github aweary / ssr-benchmarks / src / skeleton-inferno.js View on Github external
const ItemSectionGroupWrapper  = ({ content, children }) => {
    return createVNode(66,
      'div',
      { style: { backgroundColor: 'lightblue', border: '1px solid #FF44AA'} }, [
      createVNode(2, 'h2', { className: 'wrapper-tile'}, Math.random() + "wrapper title", null, null, null, true),
      createVNode(2,
        'p',
        { style: {fontSize: 15, color: 'red'} },
        createVNode(4, ItemSectionGroup, { children: children }, null, null, null, null, true)
      , null, null, null, true)
    ], null, null, null, true)
  }
github aweary / ssr-benchmarks / src / skeleton-inferno.js View on Github external
const renderedItems = items.map((item, i) => {
        const el = i % 2 === 0
          ? createVNode(8, Item, item, null, null, null , null, true)
          : createVNode(8, RichItem, item, null, null, null, null, true);
        const section = createVNode(4, ItemSection, { id: i, children: el }, null, null, null, null, true);
        const group = createVNode(4, ItemSectionGroup, { children: section }, null, null, null, null, true);
        return createVNode(8, ItemSectionGroupWrapper, { children: group }, null, null, null, null, true);
      });
      return (
github aweary / ssr-benchmarks / src / skeleton-inferno.js View on Github external
const TitleWrapper = ({ title }) => {
    return createVNode(66,
      'div',
      { style: { border: '10px solid green', color: '#FFDDAA', padding: '10px' }}, [
      createVNode(2,
        'div',
        { className: 'dididididid' },
        "FKSDJFLSDJFDLSKFJDSLKFJSLKDFJLSDKFJ",
        null,
        null,
        true
      ),
      createVNode(4, Title, { title: title }, null, null, null, null, true)
    ], null, null, null, true)
  }
github aweary / ssr-benchmarks / src / skeleton-inferno.js View on Github external
render() {
      return (
        createVNode(2,
          'div',
          { className: 'really-long-and-stupid-class-name'},
          this.props.children,
          null,
          null,
          null,
          true
        )
      )
    }
  }
github infernojs / inferno / packages / inferno-create-element / __benchmarks__ / classcomponents.js View on Github external
class Com extends Component {

			componentWillMount() {
				this.setState({
					foo: 'bar',
					daa: 'jaa',
					c: 'g'
				});
			}

			render() {
				return createVNode(InfernoVNodeFlags.Element, 'div', null, '1');
			}
		}

		render(createVNode(InfernoVNodeFlags.ComponentClass, Com), this.testDiv);
	}, {
		setup: function() {
github infernojs / inferno / packages / inferno-create-element / __benchmarks__ / functionalcomponents.js View on Github external
function Com() {
        return createVNode(InfernoVNodeFlags.Element, "div", null, "1");
      }
github aweary / ssr-benchmarks / src / skeleton-inferno.js View on Github external
const Item = ({ title, content, img }) => {
    const todos = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9].map(i => {
      return createVNode(2, 'li', { id: `todo-${i}`}, i, null, null, null, true);
    });
    return createVNode(66,
      'div',
      { className: "item" }, [
      createVNode(8, TitleWrapper, { title }, null, null, null, null, true),
      createVNode(2, 'p', {className: "item-content"}, content, null, null, null, true),
      createVNode(8, Image, { src: img }, null, null, null, null, true),
      createVNode(66, 'ul', { className: 'list'}, todos, null, null, null, true)
    ], null, null, null, true)
  }