diff --git a/src/compiler/checker.ts b/src/compiler/checker.ts
index 39e9a0dd67c4c..82f8ad2a74fbc 100644
--- a/src/compiler/checker.ts
+++ b/src/compiler/checker.ts
@@ -18764,6 +18764,7 @@ namespace ts {
                     // Fake up a property declaration for the children
                     childrenPropSymbol.valueDeclaration = createPropertySignature(/*modifiers*/ undefined, unescapeLeadingUnderscores(jsxChildrenPropertyName), /*questionToken*/ undefined, /*type*/ undefined, /*initializer*/ undefined);
                     childrenPropSymbol.valueDeclaration.parent = attributes;
+                    childrenPropSymbol.valueDeclaration.original = parent;
                     childrenPropSymbol.valueDeclaration.symbol = childrenPropSymbol;
                     const childPropMap = createSymbolTable();
                     childPropMap.set(jsxChildrenPropertyName, childrenPropSymbol);
@@ -20307,6 +20308,7 @@ namespace ts {
 
         function createSyntheticExpression(parent: Node, type: Type | ((mode: CheckMode | undefined) => Type), isSpread?: boolean) {
             const result = <SyntheticExpression>createNode(SyntaxKind.SyntheticExpression, parent.pos, parent.end);
+            result.original = parent;
             result.parent = parent;
             result.type = type;
             result.isSpread = isSpread || false;
diff --git a/src/compiler/utilities.ts b/src/compiler/utilities.ts
index aa2ebe3d60c07..a356c1bdcb477 100644
--- a/src/compiler/utilities.ts
+++ b/src/compiler/utilities.ts
@@ -312,10 +312,11 @@ namespace ts {
     export function getSourceFileOfNode(node: Node): SourceFile;
     export function getSourceFileOfNode(node: Node | undefined): SourceFile | undefined;
     export function getSourceFileOfNode(node: Node): SourceFile {
+        const root = node;
         while (node && node.kind !== SyntaxKind.SourceFile) {
             node = node.parent;
         }
-        return <SourceFile>node;
+        return <SourceFile>node || (root && root.original && getSourceFileOfNode(root.original));
     }
 
     export function isStatementWithLocals(node: Node) {
@@ -849,6 +850,9 @@ namespace ts {
     }
 
     export function getErrorSpanForNode(sourceFile: SourceFile, node: Node): TextSpan {
+        while (node.original) {
+            node = node.original;
+        }
         let errorNode: Node | undefined = node;
         switch (node.kind) {
             case SyntaxKind.SourceFile:
@@ -2927,6 +2931,7 @@ namespace ts {
             case SyntaxKind.TemplateExpression:
             case SyntaxKind.ParenthesizedExpression:
             case SyntaxKind.OmittedExpression:
+            case SyntaxKind.SyntheticExpression:
                 return 20;
 
             default:
diff --git a/tests/baselines/reference/petitDomSimpleJsx.js b/tests/baselines/reference/petitDomSimpleJsx.js
new file mode 100644
index 0000000000000..667d791002bcf
--- /dev/null
+++ b/tests/baselines/reference/petitDomSimpleJsx.js
@@ -0,0 +1,870 @@
+//// [tests/cases/compiler/petitDomSimpleJsx.tsx] ////
+
+//// [index.d.ts]
+// Modified type definitions for Petit-Dom 0.2
+// Project: https://github.com/yelouafi/petit-dom
+// Definitions by: James Messinger <https://github.com/JamesMessinger>, modified by @weswigham for testing
+// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
+// TypeScript Version: 3.4
+
+/**
+ * Creates a VNode of the specified HTML Element type and with the
+ * specified properties and contents.
+ *
+ * @param type - The tag name of element to create
+ * @param props - Properties to set on the element
+ * @param ...children - Child nodes
+ * @returns A new VNode object
+ */
+export function h<T extends keyof ElementTagNameMap, E extends ElementTagNameMap[T]>(
+    type: T,
+    props?: PetitDom.Props<E> | null,
+    ...children: ReadonlyArray<PetitDom.Content>
+): PetitDom.ElementNode<T, E>;
+
+/**
+ * Creates a VNode using a PetitDom component object.
+ *
+ * @param type - A PetitDom component object
+ * @param props - Properties to set on the component
+ * @param ...children - Child nodes
+ * @returns A new VNode object
+ */
+export function h<P extends PetitDom.ComponentProps = PetitDom.ComponentProps>(
+    type: PetitDom.Component<P>,
+    props?: (P & PetitDom.IntrinsicProps) | null,
+    ...children: ReadonlyArray<PetitDom.Content>
+): PetitDom.ComponentNode<P>;
+
+/**
+ * Creates a VNode using a PetitDom component class.
+ *
+ * @param type - A PetitDom component class
+ * @param props - Properties to set on the component
+ * @param ...children - Child nodes
+ * @returns A new VNode object
+ */
+export function h<P extends PetitDom.ComponentProps = PetitDom.ComponentProps>(
+    type: PetitDom.ComponentClass<P>,
+    props?: (P & PetitDom.IntrinsicProps) | null,
+    ...children: ReadonlyArray<PetitDom.Content>
+): PetitDom.ComponentClassNode<P>;
+
+/**
+ * Creates a VNode using a PetitDom function component.
+ *
+ * This function is compatible with both JSX and HyperScript syntax.
+ *
+ * @param type - A PetitDom function component
+ * @param props - Properties to set on the component
+ * @param ...children - Child nodes
+ * @returns A new VNode object
+ */
+export function h<P extends PetitDom.ComponentProps = PetitDom.ComponentProps>(
+    type: PetitDom.FunctionComponent<P>,
+    props?: (P & PetitDom.IntrinsicProps) | null,
+    ...children: ReadonlyArray<PetitDom.Content>
+): PetitDom.FunctionComponentNode<P>;
+
+/**
+ * Creates actual DOM Elements for the given VNode and its children.
+ *
+ * @param vnode - The VNode object to mount
+ * @returns The newly-created DOM element
+ */
+export function mount(vnode: PetitDom.VNode): Element;
+
+/**
+ * Diffs two VNodes and applies the necessary DOM changes
+ *
+ * @param newVNode - The new VNode object, which will be mounted to the DOM element of oldVNode
+ * @param oldVNode - The old VNode object to diff against
+ * @param parent - The parent DOM element. Used internally by PetitDom to recursively patch child nodes
+ * @returns The updated DOM element. This element is also moved from oldVNode to newVNode
+ */
+export function patch(newVNode: PetitDom.VNode, oldVNode: PetitDom.VNode, parent?: Element): Element;
+
+/**
+ * Removes the given VNode from the actual DOM
+ *
+ * @param vnode - The VNode object to unmount
+ */
+export function unmount(vnode: PetitDom.VNode): void;
+
+export namespace PetitDom {
+    type Key = string | number;
+    type ComponentProps = object;
+    interface ContentArray extends ReadonlyArray<Content> {}
+    type Content = string | VNode | ContentArray;
+
+    type DOMElementProps<E extends Element> = {
+        [P in keyof E]?: E[P];
+    };
+
+    interface IntrinsicProps {
+        content?: Content | ReadonlyArray<Content>;
+        key?: Key;
+    }
+
+    type Props<E extends Element = Element> = IntrinsicProps & DOMElementProps<E>;
+
+    type ShouldUpdate<P extends ComponentProps> = (
+        newProps: P,
+        oldProps: P,
+        newContent: ReadonlyArray<VNode>,
+        oldContent: ReadonlyArray<VNode>
+    ) => boolean;
+
+    interface FunctionComponent<P extends ComponentProps> {
+        (props: P, content: ReadonlyArray<Content>): FunctionComponentNode<P>;
+        shouldUpdate?: ShouldUpdate<P>;
+    }
+
+    interface ComponentClass<P extends ComponentProps> {
+        new(props: P, content: ReadonlyArray<Content>): Component<P>;
+    }
+
+    interface Component<P extends ComponentProps> {
+        mount(props: P, content: ReadonlyArray<VNode>): Element;
+        patch(element: Element, newProps: P, oldProps: P, newContent: ReadonlyArray<VNode>, oldContent: ReadonlyArray<VNode>): Element;
+        unmount(element: Element): void;
+    }
+
+    interface VNode {
+        readonly isSVG: boolean;
+        readonly type: any;
+        readonly key: Key | null;
+        readonly props: any;
+        readonly content: ReadonlyArray<VNode>;
+    }
+
+    interface ElementNode<T extends keyof DomElements, E extends DomElements[T]> extends VNode {
+        readonly type: T;
+        readonly props: Props<E>;
+    }
+
+    interface ComponentNode<P extends ComponentProps> extends VNode {
+        readonly type: Component<P>;
+        readonly props: P & IntrinsicProps;
+    }
+
+    interface ComponentClassNode<P extends ComponentProps> extends VNode {
+        readonly type: ComponentClass<P>;
+        readonly props: P & IntrinsicProps;
+    }
+
+    interface FunctionComponentNode<P extends ComponentProps> extends VNode {
+        readonly type: FunctionComponent<P>;
+        readonly props: P & IntrinsicProps;
+    }
+
+    interface DomElements extends HTMLElementTagNameMap, SVGElementTagNameMap {
+        "main": HTMLMainElement;
+    }
+}
+
+declare global {
+    namespace JSX {
+        // tslint:disable-next-line:no-empty-interface
+        interface Element extends PetitDom.VNode { }
+
+        // tslint:disable-next-line:no-empty-interface
+        interface ElementClass extends PetitDom.Component<PetitDom.ComponentProps> { }
+
+        // tslint:disable-next-line:no-empty-interface
+        interface IntrinsicClassAttributes<T> extends PetitDom.Props { }
+
+        // tslint:disable-next-line:no-empty-interface
+        interface IntrinsicAttributes extends PetitDom.IntrinsicProps { }
+
+        interface ElementAttributesProperty { props: PetitDom.Props; }
+
+        interface ElementChildrenAttribute { content: PetitDom.VNode[]; }
+
+        type IntrinsicElements = {
+            [P in keyof PetitDom.DomElements]:
+            PetitDom.Props<PetitDom.DomElements[P]> &
+            {
+                content?: PetitDom.Content | ReadonlyArray<PetitDom.Content>;
+            };
+        };
+    }
+}
+
+//// [petit-dom-tests.tsx]
+/* @jsx h */
+// tslint:disable:no-empty
+// tslint:disable:no-null-keyword
+
+import { h, mount, patch, PetitDom, unmount } from "petit-dom";
+
+function assertEqual<T>(a: T, b: T) { }
+
+function eventHandler(event: Event): void { }
+
+interface CustomProps {
+    name: string;
+    count: number;
+    onSomeEvent(event: Event): void;
+}
+
+/**
+ * Create an <a> element with text content, using HyperScript syntax and JSX syntax
+ */
+export function testHtmlElementWithTextContent() {
+    // HyperScript syntax returns an ElementNode<T> object, with typed properties
+    const aNode = h("a", { href: "link", onclick: eventHandler }, "click here");
+
+    assertEqual(aNode.isSVG, false);
+    assertEqual(aNode.type, "a");
+    assertEqual(aNode.key, null);
+    assertEqual(aNode.props.href, "link");
+    assertEqual(aNode.props.onclick, eventHandler);
+    assertEqual(aNode.content.length, 1);
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = <a href="link" onclick={eventHandler}>click here</a>;
+    const jsxNodeType = jsxNode.type as string;
+    const jsxNodeProps = jsxNode.props as PetitDom.Props<HTMLAnchorElement>;
+
+    assertEqual(jsxNode.isSVG, false);
+    assertEqual(jsxNodeType, "a");
+    assertEqual(jsxNode.key, null);
+    assertEqual(jsxNodeProps.href, "link");
+    assertEqual(jsxNodeProps.onclick, eventHandler);
+    assertEqual(jsxNode.content.length, 1);
+}
+
+/**
+ * Create a <form> element with both text content and child elements, using HyperScript syntax and JSX syntax
+ */
+export function testHtmlElementWithMixedContent() {
+    // HyperScript syntax returns an ElementNode<T> object, with typed properties
+    const formNode = h(
+        "form",
+        { key: 1, method: "POST", onsubmit: eventHandler },
+        "Hello ", h("span", null, "World")
+    );
+
+    assertEqual(formNode.isSVG, false);
+    assertEqual(formNode.type, "form");
+    assertEqual(formNode.key, 1);
+    assertEqual(formNode.props.method, "POST");
+    assertEqual(formNode.props.onsubmit, eventHandler);
+    assertEqual(formNode.content.length, 2);
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = <form key={1} method="POST" onsubmit={eventHandler}>Hello <span>World</span></form>;
+    const jsxNodeType = jsxNode.type as string;
+    const jsxNodeProps = jsxNode.props as PetitDom.Props<HTMLFormElement>;
+
+    assertEqual(jsxNode.isSVG, false);
+    assertEqual(jsxNodeType, "form");
+    assertEqual(jsxNode.key, 1);
+    assertEqual(jsxNodeProps.method, "POST");
+    assertEqual(jsxNodeProps.onsubmit, eventHandler);
+    assertEqual(jsxNode.content.length, 2);
+}
+
+/**
+ * Create an <svg> element with a child element, using HyperScript syntax and JSX syntax
+ */
+export function testSvgElementWithChild() {
+    // HyperScript syntax returns an ElementNode<T> object, with typed properties
+    const svgNode = h("svg", { key: 2, currentScale: 1 }, h("path"));
+
+    assertEqual(svgNode.isSVG, true);
+    assertEqual(svgNode.type, "svg");
+    assertEqual(svgNode.key, 2);
+    assertEqual(svgNode.props.currentScale, 1);
+    assertEqual(svgNode.content.length, 1);
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = <svg key={2} currentScale={1}><path /></svg>;
+    const jsxNodeType = jsxNode.type as string;
+    const jsxNodeProps = jsxNode.props as PetitDom.Props<SVGSVGElement>;
+
+    assertEqual(jsxNode.isSVG, true);
+    assertEqual(jsxNodeType, "svg");
+    assertEqual(jsxNode.key, 2);
+    assertEqual(jsxNodeProps.currentScale, 1);
+    assertEqual(jsxNode.content.length, 1);
+}
+
+/**
+ * Create a function component, using HyperScript syntax and JSX syntax
+ */
+export function testFunctionComponent() {
+    function FunctionComponent(): JSX.Element {
+        return <div>Hello World</div>;
+    }
+
+    // HyperScript syntax returns a FunctionComponentNode<T> object, with typed properties
+    const node = h(FunctionComponent, { key: "1" });
+
+    assertEqual(node.isSVG, false);
+    assertEqual(node.type, FunctionComponent);
+    assertEqual(node.key, "1");
+    assertEqual(node.props.key, "1");
+    assertEqual(node.content.length, 0);
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = <FunctionComponent key="1" />;
+    const jsxNodeType = jsxNode.type as PetitDom.FunctionComponent<{}>;
+    const jsxNodeProps = jsxNode.props as PetitDom.IntrinsicProps;
+
+    assertEqual(jsxNode.isSVG, false);
+    assertEqual(jsxNodeType, FunctionComponent);
+    assertEqual(jsxNode.key, "1");
+    assertEqual(jsxNodeProps.key, "1");
+    assertEqual(jsxNode.content.length, 0);
+}
+
+/**
+ * Create a function component with props, using HyperScript syntax and JSX syntax
+ */
+export function testFunctionComponentWithProps() {
+    function FunctionComponentWithProps(props: CustomProps): JSX.Element {
+        const { name, count, onSomeEvent } = props;
+        return <div className={name} tabIndex={count} onclick={onSomeEvent}></div>;
+    }
+
+    // HyperScript syntax returns a FunctionComponentNode<T> object, with typed properties
+    const node = h(FunctionComponentWithProps, { name: "xyz", count: 123, onSomeEvent: eventHandler });
+
+    assertEqual(node.isSVG, false);
+    assertEqual(node.type, FunctionComponentWithProps);
+    assertEqual(node.key, null);
+    assertEqual(node.props.name, "xyz");
+    assertEqual(node.props.count, 123);
+    assertEqual(node.props.onSomeEvent, eventHandler);
+    assertEqual(node.content.length, 0);
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = <FunctionComponentWithProps name="xyz" count={123} onSomeEvent={eventHandler} />;
+    const jsxNodeType = jsxNode.type as PetitDom.FunctionComponent<CustomProps>;
+    const jsxNodeProps = jsxNode.props as CustomProps;
+
+    assertEqual(jsxNode.isSVG, false);
+    assertEqual(jsxNodeType, FunctionComponentWithProps);
+    assertEqual(jsxNode.key, null);
+    assertEqual(jsxNodeProps.name, "xyz");
+    assertEqual(jsxNodeProps.count, 123);
+    assertEqual(jsxNodeProps.onSomeEvent, eventHandler);
+    assertEqual(jsxNode.content.length, 0);
+}
+
+/**
+ * Create a function component with child content, using HyperScript syntax and JSX syntax
+ */
+export function testFunctionComponentWithChildren() {
+    function FunctionComponentWithChildren(props: CustomProps, content: ReadonlyArray<PetitDom.Content>): JSX.Element {
+        const { name, count, onSomeEvent } = props;
+        return <div className={name} tabIndex={count} onclick={onSomeEvent}>{content}</div>;
+    }
+
+    // HyperScript syntax returns a FunctionComponentNode<T> object, with typed properties
+    const node = h(
+        FunctionComponentWithChildren,
+        { name: "xyz", count: 123, onSomeEvent: eventHandler },
+        "Hello",
+        h("span", null, "World")
+    );
+
+    assertEqual(node.isSVG, false);
+    assertEqual(node.type, FunctionComponentWithChildren);
+    assertEqual(node.key, null);
+    assertEqual(node.props.name, "xyz");
+    assertEqual(node.props.count, 123);
+    assertEqual(node.props.onSomeEvent, eventHandler);
+    assertEqual(node.content.length, 2);
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = (
+        <FunctionComponentWithChildren name="xyz" count={123} onSomeEvent={eventHandler}>
+            Hello <span>World</span>
+        </FunctionComponentWithChildren>
+    );
+    const jsxNodeType = jsxNode.type as PetitDom.FunctionComponent<CustomProps>;
+    const jsxNodeProps = jsxNode.props as CustomProps;
+
+    assertEqual(jsxNode.isSVG, false);
+    assertEqual(jsxNodeType, FunctionComponentWithChildren);
+    assertEqual(jsxNode.key, null);
+    assertEqual(jsxNodeProps.name, "xyz");
+    assertEqual(jsxNodeProps.count, 123);
+    assertEqual(jsxNodeProps.onSomeEvent, eventHandler);
+    assertEqual(jsxNode.content.length, 2);
+}
+
+/**
+ * Create a component class, using HyperScript syntax and JSX syntax
+ */
+export function testComponentClass() {
+    class ComponentClass {
+        props = {};
+
+        mount(): Element {
+            return mount(<div className="some-class"></div>);
+        }
+
+        patch(element: Element, newProps: object, oldProps: object, newContent: ReadonlyArray<PetitDom.VNode>, oldContent: ReadonlyArray<PetitDom.VNode>): Element {
+            patch(
+                <div {...oldProps}>{oldContent}</div>,
+                <div {...newProps}>{newContent}</div>
+            );
+            return element;
+        }
+
+        unmount(element: Element): void {
+            unmount(<div>Hello World</div>);
+        }
+    }
+
+    // HyperScript syntax returns a ComponentClassNode<T> object, with typed properties
+    const node = h(ComponentClass, { key: "1" });
+
+    assertEqual(node.isSVG, false);
+    assertEqual(node.type, ComponentClass);
+    assertEqual(node.key, "1");
+    assertEqual(node.props.key, "1");
+    assertEqual(node.content.length, 0);
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = <ComponentClass key="1" />;
+    const jsxNodeType = jsxNode.type as PetitDom.ComponentClass<{}>;
+    const jsxNodeProps = jsxNode.props as PetitDom.IntrinsicProps;
+
+    assertEqual(jsxNode.isSVG, false);
+    assertEqual(jsxNodeType, ComponentClass);
+    assertEqual(jsxNode.key, "1");
+    assertEqual(jsxNodeProps.key, "1");
+    assertEqual(jsxNode.content.length, 0);
+}
+
+/**
+ * Create a component class with props, using HyperScript syntax and JSX syntax
+ */
+export function testComponentClassWithProps() {
+    class ComponentClassWithProps {
+        props: CustomProps;
+
+        constructor(props: CustomProps) {
+            this.props = props;
+        }
+
+        mount(props: CustomProps): Element {
+            const { name, count, onSomeEvent } = props;
+            return mount(<div className={name} tabIndex={count} onclick={onSomeEvent} />);
+        }
+
+        patch(element: Element, newProps: CustomProps, oldProps: CustomProps, newContent: ReadonlyArray<PetitDom.VNode>, oldContent: ReadonlyArray<PetitDom.VNode>): Element {
+            patch(
+                <div {...oldProps}>{oldContent}</div>,
+                <div {...newProps}>{newContent}</div>
+            );
+            return element;
+        }
+
+        unmount(element: Element): void {
+            unmount(<div> Hello World</div >);
+        }
+    }
+
+    // HyperScript syntax returns a ComponentClassNode<T> object, with typed properties
+    const node = h(ComponentClassWithProps, { name: "xyz", count: 123, onSomeEvent: eventHandler });
+
+    assertEqual(node.isSVG, false);
+    assertEqual(node.type, ComponentClassWithProps);
+    assertEqual(node.key, null);
+    assertEqual(node.props.name, "xyz");
+    assertEqual(node.props.count, 123);
+    assertEqual(node.props.onSomeEvent, eventHandler);
+    assertEqual(node.content.length, 0);
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = <ComponentClassWithProps name="xyz" count={123} onSomeEvent={eventHandler} />;
+    const jsxNodeType = jsxNode.type as PetitDom.ComponentClass<CustomProps>;
+    const jsxNodeProps = jsxNode.props as CustomProps;
+
+    assertEqual(jsxNode.isSVG, false);
+    assertEqual(jsxNodeType, ComponentClassWithProps);
+    assertEqual(jsxNode.key, null);
+    assertEqual(jsxNodeProps.name, "xyz");
+    assertEqual(jsxNodeProps.count, 123);
+    assertEqual(jsxNodeProps.onSomeEvent, eventHandler);
+    assertEqual(jsxNode.content.length, 0);
+}
+
+/**
+ * Create a component class with child content, using HyperScript syntax and JSX syntax
+ */
+export function testComponentClassWithChildren() {
+    class ComponentClassWithChildren {
+        props: CustomProps;
+
+        constructor(props: CustomProps) {
+            this.props = props;
+        }
+
+        mount(props: CustomProps, content: ReadonlyArray<PetitDom.Content>): Element {
+            const { name, count, onSomeEvent } = props;
+            return mount(
+                <div className={name} tabIndex={count} onclick={onSomeEvent}>{content}</div>
+            );
+        }
+
+        patch(element: Element, newProps: CustomProps, oldProps: CustomProps, newContent: ReadonlyArray<PetitDom.VNode>, oldContent: ReadonlyArray<PetitDom.VNode>): Element {
+            patch(
+                <div {...oldProps}>{oldContent}</div>,
+                <div {...newProps}>{newContent}</div>
+            );
+            return element;
+        }
+
+        unmount(element: Element): void {
+            unmount(<div> Hello World</div >);
+        }
+    }
+
+    // HyperScript syntax returns a ComponentClassNode<T> object, with typed properties
+    const node = h(
+        ComponentClassWithChildren,
+        { name: "xyz", count: 123, onSomeEvent: eventHandler },
+        "Hello",
+        h("span", null, "World")
+    );
+
+    assertEqual(node.isSVG, false);
+    assertEqual(node.type, ComponentClassWithChildren);
+    assertEqual(node.key, null);
+    assertEqual(node.props.name, "xyz");
+    assertEqual(node.props.count, 123);
+    assertEqual(node.props.onSomeEvent, eventHandler);
+    assertEqual(node.content.length, 2);
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = (
+        <ComponentClassWithChildren name="xyz" count={123} onSomeEvent={eventHandler}>
+            Hello <span>World</span>
+        </ComponentClassWithChildren>
+    );
+    const jsxNodeType = jsxNode.type as PetitDom.ComponentClass<CustomProps>;
+    const jsxNodeProps = jsxNode.props as CustomProps;
+
+    assertEqual(jsxNode.isSVG, false);
+    assertEqual(jsxNodeType, ComponentClassWithChildren);
+    assertEqual(jsxNode.key, null);
+    assertEqual(jsxNodeProps.name, "xyz");
+    assertEqual(jsxNodeProps.count, 123);
+    assertEqual(jsxNodeProps.onSomeEvent, eventHandler);
+    assertEqual(jsxNode.content.length, 2);
+}
+
+
+//// [petit-dom-tests.js]
+"use strict";
+/* @jsx h */
+// tslint:disable:no-empty
+// tslint:disable:no-null-keyword
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+exports.__esModule = true;
+var petit_dom_1 = require("petit-dom");
+function assertEqual(a, b) { }
+function eventHandler(event) { }
+/**
+ * Create an <a> element with text content, using HyperScript syntax and JSX syntax
+ */
+function testHtmlElementWithTextContent() {
+    // HyperScript syntax returns an ElementNode<T> object, with typed properties
+    var aNode = petit_dom_1.h("a", { href: "link", onclick: eventHandler }, "click here");
+    assertEqual(aNode.isSVG, false);
+    assertEqual(aNode.type, "a");
+    assertEqual(aNode.key, null);
+    assertEqual(aNode.props.href, "link");
+    assertEqual(aNode.props.onclick, eventHandler);
+    assertEqual(aNode.content.length, 1);
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    var jsxNode = petit_dom_1.h("a", { href: "link", onclick: eventHandler }, "click here");
+    var jsxNodeType = jsxNode.type;
+    var jsxNodeProps = jsxNode.props;
+    assertEqual(jsxNode.isSVG, false);
+    assertEqual(jsxNodeType, "a");
+    assertEqual(jsxNode.key, null);
+    assertEqual(jsxNodeProps.href, "link");
+    assertEqual(jsxNodeProps.onclick, eventHandler);
+    assertEqual(jsxNode.content.length, 1);
+}
+exports.testHtmlElementWithTextContent = testHtmlElementWithTextContent;
+/**
+ * Create a <form> element with both text content and child elements, using HyperScript syntax and JSX syntax
+ */
+function testHtmlElementWithMixedContent() {
+    // HyperScript syntax returns an ElementNode<T> object, with typed properties
+    var formNode = petit_dom_1.h("form", { key: 1, method: "POST", onsubmit: eventHandler }, "Hello ", petit_dom_1.h("span", null, "World"));
+    assertEqual(formNode.isSVG, false);
+    assertEqual(formNode.type, "form");
+    assertEqual(formNode.key, 1);
+    assertEqual(formNode.props.method, "POST");
+    assertEqual(formNode.props.onsubmit, eventHandler);
+    assertEqual(formNode.content.length, 2);
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    var jsxNode = petit_dom_1.h("form", { key: 1, method: "POST", onsubmit: eventHandler },
+        "Hello ",
+        petit_dom_1.h("span", null, "World"));
+    var jsxNodeType = jsxNode.type;
+    var jsxNodeProps = jsxNode.props;
+    assertEqual(jsxNode.isSVG, false);
+    assertEqual(jsxNodeType, "form");
+    assertEqual(jsxNode.key, 1);
+    assertEqual(jsxNodeProps.method, "POST");
+    assertEqual(jsxNodeProps.onsubmit, eventHandler);
+    assertEqual(jsxNode.content.length, 2);
+}
+exports.testHtmlElementWithMixedContent = testHtmlElementWithMixedContent;
+/**
+ * Create an <svg> element with a child element, using HyperScript syntax and JSX syntax
+ */
+function testSvgElementWithChild() {
+    // HyperScript syntax returns an ElementNode<T> object, with typed properties
+    var svgNode = petit_dom_1.h("svg", { key: 2, currentScale: 1 }, petit_dom_1.h("path"));
+    assertEqual(svgNode.isSVG, true);
+    assertEqual(svgNode.type, "svg");
+    assertEqual(svgNode.key, 2);
+    assertEqual(svgNode.props.currentScale, 1);
+    assertEqual(svgNode.content.length, 1);
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    var jsxNode = petit_dom_1.h("svg", { key: 2, currentScale: 1 },
+        petit_dom_1.h("path", null));
+    var jsxNodeType = jsxNode.type;
+    var jsxNodeProps = jsxNode.props;
+    assertEqual(jsxNode.isSVG, true);
+    assertEqual(jsxNodeType, "svg");
+    assertEqual(jsxNode.key, 2);
+    assertEqual(jsxNodeProps.currentScale, 1);
+    assertEqual(jsxNode.content.length, 1);
+}
+exports.testSvgElementWithChild = testSvgElementWithChild;
+/**
+ * Create a function component, using HyperScript syntax and JSX syntax
+ */
+function testFunctionComponent() {
+    function FunctionComponent() {
+        return petit_dom_1.h("div", null, "Hello World");
+    }
+    // HyperScript syntax returns a FunctionComponentNode<T> object, with typed properties
+    var node = petit_dom_1.h(FunctionComponent, { key: "1" });
+    assertEqual(node.isSVG, false);
+    assertEqual(node.type, FunctionComponent);
+    assertEqual(node.key, "1");
+    assertEqual(node.props.key, "1");
+    assertEqual(node.content.length, 0);
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    var jsxNode = petit_dom_1.h(FunctionComponent, { key: "1" });
+    var jsxNodeType = jsxNode.type;
+    var jsxNodeProps = jsxNode.props;
+    assertEqual(jsxNode.isSVG, false);
+    assertEqual(jsxNodeType, FunctionComponent);
+    assertEqual(jsxNode.key, "1");
+    assertEqual(jsxNodeProps.key, "1");
+    assertEqual(jsxNode.content.length, 0);
+}
+exports.testFunctionComponent = testFunctionComponent;
+/**
+ * Create a function component with props, using HyperScript syntax and JSX syntax
+ */
+function testFunctionComponentWithProps() {
+    function FunctionComponentWithProps(props) {
+        var name = props.name, count = props.count, onSomeEvent = props.onSomeEvent;
+        return petit_dom_1.h("div", { className: name, tabIndex: count, onclick: onSomeEvent });
+    }
+    // HyperScript syntax returns a FunctionComponentNode<T> object, with typed properties
+    var node = petit_dom_1.h(FunctionComponentWithProps, { name: "xyz", count: 123, onSomeEvent: eventHandler });
+    assertEqual(node.isSVG, false);
+    assertEqual(node.type, FunctionComponentWithProps);
+    assertEqual(node.key, null);
+    assertEqual(node.props.name, "xyz");
+    assertEqual(node.props.count, 123);
+    assertEqual(node.props.onSomeEvent, eventHandler);
+    assertEqual(node.content.length, 0);
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    var jsxNode = petit_dom_1.h(FunctionComponentWithProps, { name: "xyz", count: 123, onSomeEvent: eventHandler });
+    var jsxNodeType = jsxNode.type;
+    var jsxNodeProps = jsxNode.props;
+    assertEqual(jsxNode.isSVG, false);
+    assertEqual(jsxNodeType, FunctionComponentWithProps);
+    assertEqual(jsxNode.key, null);
+    assertEqual(jsxNodeProps.name, "xyz");
+    assertEqual(jsxNodeProps.count, 123);
+    assertEqual(jsxNodeProps.onSomeEvent, eventHandler);
+    assertEqual(jsxNode.content.length, 0);
+}
+exports.testFunctionComponentWithProps = testFunctionComponentWithProps;
+/**
+ * Create a function component with child content, using HyperScript syntax and JSX syntax
+ */
+function testFunctionComponentWithChildren() {
+    function FunctionComponentWithChildren(props, content) {
+        var name = props.name, count = props.count, onSomeEvent = props.onSomeEvent;
+        return petit_dom_1.h("div", { className: name, tabIndex: count, onclick: onSomeEvent }, content);
+    }
+    // HyperScript syntax returns a FunctionComponentNode<T> object, with typed properties
+    var node = petit_dom_1.h(FunctionComponentWithChildren, { name: "xyz", count: 123, onSomeEvent: eventHandler }, "Hello", petit_dom_1.h("span", null, "World"));
+    assertEqual(node.isSVG, false);
+    assertEqual(node.type, FunctionComponentWithChildren);
+    assertEqual(node.key, null);
+    assertEqual(node.props.name, "xyz");
+    assertEqual(node.props.count, 123);
+    assertEqual(node.props.onSomeEvent, eventHandler);
+    assertEqual(node.content.length, 2);
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    var jsxNode = (petit_dom_1.h(FunctionComponentWithChildren, { name: "xyz", count: 123, onSomeEvent: eventHandler },
+        "Hello ",
+        petit_dom_1.h("span", null, "World")));
+    var jsxNodeType = jsxNode.type;
+    var jsxNodeProps = jsxNode.props;
+    assertEqual(jsxNode.isSVG, false);
+    assertEqual(jsxNodeType, FunctionComponentWithChildren);
+    assertEqual(jsxNode.key, null);
+    assertEqual(jsxNodeProps.name, "xyz");
+    assertEqual(jsxNodeProps.count, 123);
+    assertEqual(jsxNodeProps.onSomeEvent, eventHandler);
+    assertEqual(jsxNode.content.length, 2);
+}
+exports.testFunctionComponentWithChildren = testFunctionComponentWithChildren;
+/**
+ * Create a component class, using HyperScript syntax and JSX syntax
+ */
+function testComponentClass() {
+    var ComponentClass = /** @class */ (function () {
+        function ComponentClass() {
+            this.props = {};
+        }
+        ComponentClass.prototype.mount = function () {
+            return petit_dom_1.mount(petit_dom_1.h("div", { className: "some-class" }));
+        };
+        ComponentClass.prototype.patch = function (element, newProps, oldProps, newContent, oldContent) {
+            petit_dom_1.patch(petit_dom_1.h("div", __assign({}, oldProps), oldContent), petit_dom_1.h("div", __assign({}, newProps), newContent));
+            return element;
+        };
+        ComponentClass.prototype.unmount = function (element) {
+            petit_dom_1.unmount(petit_dom_1.h("div", null, "Hello World"));
+        };
+        return ComponentClass;
+    }());
+    // HyperScript syntax returns a ComponentClassNode<T> object, with typed properties
+    var node = petit_dom_1.h(ComponentClass, { key: "1" });
+    assertEqual(node.isSVG, false);
+    assertEqual(node.type, ComponentClass);
+    assertEqual(node.key, "1");
+    assertEqual(node.props.key, "1");
+    assertEqual(node.content.length, 0);
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    var jsxNode = petit_dom_1.h(ComponentClass, { key: "1" });
+    var jsxNodeType = jsxNode.type;
+    var jsxNodeProps = jsxNode.props;
+    assertEqual(jsxNode.isSVG, false);
+    assertEqual(jsxNodeType, ComponentClass);
+    assertEqual(jsxNode.key, "1");
+    assertEqual(jsxNodeProps.key, "1");
+    assertEqual(jsxNode.content.length, 0);
+}
+exports.testComponentClass = testComponentClass;
+/**
+ * Create a component class with props, using HyperScript syntax and JSX syntax
+ */
+function testComponentClassWithProps() {
+    var ComponentClassWithProps = /** @class */ (function () {
+        function ComponentClassWithProps(props) {
+            this.props = props;
+        }
+        ComponentClassWithProps.prototype.mount = function (props) {
+            var name = props.name, count = props.count, onSomeEvent = props.onSomeEvent;
+            return petit_dom_1.mount(petit_dom_1.h("div", { className: name, tabIndex: count, onclick: onSomeEvent }));
+        };
+        ComponentClassWithProps.prototype.patch = function (element, newProps, oldProps, newContent, oldContent) {
+            petit_dom_1.patch(petit_dom_1.h("div", __assign({}, oldProps), oldContent), petit_dom_1.h("div", __assign({}, newProps), newContent));
+            return element;
+        };
+        ComponentClassWithProps.prototype.unmount = function (element) {
+            petit_dom_1.unmount(petit_dom_1.h("div", null, " Hello World"));
+        };
+        return ComponentClassWithProps;
+    }());
+    // HyperScript syntax returns a ComponentClassNode<T> object, with typed properties
+    var node = petit_dom_1.h(ComponentClassWithProps, { name: "xyz", count: 123, onSomeEvent: eventHandler });
+    assertEqual(node.isSVG, false);
+    assertEqual(node.type, ComponentClassWithProps);
+    assertEqual(node.key, null);
+    assertEqual(node.props.name, "xyz");
+    assertEqual(node.props.count, 123);
+    assertEqual(node.props.onSomeEvent, eventHandler);
+    assertEqual(node.content.length, 0);
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    var jsxNode = petit_dom_1.h(ComponentClassWithProps, { name: "xyz", count: 123, onSomeEvent: eventHandler });
+    var jsxNodeType = jsxNode.type;
+    var jsxNodeProps = jsxNode.props;
+    assertEqual(jsxNode.isSVG, false);
+    assertEqual(jsxNodeType, ComponentClassWithProps);
+    assertEqual(jsxNode.key, null);
+    assertEqual(jsxNodeProps.name, "xyz");
+    assertEqual(jsxNodeProps.count, 123);
+    assertEqual(jsxNodeProps.onSomeEvent, eventHandler);
+    assertEqual(jsxNode.content.length, 0);
+}
+exports.testComponentClassWithProps = testComponentClassWithProps;
+/**
+ * Create a component class with child content, using HyperScript syntax and JSX syntax
+ */
+function testComponentClassWithChildren() {
+    var ComponentClassWithChildren = /** @class */ (function () {
+        function ComponentClassWithChildren(props) {
+            this.props = props;
+        }
+        ComponentClassWithChildren.prototype.mount = function (props, content) {
+            var name = props.name, count = props.count, onSomeEvent = props.onSomeEvent;
+            return petit_dom_1.mount(petit_dom_1.h("div", { className: name, tabIndex: count, onclick: onSomeEvent }, content));
+        };
+        ComponentClassWithChildren.prototype.patch = function (element, newProps, oldProps, newContent, oldContent) {
+            petit_dom_1.patch(petit_dom_1.h("div", __assign({}, oldProps), oldContent), petit_dom_1.h("div", __assign({}, newProps), newContent));
+            return element;
+        };
+        ComponentClassWithChildren.prototype.unmount = function (element) {
+            petit_dom_1.unmount(petit_dom_1.h("div", null, " Hello World"));
+        };
+        return ComponentClassWithChildren;
+    }());
+    // HyperScript syntax returns a ComponentClassNode<T> object, with typed properties
+    var node = petit_dom_1.h(ComponentClassWithChildren, { name: "xyz", count: 123, onSomeEvent: eventHandler }, "Hello", petit_dom_1.h("span", null, "World"));
+    assertEqual(node.isSVG, false);
+    assertEqual(node.type, ComponentClassWithChildren);
+    assertEqual(node.key, null);
+    assertEqual(node.props.name, "xyz");
+    assertEqual(node.props.count, 123);
+    assertEqual(node.props.onSomeEvent, eventHandler);
+    assertEqual(node.content.length, 2);
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    var jsxNode = (petit_dom_1.h(ComponentClassWithChildren, { name: "xyz", count: 123, onSomeEvent: eventHandler },
+        "Hello ",
+        petit_dom_1.h("span", null, "World")));
+    var jsxNodeType = jsxNode.type;
+    var jsxNodeProps = jsxNode.props;
+    assertEqual(jsxNode.isSVG, false);
+    assertEqual(jsxNodeType, ComponentClassWithChildren);
+    assertEqual(jsxNode.key, null);
+    assertEqual(jsxNodeProps.name, "xyz");
+    assertEqual(jsxNodeProps.count, 123);
+    assertEqual(jsxNodeProps.onSomeEvent, eventHandler);
+    assertEqual(jsxNode.content.length, 2);
+}
+exports.testComponentClassWithChildren = testComponentClassWithChildren;
diff --git a/tests/baselines/reference/petitDomSimpleJsx.symbols b/tests/baselines/reference/petitDomSimpleJsx.symbols
new file mode 100644
index 0000000000000..48bf5e5d8893e
--- /dev/null
+++ b/tests/baselines/reference/petitDomSimpleJsx.symbols
@@ -0,0 +1,2047 @@
+=== tests/cases/compiler/node_modules/petit-dom/index.d.ts ===
+// Modified type definitions for Petit-Dom 0.2
+// Project: https://github.com/yelouafi/petit-dom
+// Definitions by: James Messinger <https://github.com/JamesMessinger>, modified by @weswigham for testing
+// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
+// TypeScript Version: 3.4
+
+/**
+ * Creates a VNode of the specified HTML Element type and with the
+ * specified properties and contents.
+ *
+ * @param type - The tag name of element to create
+ * @param props - Properties to set on the element
+ * @param ...children - Child nodes
+ * @returns A new VNode object
+ */
+export function h<T extends keyof ElementTagNameMap, E extends ElementTagNameMap[T]>(
+>h : Symbol(h, Decl(index.d.ts, 0, 0), Decl(index.d.ts, 19, 30), Decl(index.d.ts, 33, 29), Decl(index.d.ts, 47, 34))
+>T : Symbol(T, Decl(index.d.ts, 15, 18))
+>ElementTagNameMap : Symbol(ElementTagNameMap, Decl(lib.dom.d.ts, --, --))
+>E : Symbol(E, Decl(index.d.ts, 15, 52))
+>ElementTagNameMap : Symbol(ElementTagNameMap, Decl(lib.dom.d.ts, --, --))
+>T : Symbol(T, Decl(index.d.ts, 15, 18))
+
+    type: T,
+>type : Symbol(type, Decl(index.d.ts, 15, 85))
+>T : Symbol(T, Decl(index.d.ts, 15, 18))
+
+    props?: PetitDom.Props<E> | null,
+>props : Symbol(props, Decl(index.d.ts, 16, 12))
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>Props : Symbol(PetitDom.Props, Decl(index.d.ts, 103, 5))
+>E : Symbol(E, Decl(index.d.ts, 15, 52))
+
+    ...children: ReadonlyArray<PetitDom.Content>
+>children : Symbol(children, Decl(index.d.ts, 17, 37))
+>ReadonlyArray : Symbol(ReadonlyArray, Decl(lib.es5.d.ts, --, --), Decl(lib.es2015.core.d.ts, --, --), Decl(lib.es2015.iterable.d.ts, --, --))
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>Content : Symbol(PetitDom.Content, Decl(index.d.ts, 93, 60))
+
+): PetitDom.ElementNode<T, E>;
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>ElementNode : Symbol(PetitDom.ElementNode, Decl(index.d.ts, 135, 5))
+>T : Symbol(T, Decl(index.d.ts, 15, 18))
+>E : Symbol(E, Decl(index.d.ts, 15, 52))
+
+/**
+ * Creates a VNode using a PetitDom component object.
+ *
+ * @param type - A PetitDom component object
+ * @param props - Properties to set on the component
+ * @param ...children - Child nodes
+ * @returns A new VNode object
+ */
+export function h<P extends PetitDom.ComponentProps = PetitDom.ComponentProps>(
+>h : Symbol(h, Decl(index.d.ts, 0, 0), Decl(index.d.ts, 19, 30), Decl(index.d.ts, 33, 29), Decl(index.d.ts, 47, 34))
+>P : Symbol(P, Decl(index.d.ts, 29, 18))
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>ComponentProps : Symbol(PetitDom.ComponentProps, Decl(index.d.ts, 91, 31))
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>ComponentProps : Symbol(PetitDom.ComponentProps, Decl(index.d.ts, 91, 31))
+
+    type: PetitDom.Component<P>,
+>type : Symbol(type, Decl(index.d.ts, 29, 79))
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>Component : Symbol(PetitDom.Component, Decl(index.d.ts, 121, 5))
+>P : Symbol(P, Decl(index.d.ts, 29, 18))
+
+    props?: (P & PetitDom.IntrinsicProps) | null,
+>props : Symbol(props, Decl(index.d.ts, 30, 32))
+>P : Symbol(P, Decl(index.d.ts, 29, 18))
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>IntrinsicProps : Symbol(PetitDom.IntrinsicProps, Decl(index.d.ts, 98, 6))
+
+    ...children: ReadonlyArray<PetitDom.Content>
+>children : Symbol(children, Decl(index.d.ts, 31, 49))
+>ReadonlyArray : Symbol(ReadonlyArray, Decl(lib.es5.d.ts, --, --), Decl(lib.es2015.core.d.ts, --, --), Decl(lib.es2015.iterable.d.ts, --, --))
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>Content : Symbol(PetitDom.Content, Decl(index.d.ts, 93, 60))
+
+): PetitDom.ComponentNode<P>;
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>ComponentNode : Symbol(PetitDom.ComponentNode, Decl(index.d.ts, 140, 5))
+>P : Symbol(P, Decl(index.d.ts, 29, 18))
+
+/**
+ * Creates a VNode using a PetitDom component class.
+ *
+ * @param type - A PetitDom component class
+ * @param props - Properties to set on the component
+ * @param ...children - Child nodes
+ * @returns A new VNode object
+ */
+export function h<P extends PetitDom.ComponentProps = PetitDom.ComponentProps>(
+>h : Symbol(h, Decl(index.d.ts, 0, 0), Decl(index.d.ts, 19, 30), Decl(index.d.ts, 33, 29), Decl(index.d.ts, 47, 34))
+>P : Symbol(P, Decl(index.d.ts, 43, 18))
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>ComponentProps : Symbol(PetitDom.ComponentProps, Decl(index.d.ts, 91, 31))
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>ComponentProps : Symbol(PetitDom.ComponentProps, Decl(index.d.ts, 91, 31))
+
+    type: PetitDom.ComponentClass<P>,
+>type : Symbol(type, Decl(index.d.ts, 43, 79))
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>ComponentClass : Symbol(PetitDom.ComponentClass, Decl(index.d.ts, 117, 5))
+>P : Symbol(P, Decl(index.d.ts, 43, 18))
+
+    props?: (P & PetitDom.IntrinsicProps) | null,
+>props : Symbol(props, Decl(index.d.ts, 44, 37))
+>P : Symbol(P, Decl(index.d.ts, 43, 18))
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>IntrinsicProps : Symbol(PetitDom.IntrinsicProps, Decl(index.d.ts, 98, 6))
+
+    ...children: ReadonlyArray<PetitDom.Content>
+>children : Symbol(children, Decl(index.d.ts, 45, 49))
+>ReadonlyArray : Symbol(ReadonlyArray, Decl(lib.es5.d.ts, --, --), Decl(lib.es2015.core.d.ts, --, --), Decl(lib.es2015.iterable.d.ts, --, --))
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>Content : Symbol(PetitDom.Content, Decl(index.d.ts, 93, 60))
+
+): PetitDom.ComponentClassNode<P>;
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>ComponentClassNode : Symbol(PetitDom.ComponentClassNode, Decl(index.d.ts, 145, 5))
+>P : Symbol(P, Decl(index.d.ts, 43, 18))
+
+/**
+ * Creates a VNode using a PetitDom function component.
+ *
+ * This function is compatible with both JSX and HyperScript syntax.
+ *
+ * @param type - A PetitDom function component
+ * @param props - Properties to set on the component
+ * @param ...children - Child nodes
+ * @returns A new VNode object
+ */
+export function h<P extends PetitDom.ComponentProps = PetitDom.ComponentProps>(
+>h : Symbol(h, Decl(index.d.ts, 0, 0), Decl(index.d.ts, 19, 30), Decl(index.d.ts, 33, 29), Decl(index.d.ts, 47, 34))
+>P : Symbol(P, Decl(index.d.ts, 59, 18))
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>ComponentProps : Symbol(PetitDom.ComponentProps, Decl(index.d.ts, 91, 31))
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>ComponentProps : Symbol(PetitDom.ComponentProps, Decl(index.d.ts, 91, 31))
+
+    type: PetitDom.FunctionComponent<P>,
+>type : Symbol(type, Decl(index.d.ts, 59, 79))
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>FunctionComponent : Symbol(PetitDom.FunctionComponent, Decl(index.d.ts, 112, 17))
+>P : Symbol(P, Decl(index.d.ts, 59, 18))
+
+    props?: (P & PetitDom.IntrinsicProps) | null,
+>props : Symbol(props, Decl(index.d.ts, 60, 40))
+>P : Symbol(P, Decl(index.d.ts, 59, 18))
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>IntrinsicProps : Symbol(PetitDom.IntrinsicProps, Decl(index.d.ts, 98, 6))
+
+    ...children: ReadonlyArray<PetitDom.Content>
+>children : Symbol(children, Decl(index.d.ts, 61, 49))
+>ReadonlyArray : Symbol(ReadonlyArray, Decl(lib.es5.d.ts, --, --), Decl(lib.es2015.core.d.ts, --, --), Decl(lib.es2015.iterable.d.ts, --, --))
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>Content : Symbol(PetitDom.Content, Decl(index.d.ts, 93, 60))
+
+): PetitDom.FunctionComponentNode<P>;
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>FunctionComponentNode : Symbol(PetitDom.FunctionComponentNode, Decl(index.d.ts, 150, 5))
+>P : Symbol(P, Decl(index.d.ts, 59, 18))
+
+/**
+ * Creates actual DOM Elements for the given VNode and its children.
+ *
+ * @param vnode - The VNode object to mount
+ * @returns The newly-created DOM element
+ */
+export function mount(vnode: PetitDom.VNode): Element;
+>mount : Symbol(mount, Decl(index.d.ts, 63, 37))
+>vnode : Symbol(vnode, Decl(index.d.ts, 71, 22))
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>VNode : Symbol(PetitDom.VNode, Decl(index.d.ts, 127, 5))
+>Element : Symbol(Element, Decl(lib.dom.d.ts, --, --), Decl(lib.dom.d.ts, --, --))
+
+/**
+ * Diffs two VNodes and applies the necessary DOM changes
+ *
+ * @param newVNode - The new VNode object, which will be mounted to the DOM element of oldVNode
+ * @param oldVNode - The old VNode object to diff against
+ * @param parent - The parent DOM element. Used internally by PetitDom to recursively patch child nodes
+ * @returns The updated DOM element. This element is also moved from oldVNode to newVNode
+ */
+export function patch(newVNode: PetitDom.VNode, oldVNode: PetitDom.VNode, parent?: Element): Element;
+>patch : Symbol(patch, Decl(index.d.ts, 71, 54))
+>newVNode : Symbol(newVNode, Decl(index.d.ts, 81, 22))
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>VNode : Symbol(PetitDom.VNode, Decl(index.d.ts, 127, 5))
+>oldVNode : Symbol(oldVNode, Decl(index.d.ts, 81, 47))
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>VNode : Symbol(PetitDom.VNode, Decl(index.d.ts, 127, 5))
+>parent : Symbol(parent, Decl(index.d.ts, 81, 73))
+>Element : Symbol(Element, Decl(lib.dom.d.ts, --, --), Decl(lib.dom.d.ts, --, --))
+>Element : Symbol(Element, Decl(lib.dom.d.ts, --, --), Decl(lib.dom.d.ts, --, --))
+
+/**
+ * Removes the given VNode from the actual DOM
+ *
+ * @param vnode - The VNode object to unmount
+ */
+export function unmount(vnode: PetitDom.VNode): void;
+>unmount : Symbol(unmount, Decl(index.d.ts, 81, 101))
+>vnode : Symbol(vnode, Decl(index.d.ts, 88, 24))
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>VNode : Symbol(PetitDom.VNode, Decl(index.d.ts, 127, 5))
+
+export namespace PetitDom {
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+
+    type Key = string | number;
+>Key : Symbol(Key, Decl(index.d.ts, 90, 27))
+
+    type ComponentProps = object;
+>ComponentProps : Symbol(ComponentProps, Decl(index.d.ts, 91, 31))
+
+    interface ContentArray extends ReadonlyArray<Content> {}
+>ContentArray : Symbol(ContentArray, Decl(index.d.ts, 92, 33))
+>ReadonlyArray : Symbol(ReadonlyArray, Decl(lib.es5.d.ts, --, --), Decl(lib.es2015.core.d.ts, --, --), Decl(lib.es2015.iterable.d.ts, --, --))
+>Content : Symbol(Content, Decl(index.d.ts, 93, 60))
+
+    type Content = string | VNode | ContentArray;
+>Content : Symbol(Content, Decl(index.d.ts, 93, 60))
+>VNode : Symbol(VNode, Decl(index.d.ts, 127, 5))
+>ContentArray : Symbol(ContentArray, Decl(index.d.ts, 92, 33))
+
+    type DOMElementProps<E extends Element> = {
+>DOMElementProps : Symbol(DOMElementProps, Decl(index.d.ts, 94, 49))
+>E : Symbol(E, Decl(index.d.ts, 96, 25))
+>Element : Symbol(Element, Decl(lib.dom.d.ts, --, --), Decl(lib.dom.d.ts, --, --))
+
+        [P in keyof E]?: E[P];
+>P : Symbol(P, Decl(index.d.ts, 97, 9))
+>E : Symbol(E, Decl(index.d.ts, 96, 25))
+>E : Symbol(E, Decl(index.d.ts, 96, 25))
+>P : Symbol(P, Decl(index.d.ts, 97, 9))
+
+    };
+
+    interface IntrinsicProps {
+>IntrinsicProps : Symbol(IntrinsicProps, Decl(index.d.ts, 98, 6))
+
+        content?: Content | ReadonlyArray<Content>;
+>content : Symbol(IntrinsicProps.content, Decl(index.d.ts, 100, 30))
+>Content : Symbol(Content, Decl(index.d.ts, 93, 60))
+>ReadonlyArray : Symbol(ReadonlyArray, Decl(lib.es5.d.ts, --, --), Decl(lib.es2015.core.d.ts, --, --), Decl(lib.es2015.iterable.d.ts, --, --))
+>Content : Symbol(Content, Decl(index.d.ts, 93, 60))
+
+        key?: Key;
+>key : Symbol(IntrinsicProps.key, Decl(index.d.ts, 101, 51))
+>Key : Symbol(Key, Decl(index.d.ts, 90, 27))
+    }
+
+    type Props<E extends Element = Element> = IntrinsicProps & DOMElementProps<E>;
+>Props : Symbol(Props, Decl(index.d.ts, 103, 5))
+>E : Symbol(E, Decl(index.d.ts, 105, 15))
+>Element : Symbol(Element, Decl(lib.dom.d.ts, --, --), Decl(lib.dom.d.ts, --, --))
+>Element : Symbol(Element, Decl(lib.dom.d.ts, --, --), Decl(lib.dom.d.ts, --, --))
+>IntrinsicProps : Symbol(IntrinsicProps, Decl(index.d.ts, 98, 6))
+>DOMElementProps : Symbol(DOMElementProps, Decl(index.d.ts, 94, 49))
+>E : Symbol(E, Decl(index.d.ts, 105, 15))
+
+    type ShouldUpdate<P extends ComponentProps> = (
+>ShouldUpdate : Symbol(ShouldUpdate, Decl(index.d.ts, 105, 82))
+>P : Symbol(P, Decl(index.d.ts, 107, 22))
+>ComponentProps : Symbol(ComponentProps, Decl(index.d.ts, 91, 31))
+
+        newProps: P,
+>newProps : Symbol(newProps, Decl(index.d.ts, 107, 51))
+>P : Symbol(P, Decl(index.d.ts, 107, 22))
+
+        oldProps: P,
+>oldProps : Symbol(oldProps, Decl(index.d.ts, 108, 20))
+>P : Symbol(P, Decl(index.d.ts, 107, 22))
+
+        newContent: ReadonlyArray<VNode>,
+>newContent : Symbol(newContent, Decl(index.d.ts, 109, 20))
+>ReadonlyArray : Symbol(ReadonlyArray, Decl(lib.es5.d.ts, --, --), Decl(lib.es2015.core.d.ts, --, --), Decl(lib.es2015.iterable.d.ts, --, --))
+>VNode : Symbol(VNode, Decl(index.d.ts, 127, 5))
+
+        oldContent: ReadonlyArray<VNode>
+>oldContent : Symbol(oldContent, Decl(index.d.ts, 110, 41))
+>ReadonlyArray : Symbol(ReadonlyArray, Decl(lib.es5.d.ts, --, --), Decl(lib.es2015.core.d.ts, --, --), Decl(lib.es2015.iterable.d.ts, --, --))
+>VNode : Symbol(VNode, Decl(index.d.ts, 127, 5))
+
+    ) => boolean;
+
+    interface FunctionComponent<P extends ComponentProps> {
+>FunctionComponent : Symbol(FunctionComponent, Decl(index.d.ts, 112, 17))
+>P : Symbol(P, Decl(index.d.ts, 114, 32))
+>ComponentProps : Symbol(ComponentProps, Decl(index.d.ts, 91, 31))
+
+        (props: P, content: ReadonlyArray<Content>): FunctionComponentNode<P>;
+>props : Symbol(props, Decl(index.d.ts, 115, 9))
+>P : Symbol(P, Decl(index.d.ts, 114, 32))
+>content : Symbol(content, Decl(index.d.ts, 115, 18))
+>ReadonlyArray : Symbol(ReadonlyArray, Decl(lib.es5.d.ts, --, --), Decl(lib.es2015.core.d.ts, --, --), Decl(lib.es2015.iterable.d.ts, --, --))
+>Content : Symbol(Content, Decl(index.d.ts, 93, 60))
+>FunctionComponentNode : Symbol(FunctionComponentNode, Decl(index.d.ts, 150, 5))
+>P : Symbol(P, Decl(index.d.ts, 114, 32))
+
+        shouldUpdate?: ShouldUpdate<P>;
+>shouldUpdate : Symbol(FunctionComponent.shouldUpdate, Decl(index.d.ts, 115, 78))
+>ShouldUpdate : Symbol(ShouldUpdate, Decl(index.d.ts, 105, 82))
+>P : Symbol(P, Decl(index.d.ts, 114, 32))
+    }
+
+    interface ComponentClass<P extends ComponentProps> {
+>ComponentClass : Symbol(ComponentClass, Decl(index.d.ts, 117, 5))
+>P : Symbol(P, Decl(index.d.ts, 119, 29))
+>ComponentProps : Symbol(ComponentProps, Decl(index.d.ts, 91, 31))
+
+        new(props: P, content: ReadonlyArray<Content>): Component<P>;
+>props : Symbol(props, Decl(index.d.ts, 120, 12))
+>P : Symbol(P, Decl(index.d.ts, 119, 29))
+>content : Symbol(content, Decl(index.d.ts, 120, 21))
+>ReadonlyArray : Symbol(ReadonlyArray, Decl(lib.es5.d.ts, --, --), Decl(lib.es2015.core.d.ts, --, --), Decl(lib.es2015.iterable.d.ts, --, --))
+>Content : Symbol(Content, Decl(index.d.ts, 93, 60))
+>Component : Symbol(Component, Decl(index.d.ts, 121, 5))
+>P : Symbol(P, Decl(index.d.ts, 119, 29))
+    }
+
+    interface Component<P extends ComponentProps> {
+>Component : Symbol(Component, Decl(index.d.ts, 121, 5))
+>P : Symbol(P, Decl(index.d.ts, 123, 24))
+>ComponentProps : Symbol(ComponentProps, Decl(index.d.ts, 91, 31))
+
+        mount(props: P, content: ReadonlyArray<VNode>): Element;
+>mount : Symbol(Component.mount, Decl(index.d.ts, 123, 51))
+>props : Symbol(props, Decl(index.d.ts, 124, 14))
+>P : Symbol(P, Decl(index.d.ts, 123, 24))
+>content : Symbol(content, Decl(index.d.ts, 124, 23))
+>ReadonlyArray : Symbol(ReadonlyArray, Decl(lib.es5.d.ts, --, --), Decl(lib.es2015.core.d.ts, --, --), Decl(lib.es2015.iterable.d.ts, --, --))
+>VNode : Symbol(VNode, Decl(index.d.ts, 127, 5))
+>Element : Symbol(Element, Decl(lib.dom.d.ts, --, --), Decl(lib.dom.d.ts, --, --))
+
+        patch(element: Element, newProps: P, oldProps: P, newContent: ReadonlyArray<VNode>, oldContent: ReadonlyArray<VNode>): Element;
+>patch : Symbol(Component.patch, Decl(index.d.ts, 124, 64))
+>element : Symbol(element, Decl(index.d.ts, 125, 14))
+>Element : Symbol(Element, Decl(lib.dom.d.ts, --, --), Decl(lib.dom.d.ts, --, --))
+>newProps : Symbol(newProps, Decl(index.d.ts, 125, 31))
+>P : Symbol(P, Decl(index.d.ts, 123, 24))
+>oldProps : Symbol(oldProps, Decl(index.d.ts, 125, 44))
+>P : Symbol(P, Decl(index.d.ts, 123, 24))
+>newContent : Symbol(newContent, Decl(index.d.ts, 125, 57))
+>ReadonlyArray : Symbol(ReadonlyArray, Decl(lib.es5.d.ts, --, --), Decl(lib.es2015.core.d.ts, --, --), Decl(lib.es2015.iterable.d.ts, --, --))
+>VNode : Symbol(VNode, Decl(index.d.ts, 127, 5))
+>oldContent : Symbol(oldContent, Decl(index.d.ts, 125, 91))
+>ReadonlyArray : Symbol(ReadonlyArray, Decl(lib.es5.d.ts, --, --), Decl(lib.es2015.core.d.ts, --, --), Decl(lib.es2015.iterable.d.ts, --, --))
+>VNode : Symbol(VNode, Decl(index.d.ts, 127, 5))
+>Element : Symbol(Element, Decl(lib.dom.d.ts, --, --), Decl(lib.dom.d.ts, --, --))
+
+        unmount(element: Element): void;
+>unmount : Symbol(Component.unmount, Decl(index.d.ts, 125, 135))
+>element : Symbol(element, Decl(index.d.ts, 126, 16))
+>Element : Symbol(Element, Decl(lib.dom.d.ts, --, --), Decl(lib.dom.d.ts, --, --))
+    }
+
+    interface VNode {
+>VNode : Symbol(VNode, Decl(index.d.ts, 127, 5))
+
+        readonly isSVG: boolean;
+>isSVG : Symbol(VNode.isSVG, Decl(index.d.ts, 129, 21))
+
+        readonly type: any;
+>type : Symbol(VNode.type, Decl(index.d.ts, 130, 32))
+
+        readonly key: Key | null;
+>key : Symbol(VNode.key, Decl(index.d.ts, 131, 27))
+>Key : Symbol(Key, Decl(index.d.ts, 90, 27))
+
+        readonly props: any;
+>props : Symbol(VNode.props, Decl(index.d.ts, 132, 33))
+
+        readonly content: ReadonlyArray<VNode>;
+>content : Symbol(VNode.content, Decl(index.d.ts, 133, 28))
+>ReadonlyArray : Symbol(ReadonlyArray, Decl(lib.es5.d.ts, --, --), Decl(lib.es2015.core.d.ts, --, --), Decl(lib.es2015.iterable.d.ts, --, --))
+>VNode : Symbol(VNode, Decl(index.d.ts, 127, 5))
+    }
+
+    interface ElementNode<T extends keyof DomElements, E extends DomElements[T]> extends VNode {
+>ElementNode : Symbol(ElementNode, Decl(index.d.ts, 135, 5))
+>T : Symbol(T, Decl(index.d.ts, 137, 26))
+>DomElements : Symbol(DomElements, Decl(index.d.ts, 155, 5))
+>E : Symbol(E, Decl(index.d.ts, 137, 54))
+>DomElements : Symbol(DomElements, Decl(index.d.ts, 155, 5))
+>T : Symbol(T, Decl(index.d.ts, 137, 26))
+>VNode : Symbol(VNode, Decl(index.d.ts, 127, 5))
+
+        readonly type: T;
+>type : Symbol(ElementNode.type, Decl(index.d.ts, 137, 96))
+>T : Symbol(T, Decl(index.d.ts, 137, 26))
+
+        readonly props: Props<E>;
+>props : Symbol(ElementNode.props, Decl(index.d.ts, 138, 25))
+>Props : Symbol(Props, Decl(index.d.ts, 103, 5))
+>E : Symbol(E, Decl(index.d.ts, 137, 54))
+    }
+
+    interface ComponentNode<P extends ComponentProps> extends VNode {
+>ComponentNode : Symbol(ComponentNode, Decl(index.d.ts, 140, 5))
+>P : Symbol(P, Decl(index.d.ts, 142, 28))
+>ComponentProps : Symbol(ComponentProps, Decl(index.d.ts, 91, 31))
+>VNode : Symbol(VNode, Decl(index.d.ts, 127, 5))
+
+        readonly type: Component<P>;
+>type : Symbol(ComponentNode.type, Decl(index.d.ts, 142, 69))
+>Component : Symbol(Component, Decl(index.d.ts, 121, 5))
+>P : Symbol(P, Decl(index.d.ts, 142, 28))
+
+        readonly props: P & IntrinsicProps;
+>props : Symbol(ComponentNode.props, Decl(index.d.ts, 143, 36))
+>P : Symbol(P, Decl(index.d.ts, 142, 28))
+>IntrinsicProps : Symbol(IntrinsicProps, Decl(index.d.ts, 98, 6))
+    }
+
+    interface ComponentClassNode<P extends ComponentProps> extends VNode {
+>ComponentClassNode : Symbol(ComponentClassNode, Decl(index.d.ts, 145, 5))
+>P : Symbol(P, Decl(index.d.ts, 147, 33))
+>ComponentProps : Symbol(ComponentProps, Decl(index.d.ts, 91, 31))
+>VNode : Symbol(VNode, Decl(index.d.ts, 127, 5))
+
+        readonly type: ComponentClass<P>;
+>type : Symbol(ComponentClassNode.type, Decl(index.d.ts, 147, 74))
+>ComponentClass : Symbol(ComponentClass, Decl(index.d.ts, 117, 5))
+>P : Symbol(P, Decl(index.d.ts, 147, 33))
+
+        readonly props: P & IntrinsicProps;
+>props : Symbol(ComponentClassNode.props, Decl(index.d.ts, 148, 41))
+>P : Symbol(P, Decl(index.d.ts, 147, 33))
+>IntrinsicProps : Symbol(IntrinsicProps, Decl(index.d.ts, 98, 6))
+    }
+
+    interface FunctionComponentNode<P extends ComponentProps> extends VNode {
+>FunctionComponentNode : Symbol(FunctionComponentNode, Decl(index.d.ts, 150, 5))
+>P : Symbol(P, Decl(index.d.ts, 152, 36))
+>ComponentProps : Symbol(ComponentProps, Decl(index.d.ts, 91, 31))
+>VNode : Symbol(VNode, Decl(index.d.ts, 127, 5))
+
+        readonly type: FunctionComponent<P>;
+>type : Symbol(FunctionComponentNode.type, Decl(index.d.ts, 152, 77))
+>FunctionComponent : Symbol(FunctionComponent, Decl(index.d.ts, 112, 17))
+>P : Symbol(P, Decl(index.d.ts, 152, 36))
+
+        readonly props: P & IntrinsicProps;
+>props : Symbol(FunctionComponentNode.props, Decl(index.d.ts, 153, 44))
+>P : Symbol(P, Decl(index.d.ts, 152, 36))
+>IntrinsicProps : Symbol(IntrinsicProps, Decl(index.d.ts, 98, 6))
+    }
+
+    interface DomElements extends HTMLElementTagNameMap, SVGElementTagNameMap {
+>DomElements : Symbol(DomElements, Decl(index.d.ts, 155, 5))
+>HTMLElementTagNameMap : Symbol(HTMLElementTagNameMap, Decl(lib.dom.d.ts, --, --))
+>SVGElementTagNameMap : Symbol(SVGElementTagNameMap, Decl(lib.dom.d.ts, --, --))
+
+        "main": HTMLMainElement;
+>"main" : Symbol(DomElements["main"], Decl(index.d.ts, 157, 79))
+>HTMLMainElement : Symbol(HTMLMainElement, Decl(lib.dom.d.ts, --, --), Decl(lib.dom.d.ts, --, --))
+    }
+}
+
+declare global {
+>global : Symbol(global, Decl(index.d.ts, 160, 1))
+
+    namespace JSX {
+>JSX : Symbol(JSX, Decl(index.d.ts, 162, 16))
+
+        // tslint:disable-next-line:no-empty-interface
+        interface Element extends PetitDom.VNode { }
+>Element : Symbol(Element, Decl(index.d.ts, 163, 19))
+>PetitDom.VNode : Symbol(PetitDom.VNode, Decl(index.d.ts, 127, 5))
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>VNode : Symbol(PetitDom.VNode, Decl(index.d.ts, 127, 5))
+
+        // tslint:disable-next-line:no-empty-interface
+        interface ElementClass extends PetitDom.Component<PetitDom.ComponentProps> { }
+>ElementClass : Symbol(ElementClass, Decl(index.d.ts, 165, 52))
+>PetitDom.Component : Symbol(PetitDom.Component, Decl(index.d.ts, 121, 5))
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>Component : Symbol(PetitDom.Component, Decl(index.d.ts, 121, 5))
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>ComponentProps : Symbol(PetitDom.ComponentProps, Decl(index.d.ts, 91, 31))
+
+        // tslint:disable-next-line:no-empty-interface
+        interface IntrinsicClassAttributes<T> extends PetitDom.Props { }
+>IntrinsicClassAttributes : Symbol(IntrinsicClassAttributes, Decl(index.d.ts, 168, 86))
+>T : Symbol(T, Decl(index.d.ts, 171, 43))
+>PetitDom.Props : Symbol(PetitDom.Props, Decl(index.d.ts, 103, 5))
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>Props : Symbol(PetitDom.Props, Decl(index.d.ts, 103, 5))
+
+        // tslint:disable-next-line:no-empty-interface
+        interface IntrinsicAttributes extends PetitDom.IntrinsicProps { }
+>IntrinsicAttributes : Symbol(IntrinsicAttributes, Decl(index.d.ts, 171, 72))
+>PetitDom.IntrinsicProps : Symbol(PetitDom.IntrinsicProps, Decl(index.d.ts, 98, 6))
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>IntrinsicProps : Symbol(PetitDom.IntrinsicProps, Decl(index.d.ts, 98, 6))
+
+        interface ElementAttributesProperty { props: PetitDom.Props; }
+>ElementAttributesProperty : Symbol(ElementAttributesProperty, Decl(index.d.ts, 174, 73))
+>props : Symbol(ElementAttributesProperty.props, Decl(index.d.ts, 176, 45))
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>Props : Symbol(PetitDom.Props, Decl(index.d.ts, 103, 5))
+
+        interface ElementChildrenAttribute { content: PetitDom.VNode[]; }
+>ElementChildrenAttribute : Symbol(ElementChildrenAttribute, Decl(index.d.ts, 176, 70))
+>content : Symbol(ElementChildrenAttribute.content, Decl(index.d.ts, 178, 44))
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>VNode : Symbol(PetitDom.VNode, Decl(index.d.ts, 127, 5))
+
+        type IntrinsicElements = {
+>IntrinsicElements : Symbol(IntrinsicElements, Decl(index.d.ts, 178, 73))
+
+            [P in keyof PetitDom.DomElements]:
+>P : Symbol(P, Decl(index.d.ts, 181, 13))
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>DomElements : Symbol(PetitDom.DomElements, Decl(index.d.ts, 155, 5))
+
+            PetitDom.Props<PetitDom.DomElements[P]> &
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>Props : Symbol(PetitDom.Props, Decl(index.d.ts, 103, 5))
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>DomElements : Symbol(PetitDom.DomElements, Decl(index.d.ts, 155, 5))
+>P : Symbol(P, Decl(index.d.ts, 181, 13))
+            {
+                content?: PetitDom.Content | ReadonlyArray<PetitDom.Content>;
+>content : Symbol(content, Decl(index.d.ts, 183, 13))
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>Content : Symbol(PetitDom.Content, Decl(index.d.ts, 93, 60))
+>ReadonlyArray : Symbol(ReadonlyArray, Decl(lib.es5.d.ts, --, --), Decl(lib.es2015.core.d.ts, --, --), Decl(lib.es2015.iterable.d.ts, --, --))
+>PetitDom : Symbol(PetitDom, Decl(index.d.ts, 88, 53))
+>Content : Symbol(PetitDom.Content, Decl(index.d.ts, 93, 60))
+
+            };
+        };
+    }
+}
+
+=== tests/cases/compiler/petit-dom-tests.tsx ===
+/* @jsx h */
+// tslint:disable:no-empty
+// tslint:disable:no-null-keyword
+
+import { h, mount, patch, PetitDom, unmount } from "petit-dom";
+>h : Symbol(h, Decl(petit-dom-tests.tsx, 4, 8))
+>mount : Symbol(mount, Decl(petit-dom-tests.tsx, 4, 11))
+>patch : Symbol(patch, Decl(petit-dom-tests.tsx, 4, 18))
+>PetitDom : Symbol(PetitDom, Decl(petit-dom-tests.tsx, 4, 25))
+>unmount : Symbol(unmount, Decl(petit-dom-tests.tsx, 4, 35))
+
+function assertEqual<T>(a: T, b: T) { }
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>T : Symbol(T, Decl(petit-dom-tests.tsx, 6, 21))
+>a : Symbol(a, Decl(petit-dom-tests.tsx, 6, 24))
+>T : Symbol(T, Decl(petit-dom-tests.tsx, 6, 21))
+>b : Symbol(b, Decl(petit-dom-tests.tsx, 6, 29))
+>T : Symbol(T, Decl(petit-dom-tests.tsx, 6, 21))
+
+function eventHandler(event: Event): void { }
+>eventHandler : Symbol(eventHandler, Decl(petit-dom-tests.tsx, 6, 39))
+>event : Symbol(event, Decl(petit-dom-tests.tsx, 8, 22))
+>Event : Symbol(Event, Decl(lib.dom.d.ts, --, --), Decl(lib.dom.d.ts, --, --))
+
+interface CustomProps {
+>CustomProps : Symbol(CustomProps, Decl(petit-dom-tests.tsx, 8, 45))
+
+    name: string;
+>name : Symbol(CustomProps.name, Decl(petit-dom-tests.tsx, 10, 23))
+
+    count: number;
+>count : Symbol(CustomProps.count, Decl(petit-dom-tests.tsx, 11, 17))
+
+    onSomeEvent(event: Event): void;
+>onSomeEvent : Symbol(CustomProps.onSomeEvent, Decl(petit-dom-tests.tsx, 12, 18))
+>event : Symbol(event, Decl(petit-dom-tests.tsx, 13, 16))
+>Event : Symbol(Event, Decl(lib.dom.d.ts, --, --), Decl(lib.dom.d.ts, --, --))
+}
+
+/**
+ * Create an <a> element with text content, using HyperScript syntax and JSX syntax
+ */
+export function testHtmlElementWithTextContent() {
+>testHtmlElementWithTextContent : Symbol(testHtmlElementWithTextContent, Decl(petit-dom-tests.tsx, 14, 1))
+
+    // HyperScript syntax returns an ElementNode<T> object, with typed properties
+    const aNode = h("a", { href: "link", onclick: eventHandler }, "click here");
+>aNode : Symbol(aNode, Decl(petit-dom-tests.tsx, 21, 9))
+>h : Symbol(h, Decl(petit-dom-tests.tsx, 4, 8))
+>href : Symbol(href, Decl(petit-dom-tests.tsx, 21, 26))
+>onclick : Symbol(onclick, Decl(petit-dom-tests.tsx, 21, 40))
+>eventHandler : Symbol(eventHandler, Decl(petit-dom-tests.tsx, 6, 39))
+
+    assertEqual(aNode.isSVG, false);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>aNode.isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+>aNode : Symbol(aNode, Decl(petit-dom-tests.tsx, 21, 9))
+>isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+
+    assertEqual(aNode.type, "a");
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>aNode.type : Symbol(PetitDom.ElementNode.type, Decl(index.d.ts, 137, 96))
+>aNode : Symbol(aNode, Decl(petit-dom-tests.tsx, 21, 9))
+>type : Symbol(PetitDom.ElementNode.type, Decl(index.d.ts, 137, 96))
+
+    assertEqual(aNode.key, null);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>aNode.key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+>aNode : Symbol(aNode, Decl(petit-dom-tests.tsx, 21, 9))
+>key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+
+    assertEqual(aNode.props.href, "link");
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>aNode.props.href : Symbol(href, Decl(lib.dom.d.ts, --, --))
+>aNode.props : Symbol(PetitDom.ElementNode.props, Decl(index.d.ts, 138, 25))
+>aNode : Symbol(aNode, Decl(petit-dom-tests.tsx, 21, 9))
+>props : Symbol(PetitDom.ElementNode.props, Decl(index.d.ts, 138, 25))
+>href : Symbol(href, Decl(lib.dom.d.ts, --, --))
+
+    assertEqual(aNode.props.onclick, eventHandler);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>aNode.props.onclick : Symbol(onclick, Decl(lib.dom.d.ts, --, --))
+>aNode.props : Symbol(PetitDom.ElementNode.props, Decl(index.d.ts, 138, 25))
+>aNode : Symbol(aNode, Decl(petit-dom-tests.tsx, 21, 9))
+>props : Symbol(PetitDom.ElementNode.props, Decl(index.d.ts, 138, 25))
+>onclick : Symbol(onclick, Decl(lib.dom.d.ts, --, --))
+>eventHandler : Symbol(eventHandler, Decl(petit-dom-tests.tsx, 6, 39))
+
+    assertEqual(aNode.content.length, 1);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>aNode.content.length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+>aNode.content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>aNode : Symbol(aNode, Decl(petit-dom-tests.tsx, 21, 9))
+>content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = <a href="link" onclick={eventHandler}>click here</a>;
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 31, 9))
+>a : Symbol("a", Decl(lib.dom.d.ts, --, --))
+>href : Symbol(href, Decl(petit-dom-tests.tsx, 31, 22))
+>onclick : Symbol(onclick, Decl(petit-dom-tests.tsx, 31, 34))
+>eventHandler : Symbol(eventHandler, Decl(petit-dom-tests.tsx, 6, 39))
+>a : Symbol("a", Decl(lib.dom.d.ts, --, --))
+
+    const jsxNodeType = jsxNode.type as string;
+>jsxNodeType : Symbol(jsxNodeType, Decl(petit-dom-tests.tsx, 32, 9))
+>jsxNode.type : Symbol(PetitDom.ElementNode.type, Decl(index.d.ts, 137, 96))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 31, 9))
+>type : Symbol(PetitDom.ElementNode.type, Decl(index.d.ts, 137, 96))
+
+    const jsxNodeProps = jsxNode.props as PetitDom.Props<HTMLAnchorElement>;
+>jsxNodeProps : Symbol(jsxNodeProps, Decl(petit-dom-tests.tsx, 33, 9))
+>jsxNode.props : Symbol(PetitDom.ElementNode.props, Decl(index.d.ts, 138, 25))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 31, 9))
+>props : Symbol(PetitDom.ElementNode.props, Decl(index.d.ts, 138, 25))
+>PetitDom : Symbol(PetitDom, Decl(petit-dom-tests.tsx, 4, 25))
+>Props : Symbol(PetitDom.Props, Decl(index.d.ts, 103, 5))
+>HTMLAnchorElement : Symbol(HTMLAnchorElement, Decl(lib.dom.d.ts, --, --), Decl(lib.dom.d.ts, --, --))
+
+    assertEqual(jsxNode.isSVG, false);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNode.isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 31, 9))
+>isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+
+    assertEqual(jsxNodeType, "a");
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNodeType : Symbol(jsxNodeType, Decl(petit-dom-tests.tsx, 32, 9))
+
+    assertEqual(jsxNode.key, null);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNode.key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 31, 9))
+>key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+
+    assertEqual(jsxNodeProps.href, "link");
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNodeProps.href : Symbol(href, Decl(lib.dom.d.ts, --, --))
+>jsxNodeProps : Symbol(jsxNodeProps, Decl(petit-dom-tests.tsx, 33, 9))
+>href : Symbol(href, Decl(lib.dom.d.ts, --, --))
+
+    assertEqual(jsxNodeProps.onclick, eventHandler);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNodeProps.onclick : Symbol(onclick, Decl(lib.dom.d.ts, --, --))
+>jsxNodeProps : Symbol(jsxNodeProps, Decl(petit-dom-tests.tsx, 33, 9))
+>onclick : Symbol(onclick, Decl(lib.dom.d.ts, --, --))
+>eventHandler : Symbol(eventHandler, Decl(petit-dom-tests.tsx, 6, 39))
+
+    assertEqual(jsxNode.content.length, 1);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNode.content.length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+>jsxNode.content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 31, 9))
+>content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+}
+
+/**
+ * Create a <form> element with both text content and child elements, using HyperScript syntax and JSX syntax
+ */
+export function testHtmlElementWithMixedContent() {
+>testHtmlElementWithMixedContent : Symbol(testHtmlElementWithMixedContent, Decl(petit-dom-tests.tsx, 41, 1))
+
+    // HyperScript syntax returns an ElementNode<T> object, with typed properties
+    const formNode = h(
+>formNode : Symbol(formNode, Decl(petit-dom-tests.tsx, 48, 9))
+>h : Symbol(h, Decl(petit-dom-tests.tsx, 4, 8))
+
+        "form",
+        { key: 1, method: "POST", onsubmit: eventHandler },
+>key : Symbol(key, Decl(petit-dom-tests.tsx, 50, 9))
+>method : Symbol(method, Decl(petit-dom-tests.tsx, 50, 17))
+>onsubmit : Symbol(onsubmit, Decl(petit-dom-tests.tsx, 50, 33))
+>eventHandler : Symbol(eventHandler, Decl(petit-dom-tests.tsx, 6, 39))
+
+        "Hello ", h("span", null, "World")
+>h : Symbol(h, Decl(petit-dom-tests.tsx, 4, 8))
+
+    );
+
+    assertEqual(formNode.isSVG, false);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>formNode.isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+>formNode : Symbol(formNode, Decl(petit-dom-tests.tsx, 48, 9))
+>isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+
+    assertEqual(formNode.type, "form");
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>formNode.type : Symbol(PetitDom.ElementNode.type, Decl(index.d.ts, 137, 96))
+>formNode : Symbol(formNode, Decl(petit-dom-tests.tsx, 48, 9))
+>type : Symbol(PetitDom.ElementNode.type, Decl(index.d.ts, 137, 96))
+
+    assertEqual(formNode.key, 1);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>formNode.key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+>formNode : Symbol(formNode, Decl(petit-dom-tests.tsx, 48, 9))
+>key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+
+    assertEqual(formNode.props.method, "POST");
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>formNode.props.method : Symbol(method, Decl(lib.dom.d.ts, --, --))
+>formNode.props : Symbol(PetitDom.ElementNode.props, Decl(index.d.ts, 138, 25))
+>formNode : Symbol(formNode, Decl(petit-dom-tests.tsx, 48, 9))
+>props : Symbol(PetitDom.ElementNode.props, Decl(index.d.ts, 138, 25))
+>method : Symbol(method, Decl(lib.dom.d.ts, --, --))
+
+    assertEqual(formNode.props.onsubmit, eventHandler);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>formNode.props.onsubmit : Symbol(onsubmit, Decl(lib.dom.d.ts, --, --))
+>formNode.props : Symbol(PetitDom.ElementNode.props, Decl(index.d.ts, 138, 25))
+>formNode : Symbol(formNode, Decl(petit-dom-tests.tsx, 48, 9))
+>props : Symbol(PetitDom.ElementNode.props, Decl(index.d.ts, 138, 25))
+>onsubmit : Symbol(onsubmit, Decl(lib.dom.d.ts, --, --))
+>eventHandler : Symbol(eventHandler, Decl(petit-dom-tests.tsx, 6, 39))
+
+    assertEqual(formNode.content.length, 2);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>formNode.content.length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+>formNode.content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>formNode : Symbol(formNode, Decl(petit-dom-tests.tsx, 48, 9))
+>content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = <form key={1} method="POST" onsubmit={eventHandler}>Hello <span>World</span></form>;
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 62, 9))
+>form : Symbol("form", Decl(lib.dom.d.ts, --, --))
+>key : Symbol(key, Decl(petit-dom-tests.tsx, 62, 25))
+>method : Symbol(method, Decl(petit-dom-tests.tsx, 62, 33))
+>onsubmit : Symbol(onsubmit, Decl(petit-dom-tests.tsx, 62, 47))
+>eventHandler : Symbol(eventHandler, Decl(petit-dom-tests.tsx, 6, 39))
+>span : Symbol("span", Decl(lib.dom.d.ts, --, --))
+>span : Symbol("span", Decl(lib.dom.d.ts, --, --))
+>form : Symbol("form", Decl(lib.dom.d.ts, --, --))
+
+    const jsxNodeType = jsxNode.type as string;
+>jsxNodeType : Symbol(jsxNodeType, Decl(petit-dom-tests.tsx, 63, 9))
+>jsxNode.type : Symbol(PetitDom.ElementNode.type, Decl(index.d.ts, 137, 96))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 62, 9))
+>type : Symbol(PetitDom.ElementNode.type, Decl(index.d.ts, 137, 96))
+
+    const jsxNodeProps = jsxNode.props as PetitDom.Props<HTMLFormElement>;
+>jsxNodeProps : Symbol(jsxNodeProps, Decl(petit-dom-tests.tsx, 64, 9))
+>jsxNode.props : Symbol(PetitDom.ElementNode.props, Decl(index.d.ts, 138, 25))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 62, 9))
+>props : Symbol(PetitDom.ElementNode.props, Decl(index.d.ts, 138, 25))
+>PetitDom : Symbol(PetitDom, Decl(petit-dom-tests.tsx, 4, 25))
+>Props : Symbol(PetitDom.Props, Decl(index.d.ts, 103, 5))
+>HTMLFormElement : Symbol(HTMLFormElement, Decl(lib.dom.d.ts, --, --), Decl(lib.dom.d.ts, --, --))
+
+    assertEqual(jsxNode.isSVG, false);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNode.isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 62, 9))
+>isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+
+    assertEqual(jsxNodeType, "form");
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNodeType : Symbol(jsxNodeType, Decl(petit-dom-tests.tsx, 63, 9))
+
+    assertEqual(jsxNode.key, 1);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNode.key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 62, 9))
+>key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+
+    assertEqual(jsxNodeProps.method, "POST");
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNodeProps.method : Symbol(method, Decl(lib.dom.d.ts, --, --))
+>jsxNodeProps : Symbol(jsxNodeProps, Decl(petit-dom-tests.tsx, 64, 9))
+>method : Symbol(method, Decl(lib.dom.d.ts, --, --))
+
+    assertEqual(jsxNodeProps.onsubmit, eventHandler);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNodeProps.onsubmit : Symbol(onsubmit, Decl(lib.dom.d.ts, --, --))
+>jsxNodeProps : Symbol(jsxNodeProps, Decl(petit-dom-tests.tsx, 64, 9))
+>onsubmit : Symbol(onsubmit, Decl(lib.dom.d.ts, --, --))
+>eventHandler : Symbol(eventHandler, Decl(petit-dom-tests.tsx, 6, 39))
+
+    assertEqual(jsxNode.content.length, 2);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNode.content.length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+>jsxNode.content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 62, 9))
+>content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+}
+
+/**
+ * Create an <svg> element with a child element, using HyperScript syntax and JSX syntax
+ */
+export function testSvgElementWithChild() {
+>testSvgElementWithChild : Symbol(testSvgElementWithChild, Decl(petit-dom-tests.tsx, 72, 1))
+
+    // HyperScript syntax returns an ElementNode<T> object, with typed properties
+    const svgNode = h("svg", { key: 2, currentScale: 1 }, h("path"));
+>svgNode : Symbol(svgNode, Decl(petit-dom-tests.tsx, 79, 9))
+>h : Symbol(h, Decl(petit-dom-tests.tsx, 4, 8))
+>key : Symbol(key, Decl(petit-dom-tests.tsx, 79, 30))
+>currentScale : Symbol(currentScale, Decl(petit-dom-tests.tsx, 79, 38))
+>h : Symbol(h, Decl(petit-dom-tests.tsx, 4, 8))
+
+    assertEqual(svgNode.isSVG, true);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>svgNode.isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+>svgNode : Symbol(svgNode, Decl(petit-dom-tests.tsx, 79, 9))
+>isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+
+    assertEqual(svgNode.type, "svg");
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>svgNode.type : Symbol(PetitDom.ElementNode.type, Decl(index.d.ts, 137, 96))
+>svgNode : Symbol(svgNode, Decl(petit-dom-tests.tsx, 79, 9))
+>type : Symbol(PetitDom.ElementNode.type, Decl(index.d.ts, 137, 96))
+
+    assertEqual(svgNode.key, 2);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>svgNode.key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+>svgNode : Symbol(svgNode, Decl(petit-dom-tests.tsx, 79, 9))
+>key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+
+    assertEqual(svgNode.props.currentScale, 1);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>svgNode.props.currentScale : Symbol(currentScale, Decl(lib.dom.d.ts, --, --))
+>svgNode.props : Symbol(PetitDom.ElementNode.props, Decl(index.d.ts, 138, 25))
+>svgNode : Symbol(svgNode, Decl(petit-dom-tests.tsx, 79, 9))
+>props : Symbol(PetitDom.ElementNode.props, Decl(index.d.ts, 138, 25))
+>currentScale : Symbol(currentScale, Decl(lib.dom.d.ts, --, --))
+
+    assertEqual(svgNode.content.length, 1);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>svgNode.content.length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+>svgNode.content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>svgNode : Symbol(svgNode, Decl(petit-dom-tests.tsx, 79, 9))
+>content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = <svg key={2} currentScale={1}><path /></svg>;
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 88, 9))
+>svg : Symbol("svg", Decl(lib.dom.d.ts, --, --))
+>key : Symbol(key, Decl(petit-dom-tests.tsx, 88, 24))
+>currentScale : Symbol(currentScale, Decl(petit-dom-tests.tsx, 88, 32))
+>path : Symbol("path", Decl(lib.dom.d.ts, --, --))
+>svg : Symbol("svg", Decl(lib.dom.d.ts, --, --))
+
+    const jsxNodeType = jsxNode.type as string;
+>jsxNodeType : Symbol(jsxNodeType, Decl(petit-dom-tests.tsx, 89, 9))
+>jsxNode.type : Symbol(PetitDom.ElementNode.type, Decl(index.d.ts, 137, 96))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 88, 9))
+>type : Symbol(PetitDom.ElementNode.type, Decl(index.d.ts, 137, 96))
+
+    const jsxNodeProps = jsxNode.props as PetitDom.Props<SVGSVGElement>;
+>jsxNodeProps : Symbol(jsxNodeProps, Decl(petit-dom-tests.tsx, 90, 9))
+>jsxNode.props : Symbol(PetitDom.ElementNode.props, Decl(index.d.ts, 138, 25))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 88, 9))
+>props : Symbol(PetitDom.ElementNode.props, Decl(index.d.ts, 138, 25))
+>PetitDom : Symbol(PetitDom, Decl(petit-dom-tests.tsx, 4, 25))
+>Props : Symbol(PetitDom.Props, Decl(index.d.ts, 103, 5))
+>SVGSVGElement : Symbol(SVGSVGElement, Decl(lib.dom.d.ts, --, --), Decl(lib.dom.d.ts, --, --))
+
+    assertEqual(jsxNode.isSVG, true);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNode.isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 88, 9))
+>isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+
+    assertEqual(jsxNodeType, "svg");
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNodeType : Symbol(jsxNodeType, Decl(petit-dom-tests.tsx, 89, 9))
+
+    assertEqual(jsxNode.key, 2);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNode.key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 88, 9))
+>key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+
+    assertEqual(jsxNodeProps.currentScale, 1);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNodeProps.currentScale : Symbol(currentScale, Decl(lib.dom.d.ts, --, --))
+>jsxNodeProps : Symbol(jsxNodeProps, Decl(petit-dom-tests.tsx, 90, 9))
+>currentScale : Symbol(currentScale, Decl(lib.dom.d.ts, --, --))
+
+    assertEqual(jsxNode.content.length, 1);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNode.content.length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+>jsxNode.content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 88, 9))
+>content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+}
+
+/**
+ * Create a function component, using HyperScript syntax and JSX syntax
+ */
+export function testFunctionComponent() {
+>testFunctionComponent : Symbol(testFunctionComponent, Decl(petit-dom-tests.tsx, 97, 1))
+
+    function FunctionComponent(): JSX.Element {
+>FunctionComponent : Symbol(FunctionComponent, Decl(petit-dom-tests.tsx, 102, 41))
+>JSX : Symbol(JSX, Decl(index.d.ts, 162, 16))
+>Element : Symbol(JSX.Element, Decl(index.d.ts, 163, 19))
+
+        return <div>Hello World</div>;
+>div : Symbol("div", Decl(lib.dom.d.ts, --, --))
+>div : Symbol("div", Decl(lib.dom.d.ts, --, --))
+    }
+
+    // HyperScript syntax returns a FunctionComponentNode<T> object, with typed properties
+    const node = h(FunctionComponent, { key: "1" });
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 108, 9))
+>h : Symbol(h, Decl(petit-dom-tests.tsx, 4, 8))
+>FunctionComponent : Symbol(FunctionComponent, Decl(petit-dom-tests.tsx, 102, 41))
+>key : Symbol(key, Decl(petit-dom-tests.tsx, 108, 39))
+
+    assertEqual(node.isSVG, false);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 108, 9))
+>isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+
+    assertEqual(node.type, FunctionComponent);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.type : Symbol(PetitDom.FunctionComponentNode.type, Decl(index.d.ts, 152, 77))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 108, 9))
+>type : Symbol(PetitDom.FunctionComponentNode.type, Decl(index.d.ts, 152, 77))
+>FunctionComponent : Symbol(FunctionComponent, Decl(petit-dom-tests.tsx, 102, 41))
+
+    assertEqual(node.key, "1");
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 108, 9))
+>key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+
+    assertEqual(node.props.key, "1");
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.props : Symbol(PetitDom.FunctionComponentNode.props, Decl(index.d.ts, 153, 44))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 108, 9))
+>props : Symbol(PetitDom.FunctionComponentNode.props, Decl(index.d.ts, 153, 44))
+
+    assertEqual(node.content.length, 0);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.content.length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+>node.content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 108, 9))
+>content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = <FunctionComponent key="1" />;
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 117, 9))
+>FunctionComponent : Symbol(FunctionComponent, Decl(petit-dom-tests.tsx, 102, 41))
+>key : Symbol(key, Decl(petit-dom-tests.tsx, 117, 38))
+
+    const jsxNodeType = jsxNode.type as PetitDom.FunctionComponent<{}>;
+>jsxNodeType : Symbol(jsxNodeType, Decl(petit-dom-tests.tsx, 118, 9))
+>jsxNode.type : Symbol(PetitDom.FunctionComponentNode.type, Decl(index.d.ts, 152, 77))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 117, 9))
+>type : Symbol(PetitDom.FunctionComponentNode.type, Decl(index.d.ts, 152, 77))
+>PetitDom : Symbol(PetitDom, Decl(petit-dom-tests.tsx, 4, 25))
+>FunctionComponent : Symbol(PetitDom.FunctionComponent, Decl(index.d.ts, 112, 17))
+
+    const jsxNodeProps = jsxNode.props as PetitDom.IntrinsicProps;
+>jsxNodeProps : Symbol(jsxNodeProps, Decl(petit-dom-tests.tsx, 119, 9))
+>jsxNode.props : Symbol(PetitDom.FunctionComponentNode.props, Decl(index.d.ts, 153, 44))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 117, 9))
+>props : Symbol(PetitDom.FunctionComponentNode.props, Decl(index.d.ts, 153, 44))
+>PetitDom : Symbol(PetitDom, Decl(petit-dom-tests.tsx, 4, 25))
+>IntrinsicProps : Symbol(PetitDom.IntrinsicProps, Decl(index.d.ts, 98, 6))
+
+    assertEqual(jsxNode.isSVG, false);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNode.isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 117, 9))
+>isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+
+    assertEqual(jsxNodeType, FunctionComponent);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNodeType : Symbol(jsxNodeType, Decl(petit-dom-tests.tsx, 118, 9))
+>FunctionComponent : Symbol(FunctionComponent, Decl(petit-dom-tests.tsx, 102, 41))
+
+    assertEqual(jsxNode.key, "1");
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNode.key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 117, 9))
+>key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+
+    assertEqual(jsxNodeProps.key, "1");
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNodeProps.key : Symbol(PetitDom.IntrinsicProps.key, Decl(index.d.ts, 101, 51))
+>jsxNodeProps : Symbol(jsxNodeProps, Decl(petit-dom-tests.tsx, 119, 9))
+>key : Symbol(PetitDom.IntrinsicProps.key, Decl(index.d.ts, 101, 51))
+
+    assertEqual(jsxNode.content.length, 0);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNode.content.length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+>jsxNode.content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 117, 9))
+>content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+}
+
+/**
+ * Create a function component with props, using HyperScript syntax and JSX syntax
+ */
+export function testFunctionComponentWithProps() {
+>testFunctionComponentWithProps : Symbol(testFunctionComponentWithProps, Decl(petit-dom-tests.tsx, 126, 1))
+
+    function FunctionComponentWithProps(props: CustomProps): JSX.Element {
+>FunctionComponentWithProps : Symbol(FunctionComponentWithProps, Decl(petit-dom-tests.tsx, 131, 50))
+>props : Symbol(props, Decl(petit-dom-tests.tsx, 132, 40))
+>CustomProps : Symbol(CustomProps, Decl(petit-dom-tests.tsx, 8, 45))
+>JSX : Symbol(JSX, Decl(index.d.ts, 162, 16))
+>Element : Symbol(JSX.Element, Decl(index.d.ts, 163, 19))
+
+        const { name, count, onSomeEvent } = props;
+>name : Symbol(name, Decl(petit-dom-tests.tsx, 133, 15))
+>count : Symbol(count, Decl(petit-dom-tests.tsx, 133, 21))
+>onSomeEvent : Symbol(onSomeEvent, Decl(petit-dom-tests.tsx, 133, 28))
+>props : Symbol(props, Decl(petit-dom-tests.tsx, 132, 40))
+
+        return <div className={name} tabIndex={count} onclick={onSomeEvent}></div>;
+>div : Symbol("div", Decl(lib.dom.d.ts, --, --))
+>className : Symbol(className, Decl(petit-dom-tests.tsx, 134, 19))
+>name : Symbol(name, Decl(petit-dom-tests.tsx, 133, 15))
+>tabIndex : Symbol(tabIndex, Decl(petit-dom-tests.tsx, 134, 36))
+>count : Symbol(count, Decl(petit-dom-tests.tsx, 133, 21))
+>onclick : Symbol(onclick, Decl(petit-dom-tests.tsx, 134, 53))
+>onSomeEvent : Symbol(onSomeEvent, Decl(petit-dom-tests.tsx, 133, 28))
+>div : Symbol("div", Decl(lib.dom.d.ts, --, --))
+    }
+
+    // HyperScript syntax returns a FunctionComponentNode<T> object, with typed properties
+    const node = h(FunctionComponentWithProps, { name: "xyz", count: 123, onSomeEvent: eventHandler });
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 138, 9))
+>h : Symbol(h, Decl(petit-dom-tests.tsx, 4, 8))
+>FunctionComponentWithProps : Symbol(FunctionComponentWithProps, Decl(petit-dom-tests.tsx, 131, 50))
+>name : Symbol(name, Decl(petit-dom-tests.tsx, 138, 48))
+>count : Symbol(count, Decl(petit-dom-tests.tsx, 138, 61))
+>onSomeEvent : Symbol(onSomeEvent, Decl(petit-dom-tests.tsx, 138, 73))
+>eventHandler : Symbol(eventHandler, Decl(petit-dom-tests.tsx, 6, 39))
+
+    assertEqual(node.isSVG, false);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 138, 9))
+>isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+
+    assertEqual(node.type, FunctionComponentWithProps);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.type : Symbol(PetitDom.FunctionComponentNode.type, Decl(index.d.ts, 152, 77))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 138, 9))
+>type : Symbol(PetitDom.FunctionComponentNode.type, Decl(index.d.ts, 152, 77))
+>FunctionComponentWithProps : Symbol(FunctionComponentWithProps, Decl(petit-dom-tests.tsx, 131, 50))
+
+    assertEqual(node.key, null);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 138, 9))
+>key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+
+    assertEqual(node.props.name, "xyz");
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.props.name : Symbol(CustomProps.name, Decl(petit-dom-tests.tsx, 10, 23))
+>node.props : Symbol(PetitDom.FunctionComponentNode.props, Decl(index.d.ts, 153, 44))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 138, 9))
+>props : Symbol(PetitDom.FunctionComponentNode.props, Decl(index.d.ts, 153, 44))
+>name : Symbol(CustomProps.name, Decl(petit-dom-tests.tsx, 10, 23))
+
+    assertEqual(node.props.count, 123);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.props.count : Symbol(CustomProps.count, Decl(petit-dom-tests.tsx, 11, 17))
+>node.props : Symbol(PetitDom.FunctionComponentNode.props, Decl(index.d.ts, 153, 44))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 138, 9))
+>props : Symbol(PetitDom.FunctionComponentNode.props, Decl(index.d.ts, 153, 44))
+>count : Symbol(CustomProps.count, Decl(petit-dom-tests.tsx, 11, 17))
+
+    assertEqual(node.props.onSomeEvent, eventHandler);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.props.onSomeEvent : Symbol(CustomProps.onSomeEvent, Decl(petit-dom-tests.tsx, 12, 18))
+>node.props : Symbol(PetitDom.FunctionComponentNode.props, Decl(index.d.ts, 153, 44))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 138, 9))
+>props : Symbol(PetitDom.FunctionComponentNode.props, Decl(index.d.ts, 153, 44))
+>onSomeEvent : Symbol(CustomProps.onSomeEvent, Decl(petit-dom-tests.tsx, 12, 18))
+>eventHandler : Symbol(eventHandler, Decl(petit-dom-tests.tsx, 6, 39))
+
+    assertEqual(node.content.length, 0);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.content.length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+>node.content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 138, 9))
+>content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = <FunctionComponentWithProps name="xyz" count={123} onSomeEvent={eventHandler} />;
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 149, 9))
+>FunctionComponentWithProps : Symbol(FunctionComponentWithProps, Decl(petit-dom-tests.tsx, 131, 50))
+>name : Symbol(name, Decl(petit-dom-tests.tsx, 149, 47))
+>count : Symbol(count, Decl(petit-dom-tests.tsx, 149, 58))
+>onSomeEvent : Symbol(onSomeEvent, Decl(petit-dom-tests.tsx, 149, 70))
+>eventHandler : Symbol(eventHandler, Decl(petit-dom-tests.tsx, 6, 39))
+
+    const jsxNodeType = jsxNode.type as PetitDom.FunctionComponent<CustomProps>;
+>jsxNodeType : Symbol(jsxNodeType, Decl(petit-dom-tests.tsx, 150, 9))
+>jsxNode.type : Symbol(PetitDom.FunctionComponentNode.type, Decl(index.d.ts, 152, 77))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 149, 9))
+>type : Symbol(PetitDom.FunctionComponentNode.type, Decl(index.d.ts, 152, 77))
+>PetitDom : Symbol(PetitDom, Decl(petit-dom-tests.tsx, 4, 25))
+>FunctionComponent : Symbol(PetitDom.FunctionComponent, Decl(index.d.ts, 112, 17))
+>CustomProps : Symbol(CustomProps, Decl(petit-dom-tests.tsx, 8, 45))
+
+    const jsxNodeProps = jsxNode.props as CustomProps;
+>jsxNodeProps : Symbol(jsxNodeProps, Decl(petit-dom-tests.tsx, 151, 9))
+>jsxNode.props : Symbol(PetitDom.FunctionComponentNode.props, Decl(index.d.ts, 153, 44))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 149, 9))
+>props : Symbol(PetitDom.FunctionComponentNode.props, Decl(index.d.ts, 153, 44))
+>CustomProps : Symbol(CustomProps, Decl(petit-dom-tests.tsx, 8, 45))
+
+    assertEqual(jsxNode.isSVG, false);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNode.isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 149, 9))
+>isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+
+    assertEqual(jsxNodeType, FunctionComponentWithProps);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNodeType : Symbol(jsxNodeType, Decl(petit-dom-tests.tsx, 150, 9))
+>FunctionComponentWithProps : Symbol(FunctionComponentWithProps, Decl(petit-dom-tests.tsx, 131, 50))
+
+    assertEqual(jsxNode.key, null);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNode.key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 149, 9))
+>key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+
+    assertEqual(jsxNodeProps.name, "xyz");
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNodeProps.name : Symbol(CustomProps.name, Decl(petit-dom-tests.tsx, 10, 23))
+>jsxNodeProps : Symbol(jsxNodeProps, Decl(petit-dom-tests.tsx, 151, 9))
+>name : Symbol(CustomProps.name, Decl(petit-dom-tests.tsx, 10, 23))
+
+    assertEqual(jsxNodeProps.count, 123);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNodeProps.count : Symbol(CustomProps.count, Decl(petit-dom-tests.tsx, 11, 17))
+>jsxNodeProps : Symbol(jsxNodeProps, Decl(petit-dom-tests.tsx, 151, 9))
+>count : Symbol(CustomProps.count, Decl(petit-dom-tests.tsx, 11, 17))
+
+    assertEqual(jsxNodeProps.onSomeEvent, eventHandler);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNodeProps.onSomeEvent : Symbol(CustomProps.onSomeEvent, Decl(petit-dom-tests.tsx, 12, 18))
+>jsxNodeProps : Symbol(jsxNodeProps, Decl(petit-dom-tests.tsx, 151, 9))
+>onSomeEvent : Symbol(CustomProps.onSomeEvent, Decl(petit-dom-tests.tsx, 12, 18))
+>eventHandler : Symbol(eventHandler, Decl(petit-dom-tests.tsx, 6, 39))
+
+    assertEqual(jsxNode.content.length, 0);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNode.content.length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+>jsxNode.content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 149, 9))
+>content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+}
+
+/**
+ * Create a function component with child content, using HyperScript syntax and JSX syntax
+ */
+export function testFunctionComponentWithChildren() {
+>testFunctionComponentWithChildren : Symbol(testFunctionComponentWithChildren, Decl(petit-dom-tests.tsx, 160, 1))
+
+    function FunctionComponentWithChildren(props: CustomProps, content: ReadonlyArray<PetitDom.Content>): JSX.Element {
+>FunctionComponentWithChildren : Symbol(FunctionComponentWithChildren, Decl(petit-dom-tests.tsx, 165, 53))
+>props : Symbol(props, Decl(petit-dom-tests.tsx, 166, 43))
+>CustomProps : Symbol(CustomProps, Decl(petit-dom-tests.tsx, 8, 45))
+>content : Symbol(content, Decl(petit-dom-tests.tsx, 166, 62))
+>ReadonlyArray : Symbol(ReadonlyArray, Decl(lib.es5.d.ts, --, --), Decl(lib.es2015.core.d.ts, --, --), Decl(lib.es2015.iterable.d.ts, --, --))
+>PetitDom : Symbol(PetitDom, Decl(petit-dom-tests.tsx, 4, 25))
+>Content : Symbol(PetitDom.Content, Decl(index.d.ts, 93, 60))
+>JSX : Symbol(JSX, Decl(index.d.ts, 162, 16))
+>Element : Symbol(JSX.Element, Decl(index.d.ts, 163, 19))
+
+        const { name, count, onSomeEvent } = props;
+>name : Symbol(name, Decl(petit-dom-tests.tsx, 167, 15))
+>count : Symbol(count, Decl(petit-dom-tests.tsx, 167, 21))
+>onSomeEvent : Symbol(onSomeEvent, Decl(petit-dom-tests.tsx, 167, 28))
+>props : Symbol(props, Decl(petit-dom-tests.tsx, 166, 43))
+
+        return <div className={name} tabIndex={count} onclick={onSomeEvent}>{content}</div>;
+>div : Symbol("div", Decl(lib.dom.d.ts, --, --))
+>className : Symbol(className, Decl(petit-dom-tests.tsx, 168, 19))
+>name : Symbol(name, Decl(petit-dom-tests.tsx, 167, 15))
+>tabIndex : Symbol(tabIndex, Decl(petit-dom-tests.tsx, 168, 36))
+>count : Symbol(count, Decl(petit-dom-tests.tsx, 167, 21))
+>onclick : Symbol(onclick, Decl(petit-dom-tests.tsx, 168, 53))
+>onSomeEvent : Symbol(onSomeEvent, Decl(petit-dom-tests.tsx, 167, 28))
+>content : Symbol(content, Decl(petit-dom-tests.tsx, 166, 62))
+>div : Symbol("div", Decl(lib.dom.d.ts, --, --))
+    }
+
+    // HyperScript syntax returns a FunctionComponentNode<T> object, with typed properties
+    const node = h(
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 172, 9))
+>h : Symbol(h, Decl(petit-dom-tests.tsx, 4, 8))
+
+        FunctionComponentWithChildren,
+>FunctionComponentWithChildren : Symbol(FunctionComponentWithChildren, Decl(petit-dom-tests.tsx, 165, 53))
+
+        { name: "xyz", count: 123, onSomeEvent: eventHandler },
+>name : Symbol(name, Decl(petit-dom-tests.tsx, 174, 9))
+>count : Symbol(count, Decl(petit-dom-tests.tsx, 174, 22))
+>onSomeEvent : Symbol(onSomeEvent, Decl(petit-dom-tests.tsx, 174, 34))
+>eventHandler : Symbol(eventHandler, Decl(petit-dom-tests.tsx, 6, 39))
+
+        "Hello",
+        h("span", null, "World")
+>h : Symbol(h, Decl(petit-dom-tests.tsx, 4, 8))
+
+    );
+
+    assertEqual(node.isSVG, false);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 172, 9))
+>isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+
+    assertEqual(node.type, FunctionComponentWithChildren);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.type : Symbol(PetitDom.FunctionComponentNode.type, Decl(index.d.ts, 152, 77))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 172, 9))
+>type : Symbol(PetitDom.FunctionComponentNode.type, Decl(index.d.ts, 152, 77))
+>FunctionComponentWithChildren : Symbol(FunctionComponentWithChildren, Decl(petit-dom-tests.tsx, 165, 53))
+
+    assertEqual(node.key, null);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 172, 9))
+>key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+
+    assertEqual(node.props.name, "xyz");
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.props.name : Symbol(CustomProps.name, Decl(petit-dom-tests.tsx, 10, 23))
+>node.props : Symbol(PetitDom.FunctionComponentNode.props, Decl(index.d.ts, 153, 44))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 172, 9))
+>props : Symbol(PetitDom.FunctionComponentNode.props, Decl(index.d.ts, 153, 44))
+>name : Symbol(CustomProps.name, Decl(petit-dom-tests.tsx, 10, 23))
+
+    assertEqual(node.props.count, 123);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.props.count : Symbol(CustomProps.count, Decl(petit-dom-tests.tsx, 11, 17))
+>node.props : Symbol(PetitDom.FunctionComponentNode.props, Decl(index.d.ts, 153, 44))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 172, 9))
+>props : Symbol(PetitDom.FunctionComponentNode.props, Decl(index.d.ts, 153, 44))
+>count : Symbol(CustomProps.count, Decl(petit-dom-tests.tsx, 11, 17))
+
+    assertEqual(node.props.onSomeEvent, eventHandler);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.props.onSomeEvent : Symbol(CustomProps.onSomeEvent, Decl(petit-dom-tests.tsx, 12, 18))
+>node.props : Symbol(PetitDom.FunctionComponentNode.props, Decl(index.d.ts, 153, 44))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 172, 9))
+>props : Symbol(PetitDom.FunctionComponentNode.props, Decl(index.d.ts, 153, 44))
+>onSomeEvent : Symbol(CustomProps.onSomeEvent, Decl(petit-dom-tests.tsx, 12, 18))
+>eventHandler : Symbol(eventHandler, Decl(petit-dom-tests.tsx, 6, 39))
+
+    assertEqual(node.content.length, 2);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.content.length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+>node.content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 172, 9))
+>content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = (
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 188, 9))
+
+        <FunctionComponentWithChildren name="xyz" count={123} onSomeEvent={eventHandler}>
+>FunctionComponentWithChildren : Symbol(FunctionComponentWithChildren, Decl(petit-dom-tests.tsx, 165, 53))
+>name : Symbol(name, Decl(petit-dom-tests.tsx, 189, 38))
+>count : Symbol(count, Decl(petit-dom-tests.tsx, 189, 49))
+>onSomeEvent : Symbol(onSomeEvent, Decl(petit-dom-tests.tsx, 189, 61))
+>eventHandler : Symbol(eventHandler, Decl(petit-dom-tests.tsx, 6, 39))
+
+            Hello <span>World</span>
+>span : Symbol("span", Decl(lib.dom.d.ts, --, --))
+>span : Symbol("span", Decl(lib.dom.d.ts, --, --))
+
+        </FunctionComponentWithChildren>
+>FunctionComponentWithChildren : Symbol(FunctionComponentWithChildren, Decl(petit-dom-tests.tsx, 165, 53))
+
+    );
+    const jsxNodeType = jsxNode.type as PetitDom.FunctionComponent<CustomProps>;
+>jsxNodeType : Symbol(jsxNodeType, Decl(petit-dom-tests.tsx, 193, 9))
+>jsxNode.type : Symbol(PetitDom.FunctionComponentNode.type, Decl(index.d.ts, 152, 77))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 188, 9))
+>type : Symbol(PetitDom.FunctionComponentNode.type, Decl(index.d.ts, 152, 77))
+>PetitDom : Symbol(PetitDom, Decl(petit-dom-tests.tsx, 4, 25))
+>FunctionComponent : Symbol(PetitDom.FunctionComponent, Decl(index.d.ts, 112, 17))
+>CustomProps : Symbol(CustomProps, Decl(petit-dom-tests.tsx, 8, 45))
+
+    const jsxNodeProps = jsxNode.props as CustomProps;
+>jsxNodeProps : Symbol(jsxNodeProps, Decl(petit-dom-tests.tsx, 194, 9))
+>jsxNode.props : Symbol(PetitDom.FunctionComponentNode.props, Decl(index.d.ts, 153, 44))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 188, 9))
+>props : Symbol(PetitDom.FunctionComponentNode.props, Decl(index.d.ts, 153, 44))
+>CustomProps : Symbol(CustomProps, Decl(petit-dom-tests.tsx, 8, 45))
+
+    assertEqual(jsxNode.isSVG, false);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNode.isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 188, 9))
+>isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+
+    assertEqual(jsxNodeType, FunctionComponentWithChildren);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNodeType : Symbol(jsxNodeType, Decl(petit-dom-tests.tsx, 193, 9))
+>FunctionComponentWithChildren : Symbol(FunctionComponentWithChildren, Decl(petit-dom-tests.tsx, 165, 53))
+
+    assertEqual(jsxNode.key, null);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNode.key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 188, 9))
+>key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+
+    assertEqual(jsxNodeProps.name, "xyz");
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNodeProps.name : Symbol(CustomProps.name, Decl(petit-dom-tests.tsx, 10, 23))
+>jsxNodeProps : Symbol(jsxNodeProps, Decl(petit-dom-tests.tsx, 194, 9))
+>name : Symbol(CustomProps.name, Decl(petit-dom-tests.tsx, 10, 23))
+
+    assertEqual(jsxNodeProps.count, 123);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNodeProps.count : Symbol(CustomProps.count, Decl(petit-dom-tests.tsx, 11, 17))
+>jsxNodeProps : Symbol(jsxNodeProps, Decl(petit-dom-tests.tsx, 194, 9))
+>count : Symbol(CustomProps.count, Decl(petit-dom-tests.tsx, 11, 17))
+
+    assertEqual(jsxNodeProps.onSomeEvent, eventHandler);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNodeProps.onSomeEvent : Symbol(CustomProps.onSomeEvent, Decl(petit-dom-tests.tsx, 12, 18))
+>jsxNodeProps : Symbol(jsxNodeProps, Decl(petit-dom-tests.tsx, 194, 9))
+>onSomeEvent : Symbol(CustomProps.onSomeEvent, Decl(petit-dom-tests.tsx, 12, 18))
+>eventHandler : Symbol(eventHandler, Decl(petit-dom-tests.tsx, 6, 39))
+
+    assertEqual(jsxNode.content.length, 2);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNode.content.length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+>jsxNode.content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 188, 9))
+>content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+}
+
+/**
+ * Create a component class, using HyperScript syntax and JSX syntax
+ */
+export function testComponentClass() {
+>testComponentClass : Symbol(testComponentClass, Decl(petit-dom-tests.tsx, 203, 1))
+
+    class ComponentClass {
+>ComponentClass : Symbol(ComponentClass, Decl(petit-dom-tests.tsx, 208, 38))
+
+        props = {};
+>props : Symbol(ComponentClass.props, Decl(petit-dom-tests.tsx, 209, 26))
+
+        mount(): Element {
+>mount : Symbol(ComponentClass.mount, Decl(petit-dom-tests.tsx, 210, 19))
+>Element : Symbol(Element, Decl(lib.dom.d.ts, --, --), Decl(lib.dom.d.ts, --, --))
+
+            return mount(<div className="some-class"></div>);
+>mount : Symbol(mount, Decl(petit-dom-tests.tsx, 4, 11))
+>div : Symbol("div", Decl(lib.dom.d.ts, --, --))
+>className : Symbol(className, Decl(petit-dom-tests.tsx, 213, 29))
+>div : Symbol("div", Decl(lib.dom.d.ts, --, --))
+        }
+
+        patch(element: Element, newProps: object, oldProps: object, newContent: ReadonlyArray<PetitDom.VNode>, oldContent: ReadonlyArray<PetitDom.VNode>): Element {
+>patch : Symbol(ComponentClass.patch, Decl(petit-dom-tests.tsx, 214, 9))
+>element : Symbol(element, Decl(petit-dom-tests.tsx, 216, 14))
+>Element : Symbol(Element, Decl(lib.dom.d.ts, --, --), Decl(lib.dom.d.ts, --, --))
+>newProps : Symbol(newProps, Decl(petit-dom-tests.tsx, 216, 31))
+>oldProps : Symbol(oldProps, Decl(petit-dom-tests.tsx, 216, 49))
+>newContent : Symbol(newContent, Decl(petit-dom-tests.tsx, 216, 67))
+>ReadonlyArray : Symbol(ReadonlyArray, Decl(lib.es5.d.ts, --, --), Decl(lib.es2015.core.d.ts, --, --), Decl(lib.es2015.iterable.d.ts, --, --))
+>PetitDom : Symbol(PetitDom, Decl(petit-dom-tests.tsx, 4, 25))
+>VNode : Symbol(PetitDom.VNode, Decl(index.d.ts, 127, 5))
+>oldContent : Symbol(oldContent, Decl(petit-dom-tests.tsx, 216, 110))
+>ReadonlyArray : Symbol(ReadonlyArray, Decl(lib.es5.d.ts, --, --), Decl(lib.es2015.core.d.ts, --, --), Decl(lib.es2015.iterable.d.ts, --, --))
+>PetitDom : Symbol(PetitDom, Decl(petit-dom-tests.tsx, 4, 25))
+>VNode : Symbol(PetitDom.VNode, Decl(index.d.ts, 127, 5))
+>Element : Symbol(Element, Decl(lib.dom.d.ts, --, --), Decl(lib.dom.d.ts, --, --))
+
+            patch(
+>patch : Symbol(patch, Decl(petit-dom-tests.tsx, 4, 18))
+
+                <div {...oldProps}>{oldContent}</div>,
+>div : Symbol("div", Decl(lib.dom.d.ts, --, --))
+>oldProps : Symbol(oldProps, Decl(petit-dom-tests.tsx, 216, 49))
+>oldContent : Symbol(oldContent, Decl(petit-dom-tests.tsx, 216, 110))
+>div : Symbol("div", Decl(lib.dom.d.ts, --, --))
+
+                <div {...newProps}>{newContent}</div>
+>div : Symbol("div", Decl(lib.dom.d.ts, --, --))
+>newProps : Symbol(newProps, Decl(petit-dom-tests.tsx, 216, 31))
+>newContent : Symbol(newContent, Decl(petit-dom-tests.tsx, 216, 67))
+>div : Symbol("div", Decl(lib.dom.d.ts, --, --))
+
+            );
+            return element;
+>element : Symbol(element, Decl(petit-dom-tests.tsx, 216, 14))
+        }
+
+        unmount(element: Element): void {
+>unmount : Symbol(ComponentClass.unmount, Decl(petit-dom-tests.tsx, 222, 9))
+>element : Symbol(element, Decl(petit-dom-tests.tsx, 224, 16))
+>Element : Symbol(Element, Decl(lib.dom.d.ts, --, --), Decl(lib.dom.d.ts, --, --))
+
+            unmount(<div>Hello World</div>);
+>unmount : Symbol(unmount, Decl(petit-dom-tests.tsx, 4, 35))
+>div : Symbol("div", Decl(lib.dom.d.ts, --, --))
+>div : Symbol("div", Decl(lib.dom.d.ts, --, --))
+        }
+    }
+
+    // HyperScript syntax returns a ComponentClassNode<T> object, with typed properties
+    const node = h(ComponentClass, { key: "1" });
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 230, 9))
+>h : Symbol(h, Decl(petit-dom-tests.tsx, 4, 8))
+>ComponentClass : Symbol(ComponentClass, Decl(petit-dom-tests.tsx, 208, 38))
+>key : Symbol(key, Decl(petit-dom-tests.tsx, 230, 36))
+
+    assertEqual(node.isSVG, false);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 230, 9))
+>isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+
+    assertEqual(node.type, ComponentClass);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.type : Symbol(PetitDom.ComponentClassNode.type, Decl(index.d.ts, 147, 74))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 230, 9))
+>type : Symbol(PetitDom.ComponentClassNode.type, Decl(index.d.ts, 147, 74))
+>ComponentClass : Symbol(ComponentClass, Decl(petit-dom-tests.tsx, 208, 38))
+
+    assertEqual(node.key, "1");
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 230, 9))
+>key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+
+    assertEqual(node.props.key, "1");
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.props.key : Symbol(PetitDom.IntrinsicProps.key, Decl(index.d.ts, 101, 51))
+>node.props : Symbol(PetitDom.ComponentClassNode.props, Decl(index.d.ts, 148, 41))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 230, 9))
+>props : Symbol(PetitDom.ComponentClassNode.props, Decl(index.d.ts, 148, 41))
+>key : Symbol(PetitDom.IntrinsicProps.key, Decl(index.d.ts, 101, 51))
+
+    assertEqual(node.content.length, 0);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.content.length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+>node.content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 230, 9))
+>content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = <ComponentClass key="1" />;
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 239, 9))
+>ComponentClass : Symbol(ComponentClass, Decl(petit-dom-tests.tsx, 208, 38))
+>key : Symbol(key, Decl(petit-dom-tests.tsx, 239, 35))
+
+    const jsxNodeType = jsxNode.type as PetitDom.ComponentClass<{}>;
+>jsxNodeType : Symbol(jsxNodeType, Decl(petit-dom-tests.tsx, 240, 9))
+>jsxNode.type : Symbol(PetitDom.ComponentClassNode.type, Decl(index.d.ts, 147, 74))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 239, 9))
+>type : Symbol(PetitDom.ComponentClassNode.type, Decl(index.d.ts, 147, 74))
+>PetitDom : Symbol(PetitDom, Decl(petit-dom-tests.tsx, 4, 25))
+>ComponentClass : Symbol(PetitDom.ComponentClass, Decl(index.d.ts, 117, 5))
+
+    const jsxNodeProps = jsxNode.props as PetitDom.IntrinsicProps;
+>jsxNodeProps : Symbol(jsxNodeProps, Decl(petit-dom-tests.tsx, 241, 9))
+>jsxNode.props : Symbol(PetitDom.ComponentClassNode.props, Decl(index.d.ts, 148, 41))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 239, 9))
+>props : Symbol(PetitDom.ComponentClassNode.props, Decl(index.d.ts, 148, 41))
+>PetitDom : Symbol(PetitDom, Decl(petit-dom-tests.tsx, 4, 25))
+>IntrinsicProps : Symbol(PetitDom.IntrinsicProps, Decl(index.d.ts, 98, 6))
+
+    assertEqual(jsxNode.isSVG, false);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNode.isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 239, 9))
+>isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+
+    assertEqual(jsxNodeType, ComponentClass);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNodeType : Symbol(jsxNodeType, Decl(petit-dom-tests.tsx, 240, 9))
+>ComponentClass : Symbol(ComponentClass, Decl(petit-dom-tests.tsx, 208, 38))
+
+    assertEqual(jsxNode.key, "1");
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNode.key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 239, 9))
+>key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+
+    assertEqual(jsxNodeProps.key, "1");
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNodeProps.key : Symbol(PetitDom.IntrinsicProps.key, Decl(index.d.ts, 101, 51))
+>jsxNodeProps : Symbol(jsxNodeProps, Decl(petit-dom-tests.tsx, 241, 9))
+>key : Symbol(PetitDom.IntrinsicProps.key, Decl(index.d.ts, 101, 51))
+
+    assertEqual(jsxNode.content.length, 0);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNode.content.length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+>jsxNode.content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 239, 9))
+>content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+}
+
+/**
+ * Create a component class with props, using HyperScript syntax and JSX syntax
+ */
+export function testComponentClassWithProps() {
+>testComponentClassWithProps : Symbol(testComponentClassWithProps, Decl(petit-dom-tests.tsx, 248, 1))
+
+    class ComponentClassWithProps {
+>ComponentClassWithProps : Symbol(ComponentClassWithProps, Decl(petit-dom-tests.tsx, 253, 47))
+
+        props: CustomProps;
+>props : Symbol(ComponentClassWithProps.props, Decl(petit-dom-tests.tsx, 254, 35))
+>CustomProps : Symbol(CustomProps, Decl(petit-dom-tests.tsx, 8, 45))
+
+        constructor(props: CustomProps) {
+>props : Symbol(props, Decl(petit-dom-tests.tsx, 257, 20))
+>CustomProps : Symbol(CustomProps, Decl(petit-dom-tests.tsx, 8, 45))
+
+            this.props = props;
+>this.props : Symbol(ComponentClassWithProps.props, Decl(petit-dom-tests.tsx, 254, 35))
+>this : Symbol(ComponentClassWithProps, Decl(petit-dom-tests.tsx, 253, 47))
+>props : Symbol(ComponentClassWithProps.props, Decl(petit-dom-tests.tsx, 254, 35))
+>props : Symbol(props, Decl(petit-dom-tests.tsx, 257, 20))
+        }
+
+        mount(props: CustomProps): Element {
+>mount : Symbol(ComponentClassWithProps.mount, Decl(petit-dom-tests.tsx, 259, 9))
+>props : Symbol(props, Decl(petit-dom-tests.tsx, 261, 14))
+>CustomProps : Symbol(CustomProps, Decl(petit-dom-tests.tsx, 8, 45))
+>Element : Symbol(Element, Decl(lib.dom.d.ts, --, --), Decl(lib.dom.d.ts, --, --))
+
+            const { name, count, onSomeEvent } = props;
+>name : Symbol(name, Decl(petit-dom-tests.tsx, 262, 19))
+>count : Symbol(count, Decl(petit-dom-tests.tsx, 262, 25))
+>onSomeEvent : Symbol(onSomeEvent, Decl(petit-dom-tests.tsx, 262, 32))
+>props : Symbol(props, Decl(petit-dom-tests.tsx, 261, 14))
+
+            return mount(<div className={name} tabIndex={count} onclick={onSomeEvent} />);
+>mount : Symbol(mount, Decl(petit-dom-tests.tsx, 4, 11))
+>div : Symbol("div", Decl(lib.dom.d.ts, --, --))
+>className : Symbol(className, Decl(petit-dom-tests.tsx, 263, 29))
+>name : Symbol(name, Decl(petit-dom-tests.tsx, 262, 19))
+>tabIndex : Symbol(tabIndex, Decl(petit-dom-tests.tsx, 263, 46))
+>count : Symbol(count, Decl(petit-dom-tests.tsx, 262, 25))
+>onclick : Symbol(onclick, Decl(petit-dom-tests.tsx, 263, 63))
+>onSomeEvent : Symbol(onSomeEvent, Decl(petit-dom-tests.tsx, 262, 32))
+        }
+
+        patch(element: Element, newProps: CustomProps, oldProps: CustomProps, newContent: ReadonlyArray<PetitDom.VNode>, oldContent: ReadonlyArray<PetitDom.VNode>): Element {
+>patch : Symbol(ComponentClassWithProps.patch, Decl(petit-dom-tests.tsx, 264, 9))
+>element : Symbol(element, Decl(petit-dom-tests.tsx, 266, 14))
+>Element : Symbol(Element, Decl(lib.dom.d.ts, --, --), Decl(lib.dom.d.ts, --, --))
+>newProps : Symbol(newProps, Decl(petit-dom-tests.tsx, 266, 31))
+>CustomProps : Symbol(CustomProps, Decl(petit-dom-tests.tsx, 8, 45))
+>oldProps : Symbol(oldProps, Decl(petit-dom-tests.tsx, 266, 54))
+>CustomProps : Symbol(CustomProps, Decl(petit-dom-tests.tsx, 8, 45))
+>newContent : Symbol(newContent, Decl(petit-dom-tests.tsx, 266, 77))
+>ReadonlyArray : Symbol(ReadonlyArray, Decl(lib.es5.d.ts, --, --), Decl(lib.es2015.core.d.ts, --, --), Decl(lib.es2015.iterable.d.ts, --, --))
+>PetitDom : Symbol(PetitDom, Decl(petit-dom-tests.tsx, 4, 25))
+>VNode : Symbol(PetitDom.VNode, Decl(index.d.ts, 127, 5))
+>oldContent : Symbol(oldContent, Decl(petit-dom-tests.tsx, 266, 120))
+>ReadonlyArray : Symbol(ReadonlyArray, Decl(lib.es5.d.ts, --, --), Decl(lib.es2015.core.d.ts, --, --), Decl(lib.es2015.iterable.d.ts, --, --))
+>PetitDom : Symbol(PetitDom, Decl(petit-dom-tests.tsx, 4, 25))
+>VNode : Symbol(PetitDom.VNode, Decl(index.d.ts, 127, 5))
+>Element : Symbol(Element, Decl(lib.dom.d.ts, --, --), Decl(lib.dom.d.ts, --, --))
+
+            patch(
+>patch : Symbol(patch, Decl(petit-dom-tests.tsx, 4, 18))
+
+                <div {...oldProps}>{oldContent}</div>,
+>div : Symbol("div", Decl(lib.dom.d.ts, --, --))
+>oldProps : Symbol(oldProps, Decl(petit-dom-tests.tsx, 266, 54))
+>oldContent : Symbol(oldContent, Decl(petit-dom-tests.tsx, 266, 120))
+>div : Symbol("div", Decl(lib.dom.d.ts, --, --))
+
+                <div {...newProps}>{newContent}</div>
+>div : Symbol("div", Decl(lib.dom.d.ts, --, --))
+>newProps : Symbol(newProps, Decl(petit-dom-tests.tsx, 266, 31))
+>newContent : Symbol(newContent, Decl(petit-dom-tests.tsx, 266, 77))
+>div : Symbol("div", Decl(lib.dom.d.ts, --, --))
+
+            );
+            return element;
+>element : Symbol(element, Decl(petit-dom-tests.tsx, 266, 14))
+        }
+
+        unmount(element: Element): void {
+>unmount : Symbol(ComponentClassWithProps.unmount, Decl(petit-dom-tests.tsx, 272, 9))
+>element : Symbol(element, Decl(petit-dom-tests.tsx, 274, 16))
+>Element : Symbol(Element, Decl(lib.dom.d.ts, --, --), Decl(lib.dom.d.ts, --, --))
+
+            unmount(<div> Hello World</div >);
+>unmount : Symbol(unmount, Decl(petit-dom-tests.tsx, 4, 35))
+>div : Symbol("div", Decl(lib.dom.d.ts, --, --))
+>div : Symbol("div", Decl(lib.dom.d.ts, --, --))
+        }
+    }
+
+    // HyperScript syntax returns a ComponentClassNode<T> object, with typed properties
+    const node = h(ComponentClassWithProps, { name: "xyz", count: 123, onSomeEvent: eventHandler });
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 280, 9))
+>h : Symbol(h, Decl(petit-dom-tests.tsx, 4, 8))
+>ComponentClassWithProps : Symbol(ComponentClassWithProps, Decl(petit-dom-tests.tsx, 253, 47))
+>name : Symbol(name, Decl(petit-dom-tests.tsx, 280, 45))
+>count : Symbol(count, Decl(petit-dom-tests.tsx, 280, 58))
+>onSomeEvent : Symbol(onSomeEvent, Decl(petit-dom-tests.tsx, 280, 70))
+>eventHandler : Symbol(eventHandler, Decl(petit-dom-tests.tsx, 6, 39))
+
+    assertEqual(node.isSVG, false);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 280, 9))
+>isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+
+    assertEqual(node.type, ComponentClassWithProps);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.type : Symbol(PetitDom.ComponentClassNode.type, Decl(index.d.ts, 147, 74))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 280, 9))
+>type : Symbol(PetitDom.ComponentClassNode.type, Decl(index.d.ts, 147, 74))
+>ComponentClassWithProps : Symbol(ComponentClassWithProps, Decl(petit-dom-tests.tsx, 253, 47))
+
+    assertEqual(node.key, null);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 280, 9))
+>key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+
+    assertEqual(node.props.name, "xyz");
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.props.name : Symbol(CustomProps.name, Decl(petit-dom-tests.tsx, 10, 23))
+>node.props : Symbol(PetitDom.ComponentClassNode.props, Decl(index.d.ts, 148, 41))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 280, 9))
+>props : Symbol(PetitDom.ComponentClassNode.props, Decl(index.d.ts, 148, 41))
+>name : Symbol(CustomProps.name, Decl(petit-dom-tests.tsx, 10, 23))
+
+    assertEqual(node.props.count, 123);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.props.count : Symbol(CustomProps.count, Decl(petit-dom-tests.tsx, 11, 17))
+>node.props : Symbol(PetitDom.ComponentClassNode.props, Decl(index.d.ts, 148, 41))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 280, 9))
+>props : Symbol(PetitDom.ComponentClassNode.props, Decl(index.d.ts, 148, 41))
+>count : Symbol(CustomProps.count, Decl(petit-dom-tests.tsx, 11, 17))
+
+    assertEqual(node.props.onSomeEvent, eventHandler);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.props.onSomeEvent : Symbol(CustomProps.onSomeEvent, Decl(petit-dom-tests.tsx, 12, 18))
+>node.props : Symbol(PetitDom.ComponentClassNode.props, Decl(index.d.ts, 148, 41))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 280, 9))
+>props : Symbol(PetitDom.ComponentClassNode.props, Decl(index.d.ts, 148, 41))
+>onSomeEvent : Symbol(CustomProps.onSomeEvent, Decl(petit-dom-tests.tsx, 12, 18))
+>eventHandler : Symbol(eventHandler, Decl(petit-dom-tests.tsx, 6, 39))
+
+    assertEqual(node.content.length, 0);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.content.length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+>node.content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 280, 9))
+>content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = <ComponentClassWithProps name="xyz" count={123} onSomeEvent={eventHandler} />;
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 291, 9))
+>ComponentClassWithProps : Symbol(ComponentClassWithProps, Decl(petit-dom-tests.tsx, 253, 47))
+>name : Symbol(name, Decl(petit-dom-tests.tsx, 291, 44))
+>count : Symbol(count, Decl(petit-dom-tests.tsx, 291, 55))
+>onSomeEvent : Symbol(onSomeEvent, Decl(petit-dom-tests.tsx, 291, 67))
+>eventHandler : Symbol(eventHandler, Decl(petit-dom-tests.tsx, 6, 39))
+
+    const jsxNodeType = jsxNode.type as PetitDom.ComponentClass<CustomProps>;
+>jsxNodeType : Symbol(jsxNodeType, Decl(petit-dom-tests.tsx, 292, 9))
+>jsxNode.type : Symbol(PetitDom.ComponentClassNode.type, Decl(index.d.ts, 147, 74))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 291, 9))
+>type : Symbol(PetitDom.ComponentClassNode.type, Decl(index.d.ts, 147, 74))
+>PetitDom : Symbol(PetitDom, Decl(petit-dom-tests.tsx, 4, 25))
+>ComponentClass : Symbol(PetitDom.ComponentClass, Decl(index.d.ts, 117, 5))
+>CustomProps : Symbol(CustomProps, Decl(petit-dom-tests.tsx, 8, 45))
+
+    const jsxNodeProps = jsxNode.props as CustomProps;
+>jsxNodeProps : Symbol(jsxNodeProps, Decl(petit-dom-tests.tsx, 293, 9))
+>jsxNode.props : Symbol(PetitDom.ComponentClassNode.props, Decl(index.d.ts, 148, 41))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 291, 9))
+>props : Symbol(PetitDom.ComponentClassNode.props, Decl(index.d.ts, 148, 41))
+>CustomProps : Symbol(CustomProps, Decl(petit-dom-tests.tsx, 8, 45))
+
+    assertEqual(jsxNode.isSVG, false);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNode.isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 291, 9))
+>isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+
+    assertEqual(jsxNodeType, ComponentClassWithProps);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNodeType : Symbol(jsxNodeType, Decl(petit-dom-tests.tsx, 292, 9))
+>ComponentClassWithProps : Symbol(ComponentClassWithProps, Decl(petit-dom-tests.tsx, 253, 47))
+
+    assertEqual(jsxNode.key, null);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNode.key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 291, 9))
+>key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+
+    assertEqual(jsxNodeProps.name, "xyz");
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNodeProps.name : Symbol(CustomProps.name, Decl(petit-dom-tests.tsx, 10, 23))
+>jsxNodeProps : Symbol(jsxNodeProps, Decl(petit-dom-tests.tsx, 293, 9))
+>name : Symbol(CustomProps.name, Decl(petit-dom-tests.tsx, 10, 23))
+
+    assertEqual(jsxNodeProps.count, 123);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNodeProps.count : Symbol(CustomProps.count, Decl(petit-dom-tests.tsx, 11, 17))
+>jsxNodeProps : Symbol(jsxNodeProps, Decl(petit-dom-tests.tsx, 293, 9))
+>count : Symbol(CustomProps.count, Decl(petit-dom-tests.tsx, 11, 17))
+
+    assertEqual(jsxNodeProps.onSomeEvent, eventHandler);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNodeProps.onSomeEvent : Symbol(CustomProps.onSomeEvent, Decl(petit-dom-tests.tsx, 12, 18))
+>jsxNodeProps : Symbol(jsxNodeProps, Decl(petit-dom-tests.tsx, 293, 9))
+>onSomeEvent : Symbol(CustomProps.onSomeEvent, Decl(petit-dom-tests.tsx, 12, 18))
+>eventHandler : Symbol(eventHandler, Decl(petit-dom-tests.tsx, 6, 39))
+
+    assertEqual(jsxNode.content.length, 0);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNode.content.length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+>jsxNode.content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 291, 9))
+>content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+}
+
+/**
+ * Create a component class with child content, using HyperScript syntax and JSX syntax
+ */
+export function testComponentClassWithChildren() {
+>testComponentClassWithChildren : Symbol(testComponentClassWithChildren, Decl(petit-dom-tests.tsx, 302, 1))
+
+    class ComponentClassWithChildren {
+>ComponentClassWithChildren : Symbol(ComponentClassWithChildren, Decl(petit-dom-tests.tsx, 307, 50))
+
+        props: CustomProps;
+>props : Symbol(ComponentClassWithChildren.props, Decl(petit-dom-tests.tsx, 308, 38))
+>CustomProps : Symbol(CustomProps, Decl(petit-dom-tests.tsx, 8, 45))
+
+        constructor(props: CustomProps) {
+>props : Symbol(props, Decl(petit-dom-tests.tsx, 311, 20))
+>CustomProps : Symbol(CustomProps, Decl(petit-dom-tests.tsx, 8, 45))
+
+            this.props = props;
+>this.props : Symbol(ComponentClassWithChildren.props, Decl(petit-dom-tests.tsx, 308, 38))
+>this : Symbol(ComponentClassWithChildren, Decl(petit-dom-tests.tsx, 307, 50))
+>props : Symbol(ComponentClassWithChildren.props, Decl(petit-dom-tests.tsx, 308, 38))
+>props : Symbol(props, Decl(petit-dom-tests.tsx, 311, 20))
+        }
+
+        mount(props: CustomProps, content: ReadonlyArray<PetitDom.Content>): Element {
+>mount : Symbol(ComponentClassWithChildren.mount, Decl(petit-dom-tests.tsx, 313, 9))
+>props : Symbol(props, Decl(petit-dom-tests.tsx, 315, 14))
+>CustomProps : Symbol(CustomProps, Decl(petit-dom-tests.tsx, 8, 45))
+>content : Symbol(content, Decl(petit-dom-tests.tsx, 315, 33))
+>ReadonlyArray : Symbol(ReadonlyArray, Decl(lib.es5.d.ts, --, --), Decl(lib.es2015.core.d.ts, --, --), Decl(lib.es2015.iterable.d.ts, --, --))
+>PetitDom : Symbol(PetitDom, Decl(petit-dom-tests.tsx, 4, 25))
+>Content : Symbol(PetitDom.Content, Decl(index.d.ts, 93, 60))
+>Element : Symbol(Element, Decl(lib.dom.d.ts, --, --), Decl(lib.dom.d.ts, --, --))
+
+            const { name, count, onSomeEvent } = props;
+>name : Symbol(name, Decl(petit-dom-tests.tsx, 316, 19))
+>count : Symbol(count, Decl(petit-dom-tests.tsx, 316, 25))
+>onSomeEvent : Symbol(onSomeEvent, Decl(petit-dom-tests.tsx, 316, 32))
+>props : Symbol(props, Decl(petit-dom-tests.tsx, 315, 14))
+
+            return mount(
+>mount : Symbol(mount, Decl(petit-dom-tests.tsx, 4, 11))
+
+                <div className={name} tabIndex={count} onclick={onSomeEvent}>{content}</div>
+>div : Symbol("div", Decl(lib.dom.d.ts, --, --))
+>className : Symbol(className, Decl(petit-dom-tests.tsx, 318, 20))
+>name : Symbol(name, Decl(petit-dom-tests.tsx, 316, 19))
+>tabIndex : Symbol(tabIndex, Decl(petit-dom-tests.tsx, 318, 37))
+>count : Symbol(count, Decl(petit-dom-tests.tsx, 316, 25))
+>onclick : Symbol(onclick, Decl(petit-dom-tests.tsx, 318, 54))
+>onSomeEvent : Symbol(onSomeEvent, Decl(petit-dom-tests.tsx, 316, 32))
+>content : Symbol(content, Decl(petit-dom-tests.tsx, 315, 33))
+>div : Symbol("div", Decl(lib.dom.d.ts, --, --))
+
+            );
+        }
+
+        patch(element: Element, newProps: CustomProps, oldProps: CustomProps, newContent: ReadonlyArray<PetitDom.VNode>, oldContent: ReadonlyArray<PetitDom.VNode>): Element {
+>patch : Symbol(ComponentClassWithChildren.patch, Decl(petit-dom-tests.tsx, 320, 9))
+>element : Symbol(element, Decl(petit-dom-tests.tsx, 322, 14))
+>Element : Symbol(Element, Decl(lib.dom.d.ts, --, --), Decl(lib.dom.d.ts, --, --))
+>newProps : Symbol(newProps, Decl(petit-dom-tests.tsx, 322, 31))
+>CustomProps : Symbol(CustomProps, Decl(petit-dom-tests.tsx, 8, 45))
+>oldProps : Symbol(oldProps, Decl(petit-dom-tests.tsx, 322, 54))
+>CustomProps : Symbol(CustomProps, Decl(petit-dom-tests.tsx, 8, 45))
+>newContent : Symbol(newContent, Decl(petit-dom-tests.tsx, 322, 77))
+>ReadonlyArray : Symbol(ReadonlyArray, Decl(lib.es5.d.ts, --, --), Decl(lib.es2015.core.d.ts, --, --), Decl(lib.es2015.iterable.d.ts, --, --))
+>PetitDom : Symbol(PetitDom, Decl(petit-dom-tests.tsx, 4, 25))
+>VNode : Symbol(PetitDom.VNode, Decl(index.d.ts, 127, 5))
+>oldContent : Symbol(oldContent, Decl(petit-dom-tests.tsx, 322, 120))
+>ReadonlyArray : Symbol(ReadonlyArray, Decl(lib.es5.d.ts, --, --), Decl(lib.es2015.core.d.ts, --, --), Decl(lib.es2015.iterable.d.ts, --, --))
+>PetitDom : Symbol(PetitDom, Decl(petit-dom-tests.tsx, 4, 25))
+>VNode : Symbol(PetitDom.VNode, Decl(index.d.ts, 127, 5))
+>Element : Symbol(Element, Decl(lib.dom.d.ts, --, --), Decl(lib.dom.d.ts, --, --))
+
+            patch(
+>patch : Symbol(patch, Decl(petit-dom-tests.tsx, 4, 18))
+
+                <div {...oldProps}>{oldContent}</div>,
+>div : Symbol("div", Decl(lib.dom.d.ts, --, --))
+>oldProps : Symbol(oldProps, Decl(petit-dom-tests.tsx, 322, 54))
+>oldContent : Symbol(oldContent, Decl(petit-dom-tests.tsx, 322, 120))
+>div : Symbol("div", Decl(lib.dom.d.ts, --, --))
+
+                <div {...newProps}>{newContent}</div>
+>div : Symbol("div", Decl(lib.dom.d.ts, --, --))
+>newProps : Symbol(newProps, Decl(petit-dom-tests.tsx, 322, 31))
+>newContent : Symbol(newContent, Decl(petit-dom-tests.tsx, 322, 77))
+>div : Symbol("div", Decl(lib.dom.d.ts, --, --))
+
+            );
+            return element;
+>element : Symbol(element, Decl(petit-dom-tests.tsx, 322, 14))
+        }
+
+        unmount(element: Element): void {
+>unmount : Symbol(ComponentClassWithChildren.unmount, Decl(petit-dom-tests.tsx, 328, 9))
+>element : Symbol(element, Decl(petit-dom-tests.tsx, 330, 16))
+>Element : Symbol(Element, Decl(lib.dom.d.ts, --, --), Decl(lib.dom.d.ts, --, --))
+
+            unmount(<div> Hello World</div >);
+>unmount : Symbol(unmount, Decl(petit-dom-tests.tsx, 4, 35))
+>div : Symbol("div", Decl(lib.dom.d.ts, --, --))
+>div : Symbol("div", Decl(lib.dom.d.ts, --, --))
+        }
+    }
+
+    // HyperScript syntax returns a ComponentClassNode<T> object, with typed properties
+    const node = h(
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 336, 9))
+>h : Symbol(h, Decl(petit-dom-tests.tsx, 4, 8))
+
+        ComponentClassWithChildren,
+>ComponentClassWithChildren : Symbol(ComponentClassWithChildren, Decl(petit-dom-tests.tsx, 307, 50))
+
+        { name: "xyz", count: 123, onSomeEvent: eventHandler },
+>name : Symbol(name, Decl(petit-dom-tests.tsx, 338, 9))
+>count : Symbol(count, Decl(petit-dom-tests.tsx, 338, 22))
+>onSomeEvent : Symbol(onSomeEvent, Decl(petit-dom-tests.tsx, 338, 34))
+>eventHandler : Symbol(eventHandler, Decl(petit-dom-tests.tsx, 6, 39))
+
+        "Hello",
+        h("span", null, "World")
+>h : Symbol(h, Decl(petit-dom-tests.tsx, 4, 8))
+
+    );
+
+    assertEqual(node.isSVG, false);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 336, 9))
+>isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+
+    assertEqual(node.type, ComponentClassWithChildren);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.type : Symbol(PetitDom.ComponentClassNode.type, Decl(index.d.ts, 147, 74))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 336, 9))
+>type : Symbol(PetitDom.ComponentClassNode.type, Decl(index.d.ts, 147, 74))
+>ComponentClassWithChildren : Symbol(ComponentClassWithChildren, Decl(petit-dom-tests.tsx, 307, 50))
+
+    assertEqual(node.key, null);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 336, 9))
+>key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+
+    assertEqual(node.props.name, "xyz");
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.props.name : Symbol(CustomProps.name, Decl(petit-dom-tests.tsx, 10, 23))
+>node.props : Symbol(PetitDom.ComponentClassNode.props, Decl(index.d.ts, 148, 41))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 336, 9))
+>props : Symbol(PetitDom.ComponentClassNode.props, Decl(index.d.ts, 148, 41))
+>name : Symbol(CustomProps.name, Decl(petit-dom-tests.tsx, 10, 23))
+
+    assertEqual(node.props.count, 123);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.props.count : Symbol(CustomProps.count, Decl(petit-dom-tests.tsx, 11, 17))
+>node.props : Symbol(PetitDom.ComponentClassNode.props, Decl(index.d.ts, 148, 41))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 336, 9))
+>props : Symbol(PetitDom.ComponentClassNode.props, Decl(index.d.ts, 148, 41))
+>count : Symbol(CustomProps.count, Decl(petit-dom-tests.tsx, 11, 17))
+
+    assertEqual(node.props.onSomeEvent, eventHandler);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.props.onSomeEvent : Symbol(CustomProps.onSomeEvent, Decl(petit-dom-tests.tsx, 12, 18))
+>node.props : Symbol(PetitDom.ComponentClassNode.props, Decl(index.d.ts, 148, 41))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 336, 9))
+>props : Symbol(PetitDom.ComponentClassNode.props, Decl(index.d.ts, 148, 41))
+>onSomeEvent : Symbol(CustomProps.onSomeEvent, Decl(petit-dom-tests.tsx, 12, 18))
+>eventHandler : Symbol(eventHandler, Decl(petit-dom-tests.tsx, 6, 39))
+
+    assertEqual(node.content.length, 2);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>node.content.length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+>node.content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>node : Symbol(node, Decl(petit-dom-tests.tsx, 336, 9))
+>content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = (
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 352, 9))
+
+        <ComponentClassWithChildren name="xyz" count={123} onSomeEvent={eventHandler}>
+>ComponentClassWithChildren : Symbol(ComponentClassWithChildren, Decl(petit-dom-tests.tsx, 307, 50))
+>name : Symbol(name, Decl(petit-dom-tests.tsx, 353, 35))
+>count : Symbol(count, Decl(petit-dom-tests.tsx, 353, 46))
+>onSomeEvent : Symbol(onSomeEvent, Decl(petit-dom-tests.tsx, 353, 58))
+>eventHandler : Symbol(eventHandler, Decl(petit-dom-tests.tsx, 6, 39))
+
+            Hello <span>World</span>
+>span : Symbol("span", Decl(lib.dom.d.ts, --, --))
+>span : Symbol("span", Decl(lib.dom.d.ts, --, --))
+
+        </ComponentClassWithChildren>
+>ComponentClassWithChildren : Symbol(ComponentClassWithChildren, Decl(petit-dom-tests.tsx, 307, 50))
+
+    );
+    const jsxNodeType = jsxNode.type as PetitDom.ComponentClass<CustomProps>;
+>jsxNodeType : Symbol(jsxNodeType, Decl(petit-dom-tests.tsx, 357, 9))
+>jsxNode.type : Symbol(PetitDom.ComponentClassNode.type, Decl(index.d.ts, 147, 74))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 352, 9))
+>type : Symbol(PetitDom.ComponentClassNode.type, Decl(index.d.ts, 147, 74))
+>PetitDom : Symbol(PetitDom, Decl(petit-dom-tests.tsx, 4, 25))
+>ComponentClass : Symbol(PetitDom.ComponentClass, Decl(index.d.ts, 117, 5))
+>CustomProps : Symbol(CustomProps, Decl(petit-dom-tests.tsx, 8, 45))
+
+    const jsxNodeProps = jsxNode.props as CustomProps;
+>jsxNodeProps : Symbol(jsxNodeProps, Decl(petit-dom-tests.tsx, 358, 9))
+>jsxNode.props : Symbol(PetitDom.ComponentClassNode.props, Decl(index.d.ts, 148, 41))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 352, 9))
+>props : Symbol(PetitDom.ComponentClassNode.props, Decl(index.d.ts, 148, 41))
+>CustomProps : Symbol(CustomProps, Decl(petit-dom-tests.tsx, 8, 45))
+
+    assertEqual(jsxNode.isSVG, false);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNode.isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 352, 9))
+>isSVG : Symbol(PetitDom.VNode.isSVG, Decl(index.d.ts, 129, 21))
+
+    assertEqual(jsxNodeType, ComponentClassWithChildren);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNodeType : Symbol(jsxNodeType, Decl(petit-dom-tests.tsx, 357, 9))
+>ComponentClassWithChildren : Symbol(ComponentClassWithChildren, Decl(petit-dom-tests.tsx, 307, 50))
+
+    assertEqual(jsxNode.key, null);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNode.key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 352, 9))
+>key : Symbol(PetitDom.VNode.key, Decl(index.d.ts, 131, 27))
+
+    assertEqual(jsxNodeProps.name, "xyz");
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNodeProps.name : Symbol(CustomProps.name, Decl(petit-dom-tests.tsx, 10, 23))
+>jsxNodeProps : Symbol(jsxNodeProps, Decl(petit-dom-tests.tsx, 358, 9))
+>name : Symbol(CustomProps.name, Decl(petit-dom-tests.tsx, 10, 23))
+
+    assertEqual(jsxNodeProps.count, 123);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNodeProps.count : Symbol(CustomProps.count, Decl(petit-dom-tests.tsx, 11, 17))
+>jsxNodeProps : Symbol(jsxNodeProps, Decl(petit-dom-tests.tsx, 358, 9))
+>count : Symbol(CustomProps.count, Decl(petit-dom-tests.tsx, 11, 17))
+
+    assertEqual(jsxNodeProps.onSomeEvent, eventHandler);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNodeProps.onSomeEvent : Symbol(CustomProps.onSomeEvent, Decl(petit-dom-tests.tsx, 12, 18))
+>jsxNodeProps : Symbol(jsxNodeProps, Decl(petit-dom-tests.tsx, 358, 9))
+>onSomeEvent : Symbol(CustomProps.onSomeEvent, Decl(petit-dom-tests.tsx, 12, 18))
+>eventHandler : Symbol(eventHandler, Decl(petit-dom-tests.tsx, 6, 39))
+
+    assertEqual(jsxNode.content.length, 2);
+>assertEqual : Symbol(assertEqual, Decl(petit-dom-tests.tsx, 4, 63))
+>jsxNode.content.length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+>jsxNode.content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>jsxNode : Symbol(jsxNode, Decl(petit-dom-tests.tsx, 352, 9))
+>content : Symbol(PetitDom.VNode.content, Decl(index.d.ts, 133, 28))
+>length : Symbol(ReadonlyArray.length, Decl(lib.es5.d.ts, --, --))
+}
+
diff --git a/tests/baselines/reference/petitDomSimpleJsx.types b/tests/baselines/reference/petitDomSimpleJsx.types
new file mode 100644
index 0000000000000..081daec9e9015
--- /dev/null
+++ b/tests/baselines/reference/petitDomSimpleJsx.types
@@ -0,0 +1,2101 @@
+=== tests/cases/compiler/node_modules/petit-dom/index.d.ts ===
+// Modified type definitions for Petit-Dom 0.2
+// Project: https://github.com/yelouafi/petit-dom
+// Definitions by: James Messinger <https://github.com/JamesMessinger>, modified by @weswigham for testing
+// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
+// TypeScript Version: 3.4
+
+/**
+ * Creates a VNode of the specified HTML Element type and with the
+ * specified properties and contents.
+ *
+ * @param type - The tag name of element to create
+ * @param props - Properties to set on the element
+ * @param ...children - Child nodes
+ * @returns A new VNode object
+ */
+export function h<T extends keyof ElementTagNameMap, E extends ElementTagNameMap[T]>(
+>h : { <T extends "symbol" | "object" | "a" | "abbr" | "address" | "applet" | "area" | "article" | "aside" | "audio" | "b" | "base" | "basefont" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "dir" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "font" | "footer" | "form" | "frame" | "frameset" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "marquee" | "menu" | "meta" | "meter" | "nav" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "script" | "section" | "select" | "slot" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "tbody" | "td" | "template" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "svg" | "switch" | "text" | "textPath" | "tspan" | "use" | "view", E extends ElementTagNameMap[T]>(type: T, props?: PetitDom.Props<E> | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ElementNode<T, E>; <P extends object = object>(type: PetitDom.Component<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentNode<P>; <P extends object = object>(type: PetitDom.ComponentClass<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentClassNode<P>; <P extends object = object>(type: PetitDom.FunctionComponent<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.FunctionComponentNode<P>; }
+
+    type: T,
+>type : T
+
+    props?: PetitDom.Props<E> | null,
+>props : PetitDom.Props<E> | null | undefined
+>PetitDom : any
+>null : null
+
+    ...children: ReadonlyArray<PetitDom.Content>
+>children : readonly PetitDom.Content[]
+>PetitDom : any
+
+): PetitDom.ElementNode<T, E>;
+>PetitDom : any
+
+/**
+ * Creates a VNode using a PetitDom component object.
+ *
+ * @param type - A PetitDom component object
+ * @param props - Properties to set on the component
+ * @param ...children - Child nodes
+ * @returns A new VNode object
+ */
+export function h<P extends PetitDom.ComponentProps = PetitDom.ComponentProps>(
+>h : { <T extends "symbol" | "object" | "a" | "abbr" | "address" | "applet" | "area" | "article" | "aside" | "audio" | "b" | "base" | "basefont" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "dir" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "font" | "footer" | "form" | "frame" | "frameset" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "marquee" | "menu" | "meta" | "meter" | "nav" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "script" | "section" | "select" | "slot" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "tbody" | "td" | "template" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "svg" | "switch" | "text" | "textPath" | "tspan" | "use" | "view", E extends ElementTagNameMap[T]>(type: T, props?: PetitDom.Props<E> | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ElementNode<T, E>; <P extends object = object>(type: PetitDom.Component<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentNode<P>; <P extends object = object>(type: PetitDom.ComponentClass<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentClassNode<P>; <P extends object = object>(type: PetitDom.FunctionComponent<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.FunctionComponentNode<P>; }
+>PetitDom : any
+>PetitDom : any
+
+    type: PetitDom.Component<P>,
+>type : PetitDom.Component<P>
+>PetitDom : any
+
+    props?: (P & PetitDom.IntrinsicProps) | null,
+>props : (P & PetitDom.IntrinsicProps) | null | undefined
+>PetitDom : any
+>null : null
+
+    ...children: ReadonlyArray<PetitDom.Content>
+>children : readonly PetitDom.Content[]
+>PetitDom : any
+
+): PetitDom.ComponentNode<P>;
+>PetitDom : any
+
+/**
+ * Creates a VNode using a PetitDom component class.
+ *
+ * @param type - A PetitDom component class
+ * @param props - Properties to set on the component
+ * @param ...children - Child nodes
+ * @returns A new VNode object
+ */
+export function h<P extends PetitDom.ComponentProps = PetitDom.ComponentProps>(
+>h : { <T extends "symbol" | "object" | "a" | "abbr" | "address" | "applet" | "area" | "article" | "aside" | "audio" | "b" | "base" | "basefont" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "dir" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "font" | "footer" | "form" | "frame" | "frameset" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "marquee" | "menu" | "meta" | "meter" | "nav" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "script" | "section" | "select" | "slot" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "tbody" | "td" | "template" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "svg" | "switch" | "text" | "textPath" | "tspan" | "use" | "view", E extends ElementTagNameMap[T]>(type: T, props?: PetitDom.Props<E> | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ElementNode<T, E>; <P extends object = object>(type: PetitDom.Component<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentNode<P>; <P extends object = object>(type: PetitDom.ComponentClass<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentClassNode<P>; <P extends object = object>(type: PetitDom.FunctionComponent<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.FunctionComponentNode<P>; }
+>PetitDom : any
+>PetitDom : any
+
+    type: PetitDom.ComponentClass<P>,
+>type : PetitDom.ComponentClass<P>
+>PetitDom : any
+
+    props?: (P & PetitDom.IntrinsicProps) | null,
+>props : (P & PetitDom.IntrinsicProps) | null | undefined
+>PetitDom : any
+>null : null
+
+    ...children: ReadonlyArray<PetitDom.Content>
+>children : readonly PetitDom.Content[]
+>PetitDom : any
+
+): PetitDom.ComponentClassNode<P>;
+>PetitDom : any
+
+/**
+ * Creates a VNode using a PetitDom function component.
+ *
+ * This function is compatible with both JSX and HyperScript syntax.
+ *
+ * @param type - A PetitDom function component
+ * @param props - Properties to set on the component
+ * @param ...children - Child nodes
+ * @returns A new VNode object
+ */
+export function h<P extends PetitDom.ComponentProps = PetitDom.ComponentProps>(
+>h : { <T extends "symbol" | "object" | "a" | "abbr" | "address" | "applet" | "area" | "article" | "aside" | "audio" | "b" | "base" | "basefont" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "dir" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "font" | "footer" | "form" | "frame" | "frameset" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "marquee" | "menu" | "meta" | "meter" | "nav" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "script" | "section" | "select" | "slot" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "tbody" | "td" | "template" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "svg" | "switch" | "text" | "textPath" | "tspan" | "use" | "view", E extends ElementTagNameMap[T]>(type: T, props?: PetitDom.Props<E> | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ElementNode<T, E>; <P extends object = object>(type: PetitDom.Component<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentNode<P>; <P extends object = object>(type: PetitDom.ComponentClass<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentClassNode<P>; <P extends object = object>(type: PetitDom.FunctionComponent<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.FunctionComponentNode<P>; }
+>PetitDom : any
+>PetitDom : any
+
+    type: PetitDom.FunctionComponent<P>,
+>type : PetitDom.FunctionComponent<P>
+>PetitDom : any
+
+    props?: (P & PetitDom.IntrinsicProps) | null,
+>props : (P & PetitDom.IntrinsicProps) | null | undefined
+>PetitDom : any
+>null : null
+
+    ...children: ReadonlyArray<PetitDom.Content>
+>children : readonly PetitDom.Content[]
+>PetitDom : any
+
+): PetitDom.FunctionComponentNode<P>;
+>PetitDom : any
+
+/**
+ * Creates actual DOM Elements for the given VNode and its children.
+ *
+ * @param vnode - The VNode object to mount
+ * @returns The newly-created DOM element
+ */
+export function mount(vnode: PetitDom.VNode): Element;
+>mount : (vnode: PetitDom.VNode) => Element
+>vnode : PetitDom.VNode
+>PetitDom : any
+
+/**
+ * Diffs two VNodes and applies the necessary DOM changes
+ *
+ * @param newVNode - The new VNode object, which will be mounted to the DOM element of oldVNode
+ * @param oldVNode - The old VNode object to diff against
+ * @param parent - The parent DOM element. Used internally by PetitDom to recursively patch child nodes
+ * @returns The updated DOM element. This element is also moved from oldVNode to newVNode
+ */
+export function patch(newVNode: PetitDom.VNode, oldVNode: PetitDom.VNode, parent?: Element): Element;
+>patch : (newVNode: PetitDom.VNode, oldVNode: PetitDom.VNode, parent?: Element | undefined) => Element
+>newVNode : PetitDom.VNode
+>PetitDom : any
+>oldVNode : PetitDom.VNode
+>PetitDom : any
+>parent : Element | undefined
+
+/**
+ * Removes the given VNode from the actual DOM
+ *
+ * @param vnode - The VNode object to unmount
+ */
+export function unmount(vnode: PetitDom.VNode): void;
+>unmount : (vnode: PetitDom.VNode) => void
+>vnode : PetitDom.VNode
+>PetitDom : any
+
+export namespace PetitDom {
+    type Key = string | number;
+>Key : string | number
+
+    type ComponentProps = object;
+>ComponentProps : object
+
+    interface ContentArray extends ReadonlyArray<Content> {}
+    type Content = string | VNode | ContentArray;
+>Content : Content
+
+    type DOMElementProps<E extends Element> = {
+>DOMElementProps : DOMElementProps<E>
+
+        [P in keyof E]?: E[P];
+    };
+
+    interface IntrinsicProps {
+        content?: Content | ReadonlyArray<Content>;
+>content : string | VNode | ContentArray | readonly Content[] | undefined
+
+        key?: Key;
+>key : string | number | undefined
+    }
+
+    type Props<E extends Element = Element> = IntrinsicProps & DOMElementProps<E>;
+>Props : Props<E>
+
+    type ShouldUpdate<P extends ComponentProps> = (
+>ShouldUpdate : ShouldUpdate<P>
+
+        newProps: P,
+>newProps : P
+
+        oldProps: P,
+>oldProps : P
+
+        newContent: ReadonlyArray<VNode>,
+>newContent : readonly VNode[]
+
+        oldContent: ReadonlyArray<VNode>
+>oldContent : readonly VNode[]
+
+    ) => boolean;
+
+    interface FunctionComponent<P extends ComponentProps> {
+        (props: P, content: ReadonlyArray<Content>): FunctionComponentNode<P>;
+>props : P
+>content : readonly Content[]
+
+        shouldUpdate?: ShouldUpdate<P>;
+>shouldUpdate : ShouldUpdate<P> | undefined
+    }
+
+    interface ComponentClass<P extends ComponentProps> {
+        new(props: P, content: ReadonlyArray<Content>): Component<P>;
+>props : P
+>content : readonly Content[]
+    }
+
+    interface Component<P extends ComponentProps> {
+        mount(props: P, content: ReadonlyArray<VNode>): Element;
+>mount : (props: P, content: readonly VNode[]) => Element
+>props : P
+>content : readonly VNode[]
+
+        patch(element: Element, newProps: P, oldProps: P, newContent: ReadonlyArray<VNode>, oldContent: ReadonlyArray<VNode>): Element;
+>patch : (element: Element, newProps: P, oldProps: P, newContent: readonly VNode[], oldContent: readonly VNode[]) => Element
+>element : Element
+>newProps : P
+>oldProps : P
+>newContent : readonly VNode[]
+>oldContent : readonly VNode[]
+
+        unmount(element: Element): void;
+>unmount : (element: Element) => void
+>element : Element
+    }
+
+    interface VNode {
+        readonly isSVG: boolean;
+>isSVG : boolean
+
+        readonly type: any;
+>type : any
+
+        readonly key: Key | null;
+>key : string | number | null
+>null : null
+
+        readonly props: any;
+>props : any
+
+        readonly content: ReadonlyArray<VNode>;
+>content : readonly VNode[]
+    }
+
+    interface ElementNode<T extends keyof DomElements, E extends DomElements[T]> extends VNode {
+        readonly type: T;
+>type : T
+
+        readonly props: Props<E>;
+>props : Props<E>
+    }
+
+    interface ComponentNode<P extends ComponentProps> extends VNode {
+        readonly type: Component<P>;
+>type : Component<P>
+
+        readonly props: P & IntrinsicProps;
+>props : P & IntrinsicProps
+    }
+
+    interface ComponentClassNode<P extends ComponentProps> extends VNode {
+        readonly type: ComponentClass<P>;
+>type : ComponentClass<P>
+
+        readonly props: P & IntrinsicProps;
+>props : P & IntrinsicProps
+    }
+
+    interface FunctionComponentNode<P extends ComponentProps> extends VNode {
+        readonly type: FunctionComponent<P>;
+>type : FunctionComponent<P>
+
+        readonly props: P & IntrinsicProps;
+>props : P & IntrinsicProps
+    }
+
+    interface DomElements extends HTMLElementTagNameMap, SVGElementTagNameMap {
+        "main": HTMLMainElement;
+>"main" : HTMLMainElement
+    }
+}
+
+declare global {
+>global : any
+
+    namespace JSX {
+        // tslint:disable-next-line:no-empty-interface
+        interface Element extends PetitDom.VNode { }
+>PetitDom : any
+
+        // tslint:disable-next-line:no-empty-interface
+        interface ElementClass extends PetitDom.Component<PetitDom.ComponentProps> { }
+>PetitDom : any
+>PetitDom : any
+
+        // tslint:disable-next-line:no-empty-interface
+        interface IntrinsicClassAttributes<T> extends PetitDom.Props { }
+>PetitDom : any
+
+        // tslint:disable-next-line:no-empty-interface
+        interface IntrinsicAttributes extends PetitDom.IntrinsicProps { }
+>PetitDom : any
+
+        interface ElementAttributesProperty { props: PetitDom.Props; }
+>props : PetitDom.Props<Element>
+>PetitDom : any
+
+        interface ElementChildrenAttribute { content: PetitDom.VNode[]; }
+>content : PetitDom.VNode[]
+>PetitDom : any
+
+        type IntrinsicElements = {
+>IntrinsicElements : IntrinsicElements
+
+            [P in keyof PetitDom.DomElements]:
+>PetitDom : any
+
+            PetitDom.Props<PetitDom.DomElements[P]> &
+>PetitDom : any
+>PetitDom : any
+            {
+                content?: PetitDom.Content | ReadonlyArray<PetitDom.Content>;
+>content : string | PetitDom.VNode | PetitDom.ContentArray | readonly PetitDom.Content[] | undefined
+>PetitDom : any
+>PetitDom : any
+
+            };
+        };
+    }
+}
+
+=== tests/cases/compiler/petit-dom-tests.tsx ===
+/* @jsx h */
+// tslint:disable:no-empty
+// tslint:disable:no-null-keyword
+
+import { h, mount, patch, PetitDom, unmount } from "petit-dom";
+>h : { <T extends "symbol" | "object" | "a" | "abbr" | "address" | "applet" | "area" | "article" | "aside" | "audio" | "b" | "base" | "basefont" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "dir" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "font" | "footer" | "form" | "frame" | "frameset" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "marquee" | "menu" | "meta" | "meter" | "nav" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "script" | "section" | "select" | "slot" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "tbody" | "td" | "template" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "svg" | "switch" | "text" | "textPath" | "tspan" | "use" | "view", E extends ElementTagNameMap[T]>(type: T, props?: PetitDom.Props<E> | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ElementNode<T, E>; <P extends object = object>(type: PetitDom.Component<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentNode<P>; <P extends object = object>(type: PetitDom.ComponentClass<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentClassNode<P>; <P extends object = object>(type: PetitDom.FunctionComponent<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.FunctionComponentNode<P>; }
+>mount : (vnode: PetitDom.VNode) => Element
+>patch : (newVNode: PetitDom.VNode, oldVNode: PetitDom.VNode, parent?: Element | undefined) => Element
+>PetitDom : any
+>unmount : (vnode: PetitDom.VNode) => void
+
+function assertEqual<T>(a: T, b: T) { }
+>assertEqual : <T>(a: T, b: T) => void
+>a : T
+>b : T
+
+function eventHandler(event: Event): void { }
+>eventHandler : (event: Event) => void
+>event : Event
+
+interface CustomProps {
+    name: string;
+>name : string
+
+    count: number;
+>count : number
+
+    onSomeEvent(event: Event): void;
+>onSomeEvent : (event: Event) => void
+>event : Event
+}
+
+/**
+ * Create an <a> element with text content, using HyperScript syntax and JSX syntax
+ */
+export function testHtmlElementWithTextContent() {
+>testHtmlElementWithTextContent : () => void
+
+    // HyperScript syntax returns an ElementNode<T> object, with typed properties
+    const aNode = h("a", { href: "link", onclick: eventHandler }, "click here");
+>aNode : PetitDom.ElementNode<"a", HTMLAnchorElement>
+>h("a", { href: "link", onclick: eventHandler }, "click here") : PetitDom.ElementNode<"a", HTMLAnchorElement>
+>h : { <T extends "symbol" | "object" | "a" | "abbr" | "address" | "applet" | "area" | "article" | "aside" | "audio" | "b" | "base" | "basefont" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "dir" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "font" | "footer" | "form" | "frame" | "frameset" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "marquee" | "menu" | "meta" | "meter" | "nav" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "script" | "section" | "select" | "slot" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "tbody" | "td" | "template" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "svg" | "switch" | "text" | "textPath" | "tspan" | "use" | "view", E extends ElementTagNameMap[T]>(type: T, props?: PetitDom.Props<E> | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ElementNode<T, E>; <P extends object = object>(type: PetitDom.Component<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentNode<P>; <P extends object = object>(type: PetitDom.ComponentClass<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentClassNode<P>; <P extends object = object>(type: PetitDom.FunctionComponent<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.FunctionComponentNode<P>; }
+>"a" : "a"
+>{ href: "link", onclick: eventHandler } : { href: string; onclick: (event: Event) => void; }
+>href : string
+>"link" : "link"
+>onclick : (event: Event) => void
+>eventHandler : (event: Event) => void
+>"click here" : "click here"
+
+    assertEqual(aNode.isSVG, false);
+>assertEqual(aNode.isSVG, false) : void
+>assertEqual : <T>(a: T, b: T) => void
+>aNode.isSVG : boolean
+>aNode : PetitDom.ElementNode<"a", HTMLAnchorElement>
+>isSVG : boolean
+>false : false
+
+    assertEqual(aNode.type, "a");
+>assertEqual(aNode.type, "a") : void
+>assertEqual : <T>(a: T, b: T) => void
+>aNode.type : "a"
+>aNode : PetitDom.ElementNode<"a", HTMLAnchorElement>
+>type : "a"
+>"a" : "a"
+
+    assertEqual(aNode.key, null);
+>assertEqual(aNode.key, null) : void
+>assertEqual : <T>(a: T, b: T) => void
+>aNode.key : string | number | null
+>aNode : PetitDom.ElementNode<"a", HTMLAnchorElement>
+>key : string | number | null
+>null : null
+
+    assertEqual(aNode.props.href, "link");
+>assertEqual(aNode.props.href, "link") : void
+>assertEqual : <T>(a: T, b: T) => void
+>aNode.props.href : string | undefined
+>aNode.props : PetitDom.Props<HTMLAnchorElement>
+>aNode : PetitDom.ElementNode<"a", HTMLAnchorElement>
+>props : PetitDom.Props<HTMLAnchorElement>
+>href : string | undefined
+>"link" : "link"
+
+    assertEqual(aNode.props.onclick, eventHandler);
+>assertEqual(aNode.props.onclick, eventHandler) : void
+>assertEqual : <T>(a: T, b: T) => void
+>aNode.props.onclick : ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null | undefined
+>aNode.props : PetitDom.Props<HTMLAnchorElement>
+>aNode : PetitDom.ElementNode<"a", HTMLAnchorElement>
+>props : PetitDom.Props<HTMLAnchorElement>
+>onclick : ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null | undefined
+>eventHandler : (event: Event) => void
+
+    assertEqual(aNode.content.length, 1);
+>assertEqual(aNode.content.length, 1) : void
+>assertEqual : <T>(a: T, b: T) => void
+>aNode.content.length : number
+>aNode.content : readonly PetitDom.VNode[]
+>aNode : PetitDom.ElementNode<"a", HTMLAnchorElement>
+>content : readonly PetitDom.VNode[]
+>length : number
+>1 : 1
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = <a href="link" onclick={eventHandler}>click here</a>;
+>jsxNode : PetitDom.ElementNode<"a", HTMLAnchorElement>
+><a href="link" onclick={eventHandler}>click here</a> : PetitDom.ElementNode<"a", HTMLAnchorElement>
+>a : any
+>href : string
+>onclick : (event: Event) => void
+>eventHandler : (event: Event) => void
+>a : any
+
+    const jsxNodeType = jsxNode.type as string;
+>jsxNodeType : string
+>jsxNode.type as string : string
+>jsxNode.type : "a"
+>jsxNode : PetitDom.ElementNode<"a", HTMLAnchorElement>
+>type : "a"
+
+    const jsxNodeProps = jsxNode.props as PetitDom.Props<HTMLAnchorElement>;
+>jsxNodeProps : PetitDom.Props<HTMLAnchorElement>
+>jsxNode.props as PetitDom.Props<HTMLAnchorElement> : PetitDom.Props<HTMLAnchorElement>
+>jsxNode.props : PetitDom.Props<HTMLAnchorElement>
+>jsxNode : PetitDom.ElementNode<"a", HTMLAnchorElement>
+>props : PetitDom.Props<HTMLAnchorElement>
+>PetitDom : any
+
+    assertEqual(jsxNode.isSVG, false);
+>assertEqual(jsxNode.isSVG, false) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNode.isSVG : boolean
+>jsxNode : PetitDom.ElementNode<"a", HTMLAnchorElement>
+>isSVG : boolean
+>false : false
+
+    assertEqual(jsxNodeType, "a");
+>assertEqual(jsxNodeType, "a") : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNodeType : string
+>"a" : "a"
+
+    assertEqual(jsxNode.key, null);
+>assertEqual(jsxNode.key, null) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNode.key : string | number | null
+>jsxNode : PetitDom.ElementNode<"a", HTMLAnchorElement>
+>key : string | number | null
+>null : null
+
+    assertEqual(jsxNodeProps.href, "link");
+>assertEqual(jsxNodeProps.href, "link") : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNodeProps.href : string | undefined
+>jsxNodeProps : PetitDom.Props<HTMLAnchorElement>
+>href : string | undefined
+>"link" : "link"
+
+    assertEqual(jsxNodeProps.onclick, eventHandler);
+>assertEqual(jsxNodeProps.onclick, eventHandler) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNodeProps.onclick : ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null | undefined
+>jsxNodeProps : PetitDom.Props<HTMLAnchorElement>
+>onclick : ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null | undefined
+>eventHandler : (event: Event) => void
+
+    assertEqual(jsxNode.content.length, 1);
+>assertEqual(jsxNode.content.length, 1) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNode.content.length : number
+>jsxNode.content : readonly PetitDom.VNode[]
+>jsxNode : PetitDom.ElementNode<"a", HTMLAnchorElement>
+>content : readonly PetitDom.VNode[]
+>length : number
+>1 : 1
+}
+
+/**
+ * Create a <form> element with both text content and child elements, using HyperScript syntax and JSX syntax
+ */
+export function testHtmlElementWithMixedContent() {
+>testHtmlElementWithMixedContent : () => void
+
+    // HyperScript syntax returns an ElementNode<T> object, with typed properties
+    const formNode = h(
+>formNode : PetitDom.ElementNode<"form", HTMLFormElement>
+>h(        "form",        { key: 1, method: "POST", onsubmit: eventHandler },        "Hello ", h("span", null, "World")    ) : PetitDom.ElementNode<"form", HTMLFormElement>
+>h : { <T extends "symbol" | "object" | "a" | "abbr" | "address" | "applet" | "area" | "article" | "aside" | "audio" | "b" | "base" | "basefont" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "dir" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "font" | "footer" | "form" | "frame" | "frameset" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "marquee" | "menu" | "meta" | "meter" | "nav" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "script" | "section" | "select" | "slot" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "tbody" | "td" | "template" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "svg" | "switch" | "text" | "textPath" | "tspan" | "use" | "view", E extends ElementTagNameMap[T]>(type: T, props?: PetitDom.Props<E> | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ElementNode<T, E>; <P extends object = object>(type: PetitDom.Component<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentNode<P>; <P extends object = object>(type: PetitDom.ComponentClass<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentClassNode<P>; <P extends object = object>(type: PetitDom.FunctionComponent<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.FunctionComponentNode<P>; }
+
+        "form",
+>"form" : "form"
+
+        { key: 1, method: "POST", onsubmit: eventHandler },
+>{ key: 1, method: "POST", onsubmit: eventHandler } : { key: number; method: string; onsubmit: (event: Event) => void; }
+>key : number
+>1 : 1
+>method : string
+>"POST" : "POST"
+>onsubmit : (event: Event) => void
+>eventHandler : (event: Event) => void
+
+        "Hello ", h("span", null, "World")
+>"Hello " : "Hello "
+>h("span", null, "World") : PetitDom.ElementNode<"span", HTMLSpanElement>
+>h : { <T extends "symbol" | "object" | "a" | "abbr" | "address" | "applet" | "area" | "article" | "aside" | "audio" | "b" | "base" | "basefont" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "dir" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "font" | "footer" | "form" | "frame" | "frameset" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "marquee" | "menu" | "meta" | "meter" | "nav" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "script" | "section" | "select" | "slot" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "tbody" | "td" | "template" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "svg" | "switch" | "text" | "textPath" | "tspan" | "use" | "view", E extends ElementTagNameMap[T]>(type: T, props?: PetitDom.Props<E> | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ElementNode<T, E>; <P extends object = object>(type: PetitDom.Component<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentNode<P>; <P extends object = object>(type: PetitDom.ComponentClass<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentClassNode<P>; <P extends object = object>(type: PetitDom.FunctionComponent<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.FunctionComponentNode<P>; }
+>"span" : "span"
+>null : null
+>"World" : "World"
+
+    );
+
+    assertEqual(formNode.isSVG, false);
+>assertEqual(formNode.isSVG, false) : void
+>assertEqual : <T>(a: T, b: T) => void
+>formNode.isSVG : boolean
+>formNode : PetitDom.ElementNode<"form", HTMLFormElement>
+>isSVG : boolean
+>false : false
+
+    assertEqual(formNode.type, "form");
+>assertEqual(formNode.type, "form") : void
+>assertEqual : <T>(a: T, b: T) => void
+>formNode.type : "form"
+>formNode : PetitDom.ElementNode<"form", HTMLFormElement>
+>type : "form"
+>"form" : "form"
+
+    assertEqual(formNode.key, 1);
+>assertEqual(formNode.key, 1) : void
+>assertEqual : <T>(a: T, b: T) => void
+>formNode.key : string | number | null
+>formNode : PetitDom.ElementNode<"form", HTMLFormElement>
+>key : string | number | null
+>1 : 1
+
+    assertEqual(formNode.props.method, "POST");
+>assertEqual(formNode.props.method, "POST") : void
+>assertEqual : <T>(a: T, b: T) => void
+>formNode.props.method : string | undefined
+>formNode.props : PetitDom.Props<HTMLFormElement>
+>formNode : PetitDom.ElementNode<"form", HTMLFormElement>
+>props : PetitDom.Props<HTMLFormElement>
+>method : string | undefined
+>"POST" : "POST"
+
+    assertEqual(formNode.props.onsubmit, eventHandler);
+>assertEqual(formNode.props.onsubmit, eventHandler) : void
+>assertEqual : <T>(a: T, b: T) => void
+>formNode.props.onsubmit : ((this: GlobalEventHandlers, ev: Event) => any) | null | undefined
+>formNode.props : PetitDom.Props<HTMLFormElement>
+>formNode : PetitDom.ElementNode<"form", HTMLFormElement>
+>props : PetitDom.Props<HTMLFormElement>
+>onsubmit : ((this: GlobalEventHandlers, ev: Event) => any) | null | undefined
+>eventHandler : (event: Event) => void
+
+    assertEqual(formNode.content.length, 2);
+>assertEqual(formNode.content.length, 2) : void
+>assertEqual : <T>(a: T, b: T) => void
+>formNode.content.length : number
+>formNode.content : readonly PetitDom.VNode[]
+>formNode : PetitDom.ElementNode<"form", HTMLFormElement>
+>content : readonly PetitDom.VNode[]
+>length : number
+>2 : 2
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = <form key={1} method="POST" onsubmit={eventHandler}>Hello <span>World</span></form>;
+>jsxNode : PetitDom.ElementNode<"form", HTMLFormElement>
+><form key={1} method="POST" onsubmit={eventHandler}>Hello <span>World</span></form> : PetitDom.ElementNode<"form", HTMLFormElement>
+>form : any
+>key : number
+>1 : 1
+>method : string
+>onsubmit : (event: Event) => void
+>eventHandler : (event: Event) => void
+><span>World</span> : PetitDom.ElementNode<"span", HTMLSpanElement>
+>span : any
+>span : any
+>form : any
+
+    const jsxNodeType = jsxNode.type as string;
+>jsxNodeType : string
+>jsxNode.type as string : string
+>jsxNode.type : "form"
+>jsxNode : PetitDom.ElementNode<"form", HTMLFormElement>
+>type : "form"
+
+    const jsxNodeProps = jsxNode.props as PetitDom.Props<HTMLFormElement>;
+>jsxNodeProps : PetitDom.Props<HTMLFormElement>
+>jsxNode.props as PetitDom.Props<HTMLFormElement> : PetitDom.Props<HTMLFormElement>
+>jsxNode.props : PetitDom.Props<HTMLFormElement>
+>jsxNode : PetitDom.ElementNode<"form", HTMLFormElement>
+>props : PetitDom.Props<HTMLFormElement>
+>PetitDom : any
+
+    assertEqual(jsxNode.isSVG, false);
+>assertEqual(jsxNode.isSVG, false) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNode.isSVG : boolean
+>jsxNode : PetitDom.ElementNode<"form", HTMLFormElement>
+>isSVG : boolean
+>false : false
+
+    assertEqual(jsxNodeType, "form");
+>assertEqual(jsxNodeType, "form") : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNodeType : string
+>"form" : "form"
+
+    assertEqual(jsxNode.key, 1);
+>assertEqual(jsxNode.key, 1) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNode.key : string | number | null
+>jsxNode : PetitDom.ElementNode<"form", HTMLFormElement>
+>key : string | number | null
+>1 : 1
+
+    assertEqual(jsxNodeProps.method, "POST");
+>assertEqual(jsxNodeProps.method, "POST") : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNodeProps.method : string | undefined
+>jsxNodeProps : PetitDom.Props<HTMLFormElement>
+>method : string | undefined
+>"POST" : "POST"
+
+    assertEqual(jsxNodeProps.onsubmit, eventHandler);
+>assertEqual(jsxNodeProps.onsubmit, eventHandler) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNodeProps.onsubmit : ((this: GlobalEventHandlers, ev: Event) => any) | null | undefined
+>jsxNodeProps : PetitDom.Props<HTMLFormElement>
+>onsubmit : ((this: GlobalEventHandlers, ev: Event) => any) | null | undefined
+>eventHandler : (event: Event) => void
+
+    assertEqual(jsxNode.content.length, 2);
+>assertEqual(jsxNode.content.length, 2) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNode.content.length : number
+>jsxNode.content : readonly PetitDom.VNode[]
+>jsxNode : PetitDom.ElementNode<"form", HTMLFormElement>
+>content : readonly PetitDom.VNode[]
+>length : number
+>2 : 2
+}
+
+/**
+ * Create an <svg> element with a child element, using HyperScript syntax and JSX syntax
+ */
+export function testSvgElementWithChild() {
+>testSvgElementWithChild : () => void
+
+    // HyperScript syntax returns an ElementNode<T> object, with typed properties
+    const svgNode = h("svg", { key: 2, currentScale: 1 }, h("path"));
+>svgNode : PetitDom.ElementNode<"svg", SVGSVGElement>
+>h("svg", { key: 2, currentScale: 1 }, h("path")) : PetitDom.ElementNode<"svg", SVGSVGElement>
+>h : { <T extends "symbol" | "object" | "a" | "abbr" | "address" | "applet" | "area" | "article" | "aside" | "audio" | "b" | "base" | "basefont" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "dir" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "font" | "footer" | "form" | "frame" | "frameset" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "marquee" | "menu" | "meta" | "meter" | "nav" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "script" | "section" | "select" | "slot" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "tbody" | "td" | "template" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "svg" | "switch" | "text" | "textPath" | "tspan" | "use" | "view", E extends ElementTagNameMap[T]>(type: T, props?: PetitDom.Props<E> | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ElementNode<T, E>; <P extends object = object>(type: PetitDom.Component<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentNode<P>; <P extends object = object>(type: PetitDom.ComponentClass<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentClassNode<P>; <P extends object = object>(type: PetitDom.FunctionComponent<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.FunctionComponentNode<P>; }
+>"svg" : "svg"
+>{ key: 2, currentScale: 1 } : { key: number; currentScale: number; }
+>key : number
+>2 : 2
+>currentScale : number
+>1 : 1
+>h("path") : PetitDom.ElementNode<"path", SVGPathElement>
+>h : { <T extends "symbol" | "object" | "a" | "abbr" | "address" | "applet" | "area" | "article" | "aside" | "audio" | "b" | "base" | "basefont" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "dir" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "font" | "footer" | "form" | "frame" | "frameset" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "marquee" | "menu" | "meta" | "meter" | "nav" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "script" | "section" | "select" | "slot" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "tbody" | "td" | "template" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "svg" | "switch" | "text" | "textPath" | "tspan" | "use" | "view", E extends ElementTagNameMap[T]>(type: T, props?: PetitDom.Props<E> | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ElementNode<T, E>; <P extends object = object>(type: PetitDom.Component<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentNode<P>; <P extends object = object>(type: PetitDom.ComponentClass<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentClassNode<P>; <P extends object = object>(type: PetitDom.FunctionComponent<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.FunctionComponentNode<P>; }
+>"path" : "path"
+
+    assertEqual(svgNode.isSVG, true);
+>assertEqual(svgNode.isSVG, true) : void
+>assertEqual : <T>(a: T, b: T) => void
+>svgNode.isSVG : boolean
+>svgNode : PetitDom.ElementNode<"svg", SVGSVGElement>
+>isSVG : boolean
+>true : true
+
+    assertEqual(svgNode.type, "svg");
+>assertEqual(svgNode.type, "svg") : void
+>assertEqual : <T>(a: T, b: T) => void
+>svgNode.type : "svg"
+>svgNode : PetitDom.ElementNode<"svg", SVGSVGElement>
+>type : "svg"
+>"svg" : "svg"
+
+    assertEqual(svgNode.key, 2);
+>assertEqual(svgNode.key, 2) : void
+>assertEqual : <T>(a: T, b: T) => void
+>svgNode.key : string | number | null
+>svgNode : PetitDom.ElementNode<"svg", SVGSVGElement>
+>key : string | number | null
+>2 : 2
+
+    assertEqual(svgNode.props.currentScale, 1);
+>assertEqual(svgNode.props.currentScale, 1) : void
+>assertEqual : <T>(a: T, b: T) => void
+>svgNode.props.currentScale : number | undefined
+>svgNode.props : PetitDom.Props<SVGSVGElement>
+>svgNode : PetitDom.ElementNode<"svg", SVGSVGElement>
+>props : PetitDom.Props<SVGSVGElement>
+>currentScale : number | undefined
+>1 : 1
+
+    assertEqual(svgNode.content.length, 1);
+>assertEqual(svgNode.content.length, 1) : void
+>assertEqual : <T>(a: T, b: T) => void
+>svgNode.content.length : number
+>svgNode.content : readonly PetitDom.VNode[]
+>svgNode : PetitDom.ElementNode<"svg", SVGSVGElement>
+>content : readonly PetitDom.VNode[]
+>length : number
+>1 : 1
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = <svg key={2} currentScale={1}><path /></svg>;
+>jsxNode : PetitDom.ElementNode<"svg", SVGSVGElement>
+><svg key={2} currentScale={1}><path /></svg> : PetitDom.ElementNode<"svg", SVGSVGElement>
+>svg : any
+>key : number
+>2 : 2
+>currentScale : number
+>1 : 1
+><path /> : PetitDom.ElementNode<"path", SVGPathElement>
+>path : any
+>svg : any
+
+    const jsxNodeType = jsxNode.type as string;
+>jsxNodeType : string
+>jsxNode.type as string : string
+>jsxNode.type : "svg"
+>jsxNode : PetitDom.ElementNode<"svg", SVGSVGElement>
+>type : "svg"
+
+    const jsxNodeProps = jsxNode.props as PetitDom.Props<SVGSVGElement>;
+>jsxNodeProps : PetitDom.Props<SVGSVGElement>
+>jsxNode.props as PetitDom.Props<SVGSVGElement> : PetitDom.Props<SVGSVGElement>
+>jsxNode.props : PetitDom.Props<SVGSVGElement>
+>jsxNode : PetitDom.ElementNode<"svg", SVGSVGElement>
+>props : PetitDom.Props<SVGSVGElement>
+>PetitDom : any
+
+    assertEqual(jsxNode.isSVG, true);
+>assertEqual(jsxNode.isSVG, true) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNode.isSVG : boolean
+>jsxNode : PetitDom.ElementNode<"svg", SVGSVGElement>
+>isSVG : boolean
+>true : true
+
+    assertEqual(jsxNodeType, "svg");
+>assertEqual(jsxNodeType, "svg") : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNodeType : string
+>"svg" : "svg"
+
+    assertEqual(jsxNode.key, 2);
+>assertEqual(jsxNode.key, 2) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNode.key : string | number | null
+>jsxNode : PetitDom.ElementNode<"svg", SVGSVGElement>
+>key : string | number | null
+>2 : 2
+
+    assertEqual(jsxNodeProps.currentScale, 1);
+>assertEqual(jsxNodeProps.currentScale, 1) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNodeProps.currentScale : number | undefined
+>jsxNodeProps : PetitDom.Props<SVGSVGElement>
+>currentScale : number | undefined
+>1 : 1
+
+    assertEqual(jsxNode.content.length, 1);
+>assertEqual(jsxNode.content.length, 1) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNode.content.length : number
+>jsxNode.content : readonly PetitDom.VNode[]
+>jsxNode : PetitDom.ElementNode<"svg", SVGSVGElement>
+>content : readonly PetitDom.VNode[]
+>length : number
+>1 : 1
+}
+
+/**
+ * Create a function component, using HyperScript syntax and JSX syntax
+ */
+export function testFunctionComponent() {
+>testFunctionComponent : () => void
+
+    function FunctionComponent(): JSX.Element {
+>FunctionComponent : () => JSX.Element
+>JSX : any
+
+        return <div>Hello World</div>;
+><div>Hello World</div> : PetitDom.ElementNode<"div", HTMLDivElement>
+>div : any
+>div : any
+    }
+
+    // HyperScript syntax returns a FunctionComponentNode<T> object, with typed properties
+    const node = h(FunctionComponent, { key: "1" });
+>node : PetitDom.FunctionComponentNode<any>
+>h(FunctionComponent, { key: "1" }) : PetitDom.FunctionComponentNode<any>
+>h : { <T extends "symbol" | "object" | "a" | "abbr" | "address" | "applet" | "area" | "article" | "aside" | "audio" | "b" | "base" | "basefont" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "dir" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "font" | "footer" | "form" | "frame" | "frameset" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "marquee" | "menu" | "meta" | "meter" | "nav" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "script" | "section" | "select" | "slot" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "tbody" | "td" | "template" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "svg" | "switch" | "text" | "textPath" | "tspan" | "use" | "view", E extends ElementTagNameMap[T]>(type: T, props?: PetitDom.Props<E> | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ElementNode<T, E>; <P extends object = object>(type: PetitDom.Component<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentNode<P>; <P extends object = object>(type: PetitDom.ComponentClass<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentClassNode<P>; <P extends object = object>(type: PetitDom.FunctionComponent<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.FunctionComponentNode<P>; }
+>FunctionComponent : () => JSX.Element
+>{ key: "1" } : { key: string; }
+>key : string
+>"1" : "1"
+
+    assertEqual(node.isSVG, false);
+>assertEqual(node.isSVG, false) : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.isSVG : boolean
+>node : PetitDom.FunctionComponentNode<any>
+>isSVG : boolean
+>false : false
+
+    assertEqual(node.type, FunctionComponent);
+>assertEqual(node.type, FunctionComponent) : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.type : PetitDom.FunctionComponent<any>
+>node : PetitDom.FunctionComponentNode<any>
+>type : PetitDom.FunctionComponent<any>
+>FunctionComponent : () => JSX.Element
+
+    assertEqual(node.key, "1");
+>assertEqual(node.key, "1") : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.key : string | number | null
+>node : PetitDom.FunctionComponentNode<any>
+>key : string | number | null
+>"1" : "1"
+
+    assertEqual(node.props.key, "1");
+>assertEqual(node.props.key, "1") : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.props.key : any
+>node.props : any
+>node : PetitDom.FunctionComponentNode<any>
+>props : any
+>key : any
+>"1" : "1"
+
+    assertEqual(node.content.length, 0);
+>assertEqual(node.content.length, 0) : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.content.length : number
+>node.content : readonly PetitDom.VNode[]
+>node : PetitDom.FunctionComponentNode<any>
+>content : readonly PetitDom.VNode[]
+>length : number
+>0 : 0
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = <FunctionComponent key="1" />;
+>jsxNode : PetitDom.FunctionComponentNode<any>
+><FunctionComponent key="1" /> : PetitDom.FunctionComponentNode<any>
+>FunctionComponent : () => JSX.Element
+>key : string
+
+    const jsxNodeType = jsxNode.type as PetitDom.FunctionComponent<{}>;
+>jsxNodeType : PetitDom.FunctionComponent<{}>
+>jsxNode.type as PetitDom.FunctionComponent<{}> : PetitDom.FunctionComponent<{}>
+>jsxNode.type : PetitDom.FunctionComponent<any>
+>jsxNode : PetitDom.FunctionComponentNode<any>
+>type : PetitDom.FunctionComponent<any>
+>PetitDom : any
+
+    const jsxNodeProps = jsxNode.props as PetitDom.IntrinsicProps;
+>jsxNodeProps : PetitDom.IntrinsicProps
+>jsxNode.props as PetitDom.IntrinsicProps : PetitDom.IntrinsicProps
+>jsxNode.props : any
+>jsxNode : PetitDom.FunctionComponentNode<any>
+>props : any
+>PetitDom : any
+
+    assertEqual(jsxNode.isSVG, false);
+>assertEqual(jsxNode.isSVG, false) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNode.isSVG : boolean
+>jsxNode : PetitDom.FunctionComponentNode<any>
+>isSVG : boolean
+>false : false
+
+    assertEqual(jsxNodeType, FunctionComponent);
+>assertEqual(jsxNodeType, FunctionComponent) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNodeType : PetitDom.FunctionComponent<{}>
+>FunctionComponent : () => JSX.Element
+
+    assertEqual(jsxNode.key, "1");
+>assertEqual(jsxNode.key, "1") : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNode.key : string | number | null
+>jsxNode : PetitDom.FunctionComponentNode<any>
+>key : string | number | null
+>"1" : "1"
+
+    assertEqual(jsxNodeProps.key, "1");
+>assertEqual(jsxNodeProps.key, "1") : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNodeProps.key : string | number | undefined
+>jsxNodeProps : PetitDom.IntrinsicProps
+>key : string | number | undefined
+>"1" : "1"
+
+    assertEqual(jsxNode.content.length, 0);
+>assertEqual(jsxNode.content.length, 0) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNode.content.length : number
+>jsxNode.content : readonly PetitDom.VNode[]
+>jsxNode : PetitDom.FunctionComponentNode<any>
+>content : readonly PetitDom.VNode[]
+>length : number
+>0 : 0
+}
+
+/**
+ * Create a function component with props, using HyperScript syntax and JSX syntax
+ */
+export function testFunctionComponentWithProps() {
+>testFunctionComponentWithProps : () => void
+
+    function FunctionComponentWithProps(props: CustomProps): JSX.Element {
+>FunctionComponentWithProps : (props: CustomProps) => JSX.Element
+>props : CustomProps
+>JSX : any
+
+        const { name, count, onSomeEvent } = props;
+>name : string
+>count : number
+>onSomeEvent : (event: Event) => void
+>props : CustomProps
+
+        return <div className={name} tabIndex={count} onclick={onSomeEvent}></div>;
+><div className={name} tabIndex={count} onclick={onSomeEvent}></div> : PetitDom.ElementNode<"div", HTMLDivElement>
+>div : any
+>className : string
+>name : string
+>tabIndex : number
+>count : number
+>onclick : (event: Event) => void
+>onSomeEvent : (event: Event) => void
+>div : any
+    }
+
+    // HyperScript syntax returns a FunctionComponentNode<T> object, with typed properties
+    const node = h(FunctionComponentWithProps, { name: "xyz", count: 123, onSomeEvent: eventHandler });
+>node : PetitDom.FunctionComponentNode<CustomProps>
+>h(FunctionComponentWithProps, { name: "xyz", count: 123, onSomeEvent: eventHandler }) : PetitDom.FunctionComponentNode<CustomProps>
+>h : { <T extends "symbol" | "object" | "a" | "abbr" | "address" | "applet" | "area" | "article" | "aside" | "audio" | "b" | "base" | "basefont" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "dir" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "font" | "footer" | "form" | "frame" | "frameset" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "marquee" | "menu" | "meta" | "meter" | "nav" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "script" | "section" | "select" | "slot" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "tbody" | "td" | "template" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "svg" | "switch" | "text" | "textPath" | "tspan" | "use" | "view", E extends ElementTagNameMap[T]>(type: T, props?: PetitDom.Props<E> | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ElementNode<T, E>; <P extends object = object>(type: PetitDom.Component<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentNode<P>; <P extends object = object>(type: PetitDom.ComponentClass<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentClassNode<P>; <P extends object = object>(type: PetitDom.FunctionComponent<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.FunctionComponentNode<P>; }
+>FunctionComponentWithProps : (props: CustomProps) => JSX.Element
+>{ name: "xyz", count: 123, onSomeEvent: eventHandler } : { name: string; count: number; onSomeEvent: (event: Event) => void; }
+>name : string
+>"xyz" : "xyz"
+>count : number
+>123 : 123
+>onSomeEvent : (event: Event) => void
+>eventHandler : (event: Event) => void
+
+    assertEqual(node.isSVG, false);
+>assertEqual(node.isSVG, false) : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.isSVG : boolean
+>node : PetitDom.FunctionComponentNode<CustomProps>
+>isSVG : boolean
+>false : false
+
+    assertEqual(node.type, FunctionComponentWithProps);
+>assertEqual(node.type, FunctionComponentWithProps) : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.type : PetitDom.FunctionComponent<CustomProps>
+>node : PetitDom.FunctionComponentNode<CustomProps>
+>type : PetitDom.FunctionComponent<CustomProps>
+>FunctionComponentWithProps : (props: CustomProps) => JSX.Element
+
+    assertEqual(node.key, null);
+>assertEqual(node.key, null) : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.key : string | number | null
+>node : PetitDom.FunctionComponentNode<CustomProps>
+>key : string | number | null
+>null : null
+
+    assertEqual(node.props.name, "xyz");
+>assertEqual(node.props.name, "xyz") : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.props.name : string
+>node.props : CustomProps & PetitDom.IntrinsicProps
+>node : PetitDom.FunctionComponentNode<CustomProps>
+>props : CustomProps & PetitDom.IntrinsicProps
+>name : string
+>"xyz" : "xyz"
+
+    assertEqual(node.props.count, 123);
+>assertEqual(node.props.count, 123) : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.props.count : number
+>node.props : CustomProps & PetitDom.IntrinsicProps
+>node : PetitDom.FunctionComponentNode<CustomProps>
+>props : CustomProps & PetitDom.IntrinsicProps
+>count : number
+>123 : 123
+
+    assertEqual(node.props.onSomeEvent, eventHandler);
+>assertEqual(node.props.onSomeEvent, eventHandler) : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.props.onSomeEvent : (event: Event) => void
+>node.props : CustomProps & PetitDom.IntrinsicProps
+>node : PetitDom.FunctionComponentNode<CustomProps>
+>props : CustomProps & PetitDom.IntrinsicProps
+>onSomeEvent : (event: Event) => void
+>eventHandler : (event: Event) => void
+
+    assertEqual(node.content.length, 0);
+>assertEqual(node.content.length, 0) : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.content.length : number
+>node.content : readonly PetitDom.VNode[]
+>node : PetitDom.FunctionComponentNode<CustomProps>
+>content : readonly PetitDom.VNode[]
+>length : number
+>0 : 0
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = <FunctionComponentWithProps name="xyz" count={123} onSomeEvent={eventHandler} />;
+>jsxNode : PetitDom.FunctionComponentNode<CustomProps>
+><FunctionComponentWithProps name="xyz" count={123} onSomeEvent={eventHandler} /> : PetitDom.FunctionComponentNode<CustomProps>
+>FunctionComponentWithProps : (props: CustomProps) => JSX.Element
+>name : string
+>count : number
+>123 : 123
+>onSomeEvent : (event: Event) => void
+>eventHandler : (event: Event) => void
+
+    const jsxNodeType = jsxNode.type as PetitDom.FunctionComponent<CustomProps>;
+>jsxNodeType : PetitDom.FunctionComponent<CustomProps>
+>jsxNode.type as PetitDom.FunctionComponent<CustomProps> : PetitDom.FunctionComponent<CustomProps>
+>jsxNode.type : PetitDom.FunctionComponent<CustomProps>
+>jsxNode : PetitDom.FunctionComponentNode<CustomProps>
+>type : PetitDom.FunctionComponent<CustomProps>
+>PetitDom : any
+
+    const jsxNodeProps = jsxNode.props as CustomProps;
+>jsxNodeProps : CustomProps
+>jsxNode.props as CustomProps : CustomProps
+>jsxNode.props : CustomProps & PetitDom.IntrinsicProps
+>jsxNode : PetitDom.FunctionComponentNode<CustomProps>
+>props : CustomProps & PetitDom.IntrinsicProps
+
+    assertEqual(jsxNode.isSVG, false);
+>assertEqual(jsxNode.isSVG, false) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNode.isSVG : boolean
+>jsxNode : PetitDom.FunctionComponentNode<CustomProps>
+>isSVG : boolean
+>false : false
+
+    assertEqual(jsxNodeType, FunctionComponentWithProps);
+>assertEqual(jsxNodeType, FunctionComponentWithProps) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNodeType : PetitDom.FunctionComponent<CustomProps>
+>FunctionComponentWithProps : (props: CustomProps) => JSX.Element
+
+    assertEqual(jsxNode.key, null);
+>assertEqual(jsxNode.key, null) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNode.key : string | number | null
+>jsxNode : PetitDom.FunctionComponentNode<CustomProps>
+>key : string | number | null
+>null : null
+
+    assertEqual(jsxNodeProps.name, "xyz");
+>assertEqual(jsxNodeProps.name, "xyz") : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNodeProps.name : string
+>jsxNodeProps : CustomProps
+>name : string
+>"xyz" : "xyz"
+
+    assertEqual(jsxNodeProps.count, 123);
+>assertEqual(jsxNodeProps.count, 123) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNodeProps.count : number
+>jsxNodeProps : CustomProps
+>count : number
+>123 : 123
+
+    assertEqual(jsxNodeProps.onSomeEvent, eventHandler);
+>assertEqual(jsxNodeProps.onSomeEvent, eventHandler) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNodeProps.onSomeEvent : (event: Event) => void
+>jsxNodeProps : CustomProps
+>onSomeEvent : (event: Event) => void
+>eventHandler : (event: Event) => void
+
+    assertEqual(jsxNode.content.length, 0);
+>assertEqual(jsxNode.content.length, 0) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNode.content.length : number
+>jsxNode.content : readonly PetitDom.VNode[]
+>jsxNode : PetitDom.FunctionComponentNode<CustomProps>
+>content : readonly PetitDom.VNode[]
+>length : number
+>0 : 0
+}
+
+/**
+ * Create a function component with child content, using HyperScript syntax and JSX syntax
+ */
+export function testFunctionComponentWithChildren() {
+>testFunctionComponentWithChildren : () => void
+
+    function FunctionComponentWithChildren(props: CustomProps, content: ReadonlyArray<PetitDom.Content>): JSX.Element {
+>FunctionComponentWithChildren : (props: CustomProps, content: readonly PetitDom.Content[]) => JSX.Element
+>props : CustomProps
+>content : readonly PetitDom.Content[]
+>PetitDom : any
+>JSX : any
+
+        const { name, count, onSomeEvent } = props;
+>name : string
+>count : number
+>onSomeEvent : (event: Event) => void
+>props : CustomProps
+
+        return <div className={name} tabIndex={count} onclick={onSomeEvent}>{content}</div>;
+><div className={name} tabIndex={count} onclick={onSomeEvent}>{content}</div> : PetitDom.ElementNode<"div", HTMLDivElement>
+>div : any
+>className : string
+>name : string
+>tabIndex : number
+>count : number
+>onclick : (event: Event) => void
+>onSomeEvent : (event: Event) => void
+>content : readonly PetitDom.Content[]
+>div : any
+    }
+
+    // HyperScript syntax returns a FunctionComponentNode<T> object, with typed properties
+    const node = h(
+>node : PetitDom.FunctionComponentNode<CustomProps>
+>h(        FunctionComponentWithChildren,        { name: "xyz", count: 123, onSomeEvent: eventHandler },        "Hello",        h("span", null, "World")    ) : PetitDom.FunctionComponentNode<CustomProps>
+>h : { <T extends "symbol" | "object" | "a" | "abbr" | "address" | "applet" | "area" | "article" | "aside" | "audio" | "b" | "base" | "basefont" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "dir" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "font" | "footer" | "form" | "frame" | "frameset" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "marquee" | "menu" | "meta" | "meter" | "nav" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "script" | "section" | "select" | "slot" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "tbody" | "td" | "template" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "svg" | "switch" | "text" | "textPath" | "tspan" | "use" | "view", E extends ElementTagNameMap[T]>(type: T, props?: PetitDom.Props<E> | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ElementNode<T, E>; <P extends object = object>(type: PetitDom.Component<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentNode<P>; <P extends object = object>(type: PetitDom.ComponentClass<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentClassNode<P>; <P extends object = object>(type: PetitDom.FunctionComponent<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.FunctionComponentNode<P>; }
+
+        FunctionComponentWithChildren,
+>FunctionComponentWithChildren : (props: CustomProps, content: readonly PetitDom.Content[]) => JSX.Element
+
+        { name: "xyz", count: 123, onSomeEvent: eventHandler },
+>{ name: "xyz", count: 123, onSomeEvent: eventHandler } : { name: string; count: number; onSomeEvent: (event: Event) => void; }
+>name : string
+>"xyz" : "xyz"
+>count : number
+>123 : 123
+>onSomeEvent : (event: Event) => void
+>eventHandler : (event: Event) => void
+
+        "Hello",
+>"Hello" : "Hello"
+
+        h("span", null, "World")
+>h("span", null, "World") : PetitDom.ElementNode<"span", HTMLSpanElement>
+>h : { <T extends "symbol" | "object" | "a" | "abbr" | "address" | "applet" | "area" | "article" | "aside" | "audio" | "b" | "base" | "basefont" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "dir" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "font" | "footer" | "form" | "frame" | "frameset" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "marquee" | "menu" | "meta" | "meter" | "nav" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "script" | "section" | "select" | "slot" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "tbody" | "td" | "template" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "svg" | "switch" | "text" | "textPath" | "tspan" | "use" | "view", E extends ElementTagNameMap[T]>(type: T, props?: PetitDom.Props<E> | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ElementNode<T, E>; <P extends object = object>(type: PetitDom.Component<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentNode<P>; <P extends object = object>(type: PetitDom.ComponentClass<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentClassNode<P>; <P extends object = object>(type: PetitDom.FunctionComponent<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.FunctionComponentNode<P>; }
+>"span" : "span"
+>null : null
+>"World" : "World"
+
+    );
+
+    assertEqual(node.isSVG, false);
+>assertEqual(node.isSVG, false) : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.isSVG : boolean
+>node : PetitDom.FunctionComponentNode<CustomProps>
+>isSVG : boolean
+>false : false
+
+    assertEqual(node.type, FunctionComponentWithChildren);
+>assertEqual(node.type, FunctionComponentWithChildren) : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.type : PetitDom.FunctionComponent<CustomProps>
+>node : PetitDom.FunctionComponentNode<CustomProps>
+>type : PetitDom.FunctionComponent<CustomProps>
+>FunctionComponentWithChildren : (props: CustomProps, content: readonly PetitDom.Content[]) => JSX.Element
+
+    assertEqual(node.key, null);
+>assertEqual(node.key, null) : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.key : string | number | null
+>node : PetitDom.FunctionComponentNode<CustomProps>
+>key : string | number | null
+>null : null
+
+    assertEqual(node.props.name, "xyz");
+>assertEqual(node.props.name, "xyz") : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.props.name : string
+>node.props : CustomProps & PetitDom.IntrinsicProps
+>node : PetitDom.FunctionComponentNode<CustomProps>
+>props : CustomProps & PetitDom.IntrinsicProps
+>name : string
+>"xyz" : "xyz"
+
+    assertEqual(node.props.count, 123);
+>assertEqual(node.props.count, 123) : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.props.count : number
+>node.props : CustomProps & PetitDom.IntrinsicProps
+>node : PetitDom.FunctionComponentNode<CustomProps>
+>props : CustomProps & PetitDom.IntrinsicProps
+>count : number
+>123 : 123
+
+    assertEqual(node.props.onSomeEvent, eventHandler);
+>assertEqual(node.props.onSomeEvent, eventHandler) : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.props.onSomeEvent : (event: Event) => void
+>node.props : CustomProps & PetitDom.IntrinsicProps
+>node : PetitDom.FunctionComponentNode<CustomProps>
+>props : CustomProps & PetitDom.IntrinsicProps
+>onSomeEvent : (event: Event) => void
+>eventHandler : (event: Event) => void
+
+    assertEqual(node.content.length, 2);
+>assertEqual(node.content.length, 2) : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.content.length : number
+>node.content : readonly PetitDom.VNode[]
+>node : PetitDom.FunctionComponentNode<CustomProps>
+>content : readonly PetitDom.VNode[]
+>length : number
+>2 : 2
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = (
+>jsxNode : PetitDom.FunctionComponentNode<CustomProps>
+>(        <FunctionComponentWithChildren name="xyz" count={123} onSomeEvent={eventHandler}>            Hello <span>World</span>        </FunctionComponentWithChildren>    ) : PetitDom.FunctionComponentNode<CustomProps>
+
+        <FunctionComponentWithChildren name="xyz" count={123} onSomeEvent={eventHandler}>
+><FunctionComponentWithChildren name="xyz" count={123} onSomeEvent={eventHandler}>            Hello <span>World</span>        </FunctionComponentWithChildren> : PetitDom.FunctionComponentNode<CustomProps>
+>FunctionComponentWithChildren : (props: CustomProps, content: readonly PetitDom.Content[]) => JSX.Element
+>name : string
+>count : number
+>123 : 123
+>onSomeEvent : (event: Event) => void
+>eventHandler : (event: Event) => void
+
+            Hello <span>World</span>
+><span>World</span> : PetitDom.ElementNode<"span", HTMLSpanElement>
+>span : any
+>span : any
+
+        </FunctionComponentWithChildren>
+>FunctionComponentWithChildren : (props: CustomProps, content: readonly PetitDom.Content[]) => JSX.Element
+
+    );
+    const jsxNodeType = jsxNode.type as PetitDom.FunctionComponent<CustomProps>;
+>jsxNodeType : PetitDom.FunctionComponent<CustomProps>
+>jsxNode.type as PetitDom.FunctionComponent<CustomProps> : PetitDom.FunctionComponent<CustomProps>
+>jsxNode.type : PetitDom.FunctionComponent<CustomProps>
+>jsxNode : PetitDom.FunctionComponentNode<CustomProps>
+>type : PetitDom.FunctionComponent<CustomProps>
+>PetitDom : any
+
+    const jsxNodeProps = jsxNode.props as CustomProps;
+>jsxNodeProps : CustomProps
+>jsxNode.props as CustomProps : CustomProps
+>jsxNode.props : CustomProps & PetitDom.IntrinsicProps
+>jsxNode : PetitDom.FunctionComponentNode<CustomProps>
+>props : CustomProps & PetitDom.IntrinsicProps
+
+    assertEqual(jsxNode.isSVG, false);
+>assertEqual(jsxNode.isSVG, false) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNode.isSVG : boolean
+>jsxNode : PetitDom.FunctionComponentNode<CustomProps>
+>isSVG : boolean
+>false : false
+
+    assertEqual(jsxNodeType, FunctionComponentWithChildren);
+>assertEqual(jsxNodeType, FunctionComponentWithChildren) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNodeType : PetitDom.FunctionComponent<CustomProps>
+>FunctionComponentWithChildren : (props: CustomProps, content: readonly PetitDom.Content[]) => JSX.Element
+
+    assertEqual(jsxNode.key, null);
+>assertEqual(jsxNode.key, null) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNode.key : string | number | null
+>jsxNode : PetitDom.FunctionComponentNode<CustomProps>
+>key : string | number | null
+>null : null
+
+    assertEqual(jsxNodeProps.name, "xyz");
+>assertEqual(jsxNodeProps.name, "xyz") : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNodeProps.name : string
+>jsxNodeProps : CustomProps
+>name : string
+>"xyz" : "xyz"
+
+    assertEqual(jsxNodeProps.count, 123);
+>assertEqual(jsxNodeProps.count, 123) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNodeProps.count : number
+>jsxNodeProps : CustomProps
+>count : number
+>123 : 123
+
+    assertEqual(jsxNodeProps.onSomeEvent, eventHandler);
+>assertEqual(jsxNodeProps.onSomeEvent, eventHandler) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNodeProps.onSomeEvent : (event: Event) => void
+>jsxNodeProps : CustomProps
+>onSomeEvent : (event: Event) => void
+>eventHandler : (event: Event) => void
+
+    assertEqual(jsxNode.content.length, 2);
+>assertEqual(jsxNode.content.length, 2) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNode.content.length : number
+>jsxNode.content : readonly PetitDom.VNode[]
+>jsxNode : PetitDom.FunctionComponentNode<CustomProps>
+>content : readonly PetitDom.VNode[]
+>length : number
+>2 : 2
+}
+
+/**
+ * Create a component class, using HyperScript syntax and JSX syntax
+ */
+export function testComponentClass() {
+>testComponentClass : () => void
+
+    class ComponentClass {
+>ComponentClass : ComponentClass
+
+        props = {};
+>props : {}
+>{} : {}
+
+        mount(): Element {
+>mount : () => Element
+
+            return mount(<div className="some-class"></div>);
+>mount(<div className="some-class"></div>) : Element
+>mount : (vnode: PetitDom.VNode) => Element
+><div className="some-class"></div> : PetitDom.ElementNode<"div", HTMLDivElement>
+>div : any
+>className : string
+>div : any
+        }
+
+        patch(element: Element, newProps: object, oldProps: object, newContent: ReadonlyArray<PetitDom.VNode>, oldContent: ReadonlyArray<PetitDom.VNode>): Element {
+>patch : (element: Element, newProps: object, oldProps: object, newContent: readonly PetitDom.VNode[], oldContent: readonly PetitDom.VNode[]) => Element
+>element : Element
+>newProps : object
+>oldProps : object
+>newContent : readonly PetitDom.VNode[]
+>PetitDom : any
+>oldContent : readonly PetitDom.VNode[]
+>PetitDom : any
+
+            patch(
+>patch(                <div {...oldProps}>{oldContent}</div>,                <div {...newProps}>{newContent}</div>            ) : Element
+>patch : (newVNode: PetitDom.VNode, oldVNode: PetitDom.VNode, parent?: Element | undefined) => Element
+
+                <div {...oldProps}>{oldContent}</div>,
+><div {...oldProps}>{oldContent}</div> : PetitDom.ElementNode<"div", HTMLDivElement>
+>div : any
+>oldProps : object
+>oldContent : readonly PetitDom.VNode[]
+>div : any
+
+                <div {...newProps}>{newContent}</div>
+><div {...newProps}>{newContent}</div> : PetitDom.ElementNode<"div", HTMLDivElement>
+>div : any
+>newProps : object
+>newContent : readonly PetitDom.VNode[]
+>div : any
+
+            );
+            return element;
+>element : Element
+        }
+
+        unmount(element: Element): void {
+>unmount : (element: Element) => void
+>element : Element
+
+            unmount(<div>Hello World</div>);
+>unmount(<div>Hello World</div>) : void
+>unmount : (vnode: PetitDom.VNode) => void
+><div>Hello World</div> : PetitDom.ElementNode<"div", HTMLDivElement>
+>div : any
+>div : any
+        }
+    }
+
+    // HyperScript syntax returns a ComponentClassNode<T> object, with typed properties
+    const node = h(ComponentClass, { key: "1" });
+>node : PetitDom.ComponentClassNode<object>
+>h(ComponentClass, { key: "1" }) : PetitDom.ComponentClassNode<object>
+>h : { <T extends "symbol" | "object" | "a" | "abbr" | "address" | "applet" | "area" | "article" | "aside" | "audio" | "b" | "base" | "basefont" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "dir" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "font" | "footer" | "form" | "frame" | "frameset" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "marquee" | "menu" | "meta" | "meter" | "nav" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "script" | "section" | "select" | "slot" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "tbody" | "td" | "template" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "svg" | "switch" | "text" | "textPath" | "tspan" | "use" | "view", E extends ElementTagNameMap[T]>(type: T, props?: PetitDom.Props<E> | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ElementNode<T, E>; <P extends object = object>(type: PetitDom.Component<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentNode<P>; <P extends object = object>(type: PetitDom.ComponentClass<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentClassNode<P>; <P extends object = object>(type: PetitDom.FunctionComponent<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.FunctionComponentNode<P>; }
+>ComponentClass : typeof ComponentClass
+>{ key: "1" } : { key: string; }
+>key : string
+>"1" : "1"
+
+    assertEqual(node.isSVG, false);
+>assertEqual(node.isSVG, false) : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.isSVG : boolean
+>node : PetitDom.ComponentClassNode<object>
+>isSVG : boolean
+>false : false
+
+    assertEqual(node.type, ComponentClass);
+>assertEqual(node.type, ComponentClass) : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.type : PetitDom.ComponentClass<object>
+>node : PetitDom.ComponentClassNode<object>
+>type : PetitDom.ComponentClass<object>
+>ComponentClass : typeof ComponentClass
+
+    assertEqual(node.key, "1");
+>assertEqual(node.key, "1") : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.key : string | number | null
+>node : PetitDom.ComponentClassNode<object>
+>key : string | number | null
+>"1" : "1"
+
+    assertEqual(node.props.key, "1");
+>assertEqual(node.props.key, "1") : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.props.key : string | number | undefined
+>node.props : object & PetitDom.IntrinsicProps
+>node : PetitDom.ComponentClassNode<object>
+>props : object & PetitDom.IntrinsicProps
+>key : string | number | undefined
+>"1" : "1"
+
+    assertEqual(node.content.length, 0);
+>assertEqual(node.content.length, 0) : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.content.length : number
+>node.content : readonly PetitDom.VNode[]
+>node : PetitDom.ComponentClassNode<object>
+>content : readonly PetitDom.VNode[]
+>length : number
+>0 : 0
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = <ComponentClass key="1" />;
+>jsxNode : PetitDom.ComponentClassNode<object>
+><ComponentClass key="1" /> : PetitDom.ComponentClassNode<object>
+>ComponentClass : typeof ComponentClass
+>key : string
+
+    const jsxNodeType = jsxNode.type as PetitDom.ComponentClass<{}>;
+>jsxNodeType : PetitDom.ComponentClass<{}>
+>jsxNode.type as PetitDom.ComponentClass<{}> : PetitDom.ComponentClass<{}>
+>jsxNode.type : PetitDom.ComponentClass<object>
+>jsxNode : PetitDom.ComponentClassNode<object>
+>type : PetitDom.ComponentClass<object>
+>PetitDom : any
+
+    const jsxNodeProps = jsxNode.props as PetitDom.IntrinsicProps;
+>jsxNodeProps : PetitDom.IntrinsicProps
+>jsxNode.props as PetitDom.IntrinsicProps : PetitDom.IntrinsicProps
+>jsxNode.props : object & PetitDom.IntrinsicProps
+>jsxNode : PetitDom.ComponentClassNode<object>
+>props : object & PetitDom.IntrinsicProps
+>PetitDom : any
+
+    assertEqual(jsxNode.isSVG, false);
+>assertEqual(jsxNode.isSVG, false) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNode.isSVG : boolean
+>jsxNode : PetitDom.ComponentClassNode<object>
+>isSVG : boolean
+>false : false
+
+    assertEqual(jsxNodeType, ComponentClass);
+>assertEqual(jsxNodeType, ComponentClass) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNodeType : PetitDom.ComponentClass<{}>
+>ComponentClass : typeof ComponentClass
+
+    assertEqual(jsxNode.key, "1");
+>assertEqual(jsxNode.key, "1") : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNode.key : string | number | null
+>jsxNode : PetitDom.ComponentClassNode<object>
+>key : string | number | null
+>"1" : "1"
+
+    assertEqual(jsxNodeProps.key, "1");
+>assertEqual(jsxNodeProps.key, "1") : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNodeProps.key : string | number | undefined
+>jsxNodeProps : PetitDom.IntrinsicProps
+>key : string | number | undefined
+>"1" : "1"
+
+    assertEqual(jsxNode.content.length, 0);
+>assertEqual(jsxNode.content.length, 0) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNode.content.length : number
+>jsxNode.content : readonly PetitDom.VNode[]
+>jsxNode : PetitDom.ComponentClassNode<object>
+>content : readonly PetitDom.VNode[]
+>length : number
+>0 : 0
+}
+
+/**
+ * Create a component class with props, using HyperScript syntax and JSX syntax
+ */
+export function testComponentClassWithProps() {
+>testComponentClassWithProps : () => void
+
+    class ComponentClassWithProps {
+>ComponentClassWithProps : ComponentClassWithProps
+
+        props: CustomProps;
+>props : CustomProps
+
+        constructor(props: CustomProps) {
+>props : CustomProps
+
+            this.props = props;
+>this.props = props : CustomProps
+>this.props : CustomProps
+>this : this
+>props : CustomProps
+>props : CustomProps
+        }
+
+        mount(props: CustomProps): Element {
+>mount : (props: CustomProps) => Element
+>props : CustomProps
+
+            const { name, count, onSomeEvent } = props;
+>name : string
+>count : number
+>onSomeEvent : (event: Event) => void
+>props : CustomProps
+
+            return mount(<div className={name} tabIndex={count} onclick={onSomeEvent} />);
+>mount(<div className={name} tabIndex={count} onclick={onSomeEvent} />) : Element
+>mount : (vnode: PetitDom.VNode) => Element
+><div className={name} tabIndex={count} onclick={onSomeEvent} /> : PetitDom.ElementNode<"div", HTMLDivElement>
+>div : any
+>className : string
+>name : string
+>tabIndex : number
+>count : number
+>onclick : (event: Event) => void
+>onSomeEvent : (event: Event) => void
+        }
+
+        patch(element: Element, newProps: CustomProps, oldProps: CustomProps, newContent: ReadonlyArray<PetitDom.VNode>, oldContent: ReadonlyArray<PetitDom.VNode>): Element {
+>patch : (element: Element, newProps: CustomProps, oldProps: CustomProps, newContent: readonly PetitDom.VNode[], oldContent: readonly PetitDom.VNode[]) => Element
+>element : Element
+>newProps : CustomProps
+>oldProps : CustomProps
+>newContent : readonly PetitDom.VNode[]
+>PetitDom : any
+>oldContent : readonly PetitDom.VNode[]
+>PetitDom : any
+
+            patch(
+>patch(                <div {...oldProps}>{oldContent}</div>,                <div {...newProps}>{newContent}</div>            ) : Element
+>patch : (newVNode: PetitDom.VNode, oldVNode: PetitDom.VNode, parent?: Element | undefined) => Element
+
+                <div {...oldProps}>{oldContent}</div>,
+><div {...oldProps}>{oldContent}</div> : PetitDom.ElementNode<"div", HTMLDivElement>
+>div : any
+>oldProps : CustomProps
+>oldContent : readonly PetitDom.VNode[]
+>div : any
+
+                <div {...newProps}>{newContent}</div>
+><div {...newProps}>{newContent}</div> : PetitDom.ElementNode<"div", HTMLDivElement>
+>div : any
+>newProps : CustomProps
+>newContent : readonly PetitDom.VNode[]
+>div : any
+
+            );
+            return element;
+>element : Element
+        }
+
+        unmount(element: Element): void {
+>unmount : (element: Element) => void
+>element : Element
+
+            unmount(<div> Hello World</div >);
+>unmount(<div> Hello World</div >) : void
+>unmount : (vnode: PetitDom.VNode) => void
+><div> Hello World</div > : PetitDom.ElementNode<"div", HTMLDivElement>
+>div : any
+>div : any
+        }
+    }
+
+    // HyperScript syntax returns a ComponentClassNode<T> object, with typed properties
+    const node = h(ComponentClassWithProps, { name: "xyz", count: 123, onSomeEvent: eventHandler });
+>node : PetitDom.ComponentClassNode<CustomProps>
+>h(ComponentClassWithProps, { name: "xyz", count: 123, onSomeEvent: eventHandler }) : PetitDom.ComponentClassNode<CustomProps>
+>h : { <T extends "symbol" | "object" | "a" | "abbr" | "address" | "applet" | "area" | "article" | "aside" | "audio" | "b" | "base" | "basefont" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "dir" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "font" | "footer" | "form" | "frame" | "frameset" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "marquee" | "menu" | "meta" | "meter" | "nav" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "script" | "section" | "select" | "slot" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "tbody" | "td" | "template" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "svg" | "switch" | "text" | "textPath" | "tspan" | "use" | "view", E extends ElementTagNameMap[T]>(type: T, props?: PetitDom.Props<E> | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ElementNode<T, E>; <P extends object = object>(type: PetitDom.Component<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentNode<P>; <P extends object = object>(type: PetitDom.ComponentClass<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentClassNode<P>; <P extends object = object>(type: PetitDom.FunctionComponent<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.FunctionComponentNode<P>; }
+>ComponentClassWithProps : typeof ComponentClassWithProps
+>{ name: "xyz", count: 123, onSomeEvent: eventHandler } : { name: string; count: number; onSomeEvent: (event: Event) => void; }
+>name : string
+>"xyz" : "xyz"
+>count : number
+>123 : 123
+>onSomeEvent : (event: Event) => void
+>eventHandler : (event: Event) => void
+
+    assertEqual(node.isSVG, false);
+>assertEqual(node.isSVG, false) : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.isSVG : boolean
+>node : PetitDom.ComponentClassNode<CustomProps>
+>isSVG : boolean
+>false : false
+
+    assertEqual(node.type, ComponentClassWithProps);
+>assertEqual(node.type, ComponentClassWithProps) : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.type : PetitDom.ComponentClass<CustomProps>
+>node : PetitDom.ComponentClassNode<CustomProps>
+>type : PetitDom.ComponentClass<CustomProps>
+>ComponentClassWithProps : typeof ComponentClassWithProps
+
+    assertEqual(node.key, null);
+>assertEqual(node.key, null) : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.key : string | number | null
+>node : PetitDom.ComponentClassNode<CustomProps>
+>key : string | number | null
+>null : null
+
+    assertEqual(node.props.name, "xyz");
+>assertEqual(node.props.name, "xyz") : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.props.name : string
+>node.props : CustomProps & PetitDom.IntrinsicProps
+>node : PetitDom.ComponentClassNode<CustomProps>
+>props : CustomProps & PetitDom.IntrinsicProps
+>name : string
+>"xyz" : "xyz"
+
+    assertEqual(node.props.count, 123);
+>assertEqual(node.props.count, 123) : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.props.count : number
+>node.props : CustomProps & PetitDom.IntrinsicProps
+>node : PetitDom.ComponentClassNode<CustomProps>
+>props : CustomProps & PetitDom.IntrinsicProps
+>count : number
+>123 : 123
+
+    assertEqual(node.props.onSomeEvent, eventHandler);
+>assertEqual(node.props.onSomeEvent, eventHandler) : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.props.onSomeEvent : (event: Event) => void
+>node.props : CustomProps & PetitDom.IntrinsicProps
+>node : PetitDom.ComponentClassNode<CustomProps>
+>props : CustomProps & PetitDom.IntrinsicProps
+>onSomeEvent : (event: Event) => void
+>eventHandler : (event: Event) => void
+
+    assertEqual(node.content.length, 0);
+>assertEqual(node.content.length, 0) : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.content.length : number
+>node.content : readonly PetitDom.VNode[]
+>node : PetitDom.ComponentClassNode<CustomProps>
+>content : readonly PetitDom.VNode[]
+>length : number
+>0 : 0
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = <ComponentClassWithProps name="xyz" count={123} onSomeEvent={eventHandler} />;
+>jsxNode : PetitDom.ComponentClassNode<CustomProps>
+><ComponentClassWithProps name="xyz" count={123} onSomeEvent={eventHandler} /> : PetitDom.ComponentClassNode<CustomProps>
+>ComponentClassWithProps : typeof ComponentClassWithProps
+>name : string
+>count : number
+>123 : 123
+>onSomeEvent : (event: Event) => void
+>eventHandler : (event: Event) => void
+
+    const jsxNodeType = jsxNode.type as PetitDom.ComponentClass<CustomProps>;
+>jsxNodeType : PetitDom.ComponentClass<CustomProps>
+>jsxNode.type as PetitDom.ComponentClass<CustomProps> : PetitDom.ComponentClass<CustomProps>
+>jsxNode.type : PetitDom.ComponentClass<CustomProps>
+>jsxNode : PetitDom.ComponentClassNode<CustomProps>
+>type : PetitDom.ComponentClass<CustomProps>
+>PetitDom : any
+
+    const jsxNodeProps = jsxNode.props as CustomProps;
+>jsxNodeProps : CustomProps
+>jsxNode.props as CustomProps : CustomProps
+>jsxNode.props : CustomProps & PetitDom.IntrinsicProps
+>jsxNode : PetitDom.ComponentClassNode<CustomProps>
+>props : CustomProps & PetitDom.IntrinsicProps
+
+    assertEqual(jsxNode.isSVG, false);
+>assertEqual(jsxNode.isSVG, false) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNode.isSVG : boolean
+>jsxNode : PetitDom.ComponentClassNode<CustomProps>
+>isSVG : boolean
+>false : false
+
+    assertEqual(jsxNodeType, ComponentClassWithProps);
+>assertEqual(jsxNodeType, ComponentClassWithProps) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNodeType : PetitDom.ComponentClass<CustomProps>
+>ComponentClassWithProps : typeof ComponentClassWithProps
+
+    assertEqual(jsxNode.key, null);
+>assertEqual(jsxNode.key, null) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNode.key : string | number | null
+>jsxNode : PetitDom.ComponentClassNode<CustomProps>
+>key : string | number | null
+>null : null
+
+    assertEqual(jsxNodeProps.name, "xyz");
+>assertEqual(jsxNodeProps.name, "xyz") : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNodeProps.name : string
+>jsxNodeProps : CustomProps
+>name : string
+>"xyz" : "xyz"
+
+    assertEqual(jsxNodeProps.count, 123);
+>assertEqual(jsxNodeProps.count, 123) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNodeProps.count : number
+>jsxNodeProps : CustomProps
+>count : number
+>123 : 123
+
+    assertEqual(jsxNodeProps.onSomeEvent, eventHandler);
+>assertEqual(jsxNodeProps.onSomeEvent, eventHandler) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNodeProps.onSomeEvent : (event: Event) => void
+>jsxNodeProps : CustomProps
+>onSomeEvent : (event: Event) => void
+>eventHandler : (event: Event) => void
+
+    assertEqual(jsxNode.content.length, 0);
+>assertEqual(jsxNode.content.length, 0) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNode.content.length : number
+>jsxNode.content : readonly PetitDom.VNode[]
+>jsxNode : PetitDom.ComponentClassNode<CustomProps>
+>content : readonly PetitDom.VNode[]
+>length : number
+>0 : 0
+}
+
+/**
+ * Create a component class with child content, using HyperScript syntax and JSX syntax
+ */
+export function testComponentClassWithChildren() {
+>testComponentClassWithChildren : () => void
+
+    class ComponentClassWithChildren {
+>ComponentClassWithChildren : ComponentClassWithChildren
+
+        props: CustomProps;
+>props : CustomProps
+
+        constructor(props: CustomProps) {
+>props : CustomProps
+
+            this.props = props;
+>this.props = props : CustomProps
+>this.props : CustomProps
+>this : this
+>props : CustomProps
+>props : CustomProps
+        }
+
+        mount(props: CustomProps, content: ReadonlyArray<PetitDom.Content>): Element {
+>mount : (props: CustomProps, content: readonly PetitDom.Content[]) => Element
+>props : CustomProps
+>content : readonly PetitDom.Content[]
+>PetitDom : any
+
+            const { name, count, onSomeEvent } = props;
+>name : string
+>count : number
+>onSomeEvent : (event: Event) => void
+>props : CustomProps
+
+            return mount(
+>mount(                <div className={name} tabIndex={count} onclick={onSomeEvent}>{content}</div>            ) : Element
+>mount : (vnode: PetitDom.VNode) => Element
+
+                <div className={name} tabIndex={count} onclick={onSomeEvent}>{content}</div>
+><div className={name} tabIndex={count} onclick={onSomeEvent}>{content}</div> : PetitDom.ElementNode<"div", HTMLDivElement>
+>div : any
+>className : string
+>name : string
+>tabIndex : number
+>count : number
+>onclick : (event: Event) => void
+>onSomeEvent : (event: Event) => void
+>content : readonly PetitDom.Content[]
+>div : any
+
+            );
+        }
+
+        patch(element: Element, newProps: CustomProps, oldProps: CustomProps, newContent: ReadonlyArray<PetitDom.VNode>, oldContent: ReadonlyArray<PetitDom.VNode>): Element {
+>patch : (element: Element, newProps: CustomProps, oldProps: CustomProps, newContent: readonly PetitDom.VNode[], oldContent: readonly PetitDom.VNode[]) => Element
+>element : Element
+>newProps : CustomProps
+>oldProps : CustomProps
+>newContent : readonly PetitDom.VNode[]
+>PetitDom : any
+>oldContent : readonly PetitDom.VNode[]
+>PetitDom : any
+
+            patch(
+>patch(                <div {...oldProps}>{oldContent}</div>,                <div {...newProps}>{newContent}</div>            ) : Element
+>patch : (newVNode: PetitDom.VNode, oldVNode: PetitDom.VNode, parent?: Element | undefined) => Element
+
+                <div {...oldProps}>{oldContent}</div>,
+><div {...oldProps}>{oldContent}</div> : PetitDom.ElementNode<"div", HTMLDivElement>
+>div : any
+>oldProps : CustomProps
+>oldContent : readonly PetitDom.VNode[]
+>div : any
+
+                <div {...newProps}>{newContent}</div>
+><div {...newProps}>{newContent}</div> : PetitDom.ElementNode<"div", HTMLDivElement>
+>div : any
+>newProps : CustomProps
+>newContent : readonly PetitDom.VNode[]
+>div : any
+
+            );
+            return element;
+>element : Element
+        }
+
+        unmount(element: Element): void {
+>unmount : (element: Element) => void
+>element : Element
+
+            unmount(<div> Hello World</div >);
+>unmount(<div> Hello World</div >) : void
+>unmount : (vnode: PetitDom.VNode) => void
+><div> Hello World</div > : PetitDom.ElementNode<"div", HTMLDivElement>
+>div : any
+>div : any
+        }
+    }
+
+    // HyperScript syntax returns a ComponentClassNode<T> object, with typed properties
+    const node = h(
+>node : PetitDom.ComponentClassNode<CustomProps>
+>h(        ComponentClassWithChildren,        { name: "xyz", count: 123, onSomeEvent: eventHandler },        "Hello",        h("span", null, "World")    ) : PetitDom.ComponentClassNode<CustomProps>
+>h : { <T extends "symbol" | "object" | "a" | "abbr" | "address" | "applet" | "area" | "article" | "aside" | "audio" | "b" | "base" | "basefont" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "dir" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "font" | "footer" | "form" | "frame" | "frameset" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "marquee" | "menu" | "meta" | "meter" | "nav" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "script" | "section" | "select" | "slot" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "tbody" | "td" | "template" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "svg" | "switch" | "text" | "textPath" | "tspan" | "use" | "view", E extends ElementTagNameMap[T]>(type: T, props?: PetitDom.Props<E> | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ElementNode<T, E>; <P extends object = object>(type: PetitDom.Component<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentNode<P>; <P extends object = object>(type: PetitDom.ComponentClass<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentClassNode<P>; <P extends object = object>(type: PetitDom.FunctionComponent<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.FunctionComponentNode<P>; }
+
+        ComponentClassWithChildren,
+>ComponentClassWithChildren : typeof ComponentClassWithChildren
+
+        { name: "xyz", count: 123, onSomeEvent: eventHandler },
+>{ name: "xyz", count: 123, onSomeEvent: eventHandler } : { name: string; count: number; onSomeEvent: (event: Event) => void; }
+>name : string
+>"xyz" : "xyz"
+>count : number
+>123 : 123
+>onSomeEvent : (event: Event) => void
+>eventHandler : (event: Event) => void
+
+        "Hello",
+>"Hello" : "Hello"
+
+        h("span", null, "World")
+>h("span", null, "World") : PetitDom.ElementNode<"span", HTMLSpanElement>
+>h : { <T extends "symbol" | "object" | "a" | "abbr" | "address" | "applet" | "area" | "article" | "aside" | "audio" | "b" | "base" | "basefont" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "dir" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "font" | "footer" | "form" | "frame" | "frameset" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "marquee" | "menu" | "meta" | "meter" | "nav" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "script" | "section" | "select" | "slot" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "tbody" | "td" | "template" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "svg" | "switch" | "text" | "textPath" | "tspan" | "use" | "view", E extends ElementTagNameMap[T]>(type: T, props?: PetitDom.Props<E> | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ElementNode<T, E>; <P extends object = object>(type: PetitDom.Component<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentNode<P>; <P extends object = object>(type: PetitDom.ComponentClass<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.ComponentClassNode<P>; <P extends object = object>(type: PetitDom.FunctionComponent<P>, props?: (P & PetitDom.IntrinsicProps) | null | undefined, ...children: readonly PetitDom.Content[]): PetitDom.FunctionComponentNode<P>; }
+>"span" : "span"
+>null : null
+>"World" : "World"
+
+    );
+
+    assertEqual(node.isSVG, false);
+>assertEqual(node.isSVG, false) : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.isSVG : boolean
+>node : PetitDom.ComponentClassNode<CustomProps>
+>isSVG : boolean
+>false : false
+
+    assertEqual(node.type, ComponentClassWithChildren);
+>assertEqual(node.type, ComponentClassWithChildren) : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.type : PetitDom.ComponentClass<CustomProps>
+>node : PetitDom.ComponentClassNode<CustomProps>
+>type : PetitDom.ComponentClass<CustomProps>
+>ComponentClassWithChildren : typeof ComponentClassWithChildren
+
+    assertEqual(node.key, null);
+>assertEqual(node.key, null) : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.key : string | number | null
+>node : PetitDom.ComponentClassNode<CustomProps>
+>key : string | number | null
+>null : null
+
+    assertEqual(node.props.name, "xyz");
+>assertEqual(node.props.name, "xyz") : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.props.name : string
+>node.props : CustomProps & PetitDom.IntrinsicProps
+>node : PetitDom.ComponentClassNode<CustomProps>
+>props : CustomProps & PetitDom.IntrinsicProps
+>name : string
+>"xyz" : "xyz"
+
+    assertEqual(node.props.count, 123);
+>assertEqual(node.props.count, 123) : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.props.count : number
+>node.props : CustomProps & PetitDom.IntrinsicProps
+>node : PetitDom.ComponentClassNode<CustomProps>
+>props : CustomProps & PetitDom.IntrinsicProps
+>count : number
+>123 : 123
+
+    assertEqual(node.props.onSomeEvent, eventHandler);
+>assertEqual(node.props.onSomeEvent, eventHandler) : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.props.onSomeEvent : (event: Event) => void
+>node.props : CustomProps & PetitDom.IntrinsicProps
+>node : PetitDom.ComponentClassNode<CustomProps>
+>props : CustomProps & PetitDom.IntrinsicProps
+>onSomeEvent : (event: Event) => void
+>eventHandler : (event: Event) => void
+
+    assertEqual(node.content.length, 2);
+>assertEqual(node.content.length, 2) : void
+>assertEqual : <T>(a: T, b: T) => void
+>node.content.length : number
+>node.content : readonly PetitDom.VNode[]
+>node : PetitDom.ComponentClassNode<CustomProps>
+>content : readonly PetitDom.VNode[]
+>length : number
+>2 : 2
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = (
+>jsxNode : PetitDom.ComponentClassNode<CustomProps>
+>(        <ComponentClassWithChildren name="xyz" count={123} onSomeEvent={eventHandler}>            Hello <span>World</span>        </ComponentClassWithChildren>    ) : PetitDom.ComponentClassNode<CustomProps>
+
+        <ComponentClassWithChildren name="xyz" count={123} onSomeEvent={eventHandler}>
+><ComponentClassWithChildren name="xyz" count={123} onSomeEvent={eventHandler}>            Hello <span>World</span>        </ComponentClassWithChildren> : PetitDom.ComponentClassNode<CustomProps>
+>ComponentClassWithChildren : typeof ComponentClassWithChildren
+>name : string
+>count : number
+>123 : 123
+>onSomeEvent : (event: Event) => void
+>eventHandler : (event: Event) => void
+
+            Hello <span>World</span>
+><span>World</span> : PetitDom.ElementNode<"span", HTMLSpanElement>
+>span : any
+>span : any
+
+        </ComponentClassWithChildren>
+>ComponentClassWithChildren : typeof ComponentClassWithChildren
+
+    );
+    const jsxNodeType = jsxNode.type as PetitDom.ComponentClass<CustomProps>;
+>jsxNodeType : PetitDom.ComponentClass<CustomProps>
+>jsxNode.type as PetitDom.ComponentClass<CustomProps> : PetitDom.ComponentClass<CustomProps>
+>jsxNode.type : PetitDom.ComponentClass<CustomProps>
+>jsxNode : PetitDom.ComponentClassNode<CustomProps>
+>type : PetitDom.ComponentClass<CustomProps>
+>PetitDom : any
+
+    const jsxNodeProps = jsxNode.props as CustomProps;
+>jsxNodeProps : CustomProps
+>jsxNode.props as CustomProps : CustomProps
+>jsxNode.props : CustomProps & PetitDom.IntrinsicProps
+>jsxNode : PetitDom.ComponentClassNode<CustomProps>
+>props : CustomProps & PetitDom.IntrinsicProps
+
+    assertEqual(jsxNode.isSVG, false);
+>assertEqual(jsxNode.isSVG, false) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNode.isSVG : boolean
+>jsxNode : PetitDom.ComponentClassNode<CustomProps>
+>isSVG : boolean
+>false : false
+
+    assertEqual(jsxNodeType, ComponentClassWithChildren);
+>assertEqual(jsxNodeType, ComponentClassWithChildren) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNodeType : PetitDom.ComponentClass<CustomProps>
+>ComponentClassWithChildren : typeof ComponentClassWithChildren
+
+    assertEqual(jsxNode.key, null);
+>assertEqual(jsxNode.key, null) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNode.key : string | number | null
+>jsxNode : PetitDom.ComponentClassNode<CustomProps>
+>key : string | number | null
+>null : null
+
+    assertEqual(jsxNodeProps.name, "xyz");
+>assertEqual(jsxNodeProps.name, "xyz") : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNodeProps.name : string
+>jsxNodeProps : CustomProps
+>name : string
+>"xyz" : "xyz"
+
+    assertEqual(jsxNodeProps.count, 123);
+>assertEqual(jsxNodeProps.count, 123) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNodeProps.count : number
+>jsxNodeProps : CustomProps
+>count : number
+>123 : 123
+
+    assertEqual(jsxNodeProps.onSomeEvent, eventHandler);
+>assertEqual(jsxNodeProps.onSomeEvent, eventHandler) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNodeProps.onSomeEvent : (event: Event) => void
+>jsxNodeProps : CustomProps
+>onSomeEvent : (event: Event) => void
+>eventHandler : (event: Event) => void
+
+    assertEqual(jsxNode.content.length, 2);
+>assertEqual(jsxNode.content.length, 2) : void
+>assertEqual : <T>(a: T, b: T) => void
+>jsxNode.content.length : number
+>jsxNode.content : readonly PetitDom.VNode[]
+>jsxNode : PetitDom.ComponentClassNode<CustomProps>
+>content : readonly PetitDom.VNode[]
+>length : number
+>2 : 2
+}
+
diff --git a/tests/cases/compiler/petitDomSimpleJsx.tsx b/tests/cases/compiler/petitDomSimpleJsx.tsx
new file mode 100644
index 0000000000000..e94747a100430
--- /dev/null
+++ b/tests/cases/compiler/petitDomSimpleJsx.tsx
@@ -0,0 +1,563 @@
+// @jsx: react
+// @strict: true
+// @lib: dom, es6
+// @filename: node_modules/petit-dom/index.d.ts
+// Modified type definitions for Petit-Dom 0.2
+// Project: https://github.com/yelouafi/petit-dom
+// Definitions by: James Messinger <https://github.com/JamesMessinger>, modified by @weswigham for testing
+// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
+// TypeScript Version: 3.4
+
+/**
+ * Creates a VNode of the specified HTML Element type and with the
+ * specified properties and contents.
+ *
+ * @param type - The tag name of element to create
+ * @param props - Properties to set on the element
+ * @param ...children - Child nodes
+ * @returns A new VNode object
+ */
+export function h<T extends keyof ElementTagNameMap, E extends ElementTagNameMap[T]>(
+    type: T,
+    props?: PetitDom.Props<E> | null,
+    ...children: ReadonlyArray<PetitDom.Content>
+): PetitDom.ElementNode<T, E>;
+
+/**
+ * Creates a VNode using a PetitDom component object.
+ *
+ * @param type - A PetitDom component object
+ * @param props - Properties to set on the component
+ * @param ...children - Child nodes
+ * @returns A new VNode object
+ */
+export function h<P extends PetitDom.ComponentProps = PetitDom.ComponentProps>(
+    type: PetitDom.Component<P>,
+    props?: (P & PetitDom.IntrinsicProps) | null,
+    ...children: ReadonlyArray<PetitDom.Content>
+): PetitDom.ComponentNode<P>;
+
+/**
+ * Creates a VNode using a PetitDom component class.
+ *
+ * @param type - A PetitDom component class
+ * @param props - Properties to set on the component
+ * @param ...children - Child nodes
+ * @returns A new VNode object
+ */
+export function h<P extends PetitDom.ComponentProps = PetitDom.ComponentProps>(
+    type: PetitDom.ComponentClass<P>,
+    props?: (P & PetitDom.IntrinsicProps) | null,
+    ...children: ReadonlyArray<PetitDom.Content>
+): PetitDom.ComponentClassNode<P>;
+
+/**
+ * Creates a VNode using a PetitDom function component.
+ *
+ * This function is compatible with both JSX and HyperScript syntax.
+ *
+ * @param type - A PetitDom function component
+ * @param props - Properties to set on the component
+ * @param ...children - Child nodes
+ * @returns A new VNode object
+ */
+export function h<P extends PetitDom.ComponentProps = PetitDom.ComponentProps>(
+    type: PetitDom.FunctionComponent<P>,
+    props?: (P & PetitDom.IntrinsicProps) | null,
+    ...children: ReadonlyArray<PetitDom.Content>
+): PetitDom.FunctionComponentNode<P>;
+
+/**
+ * Creates actual DOM Elements for the given VNode and its children.
+ *
+ * @param vnode - The VNode object to mount
+ * @returns The newly-created DOM element
+ */
+export function mount(vnode: PetitDom.VNode): Element;
+
+/**
+ * Diffs two VNodes and applies the necessary DOM changes
+ *
+ * @param newVNode - The new VNode object, which will be mounted to the DOM element of oldVNode
+ * @param oldVNode - The old VNode object to diff against
+ * @param parent - The parent DOM element. Used internally by PetitDom to recursively patch child nodes
+ * @returns The updated DOM element. This element is also moved from oldVNode to newVNode
+ */
+export function patch(newVNode: PetitDom.VNode, oldVNode: PetitDom.VNode, parent?: Element): Element;
+
+/**
+ * Removes the given VNode from the actual DOM
+ *
+ * @param vnode - The VNode object to unmount
+ */
+export function unmount(vnode: PetitDom.VNode): void;
+
+export namespace PetitDom {
+    type Key = string | number;
+    type ComponentProps = object;
+    interface ContentArray extends ReadonlyArray<Content> {}
+    type Content = string | VNode | ContentArray;
+
+    type DOMElementProps<E extends Element> = {
+        [P in keyof E]?: E[P];
+    };
+
+    interface IntrinsicProps {
+        content?: Content | ReadonlyArray<Content>;
+        key?: Key;
+    }
+
+    type Props<E extends Element = Element> = IntrinsicProps & DOMElementProps<E>;
+
+    type ShouldUpdate<P extends ComponentProps> = (
+        newProps: P,
+        oldProps: P,
+        newContent: ReadonlyArray<VNode>,
+        oldContent: ReadonlyArray<VNode>
+    ) => boolean;
+
+    interface FunctionComponent<P extends ComponentProps> {
+        (props: P, content: ReadonlyArray<Content>): FunctionComponentNode<P>;
+        shouldUpdate?: ShouldUpdate<P>;
+    }
+
+    interface ComponentClass<P extends ComponentProps> {
+        new(props: P, content: ReadonlyArray<Content>): Component<P>;
+    }
+
+    interface Component<P extends ComponentProps> {
+        mount(props: P, content: ReadonlyArray<VNode>): Element;
+        patch(element: Element, newProps: P, oldProps: P, newContent: ReadonlyArray<VNode>, oldContent: ReadonlyArray<VNode>): Element;
+        unmount(element: Element): void;
+    }
+
+    interface VNode {
+        readonly isSVG: boolean;
+        readonly type: any;
+        readonly key: Key | null;
+        readonly props: any;
+        readonly content: ReadonlyArray<VNode>;
+    }
+
+    interface ElementNode<T extends keyof DomElements, E extends DomElements[T]> extends VNode {
+        readonly type: T;
+        readonly props: Props<E>;
+    }
+
+    interface ComponentNode<P extends ComponentProps> extends VNode {
+        readonly type: Component<P>;
+        readonly props: P & IntrinsicProps;
+    }
+
+    interface ComponentClassNode<P extends ComponentProps> extends VNode {
+        readonly type: ComponentClass<P>;
+        readonly props: P & IntrinsicProps;
+    }
+
+    interface FunctionComponentNode<P extends ComponentProps> extends VNode {
+        readonly type: FunctionComponent<P>;
+        readonly props: P & IntrinsicProps;
+    }
+
+    interface DomElements extends HTMLElementTagNameMap, SVGElementTagNameMap {
+        "main": HTMLMainElement;
+    }
+}
+
+declare global {
+    namespace JSX {
+        // tslint:disable-next-line:no-empty-interface
+        interface Element extends PetitDom.VNode { }
+
+        // tslint:disable-next-line:no-empty-interface
+        interface ElementClass extends PetitDom.Component<PetitDom.ComponentProps> { }
+
+        // tslint:disable-next-line:no-empty-interface
+        interface IntrinsicClassAttributes<T> extends PetitDom.Props { }
+
+        // tslint:disable-next-line:no-empty-interface
+        interface IntrinsicAttributes extends PetitDom.IntrinsicProps { }
+
+        interface ElementAttributesProperty { props: PetitDom.Props; }
+
+        interface ElementChildrenAttribute { content: PetitDom.VNode[]; }
+
+        type IntrinsicElements = {
+            [P in keyof PetitDom.DomElements]:
+            PetitDom.Props<PetitDom.DomElements[P]> &
+            {
+                content?: PetitDom.Content | ReadonlyArray<PetitDom.Content>;
+            };
+        };
+    }
+}
+
+// @filename: petit-dom-tests.tsx
+/* @jsx h */
+// tslint:disable:no-empty
+// tslint:disable:no-null-keyword
+
+import { h, mount, patch, PetitDom, unmount } from "petit-dom";
+
+function assertEqual<T>(a: T, b: T) { }
+
+function eventHandler(event: Event): void { }
+
+interface CustomProps {
+    name: string;
+    count: number;
+    onSomeEvent(event: Event): void;
+}
+
+/**
+ * Create an <a> element with text content, using HyperScript syntax and JSX syntax
+ */
+export function testHtmlElementWithTextContent() {
+    // HyperScript syntax returns an ElementNode<T> object, with typed properties
+    const aNode = h("a", { href: "link", onclick: eventHandler }, "click here");
+
+    assertEqual(aNode.isSVG, false);
+    assertEqual(aNode.type, "a");
+    assertEqual(aNode.key, null);
+    assertEqual(aNode.props.href, "link");
+    assertEqual(aNode.props.onclick, eventHandler);
+    assertEqual(aNode.content.length, 1);
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = <a href="link" onclick={eventHandler}>click here</a>;
+    const jsxNodeType = jsxNode.type as string;
+    const jsxNodeProps = jsxNode.props as PetitDom.Props<HTMLAnchorElement>;
+
+    assertEqual(jsxNode.isSVG, false);
+    assertEqual(jsxNodeType, "a");
+    assertEqual(jsxNode.key, null);
+    assertEqual(jsxNodeProps.href, "link");
+    assertEqual(jsxNodeProps.onclick, eventHandler);
+    assertEqual(jsxNode.content.length, 1);
+}
+
+/**
+ * Create a <form> element with both text content and child elements, using HyperScript syntax and JSX syntax
+ */
+export function testHtmlElementWithMixedContent() {
+    // HyperScript syntax returns an ElementNode<T> object, with typed properties
+    const formNode = h(
+        "form",
+        { key: 1, method: "POST", onsubmit: eventHandler },
+        "Hello ", h("span", null, "World")
+    );
+
+    assertEqual(formNode.isSVG, false);
+    assertEqual(formNode.type, "form");
+    assertEqual(formNode.key, 1);
+    assertEqual(formNode.props.method, "POST");
+    assertEqual(formNode.props.onsubmit, eventHandler);
+    assertEqual(formNode.content.length, 2);
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = <form key={1} method="POST" onsubmit={eventHandler}>Hello <span>World</span></form>;
+    const jsxNodeType = jsxNode.type as string;
+    const jsxNodeProps = jsxNode.props as PetitDom.Props<HTMLFormElement>;
+
+    assertEqual(jsxNode.isSVG, false);
+    assertEqual(jsxNodeType, "form");
+    assertEqual(jsxNode.key, 1);
+    assertEqual(jsxNodeProps.method, "POST");
+    assertEqual(jsxNodeProps.onsubmit, eventHandler);
+    assertEqual(jsxNode.content.length, 2);
+}
+
+/**
+ * Create an <svg> element with a child element, using HyperScript syntax and JSX syntax
+ */
+export function testSvgElementWithChild() {
+    // HyperScript syntax returns an ElementNode<T> object, with typed properties
+    const svgNode = h("svg", { key: 2, currentScale: 1 }, h("path"));
+
+    assertEqual(svgNode.isSVG, true);
+    assertEqual(svgNode.type, "svg");
+    assertEqual(svgNode.key, 2);
+    assertEqual(svgNode.props.currentScale, 1);
+    assertEqual(svgNode.content.length, 1);
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = <svg key={2} currentScale={1}><path /></svg>;
+    const jsxNodeType = jsxNode.type as string;
+    const jsxNodeProps = jsxNode.props as PetitDom.Props<SVGSVGElement>;
+
+    assertEqual(jsxNode.isSVG, true);
+    assertEqual(jsxNodeType, "svg");
+    assertEqual(jsxNode.key, 2);
+    assertEqual(jsxNodeProps.currentScale, 1);
+    assertEqual(jsxNode.content.length, 1);
+}
+
+/**
+ * Create a function component, using HyperScript syntax and JSX syntax
+ */
+export function testFunctionComponent() {
+    function FunctionComponent(): JSX.Element {
+        return <div>Hello World</div>;
+    }
+
+    // HyperScript syntax returns a FunctionComponentNode<T> object, with typed properties
+    const node = h(FunctionComponent, { key: "1" });
+
+    assertEqual(node.isSVG, false);
+    assertEqual(node.type, FunctionComponent);
+    assertEqual(node.key, "1");
+    assertEqual(node.props.key, "1");
+    assertEqual(node.content.length, 0);
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = <FunctionComponent key="1" />;
+    const jsxNodeType = jsxNode.type as PetitDom.FunctionComponent<{}>;
+    const jsxNodeProps = jsxNode.props as PetitDom.IntrinsicProps;
+
+    assertEqual(jsxNode.isSVG, false);
+    assertEqual(jsxNodeType, FunctionComponent);
+    assertEqual(jsxNode.key, "1");
+    assertEqual(jsxNodeProps.key, "1");
+    assertEqual(jsxNode.content.length, 0);
+}
+
+/**
+ * Create a function component with props, using HyperScript syntax and JSX syntax
+ */
+export function testFunctionComponentWithProps() {
+    function FunctionComponentWithProps(props: CustomProps): JSX.Element {
+        const { name, count, onSomeEvent } = props;
+        return <div className={name} tabIndex={count} onclick={onSomeEvent}></div>;
+    }
+
+    // HyperScript syntax returns a FunctionComponentNode<T> object, with typed properties
+    const node = h(FunctionComponentWithProps, { name: "xyz", count: 123, onSomeEvent: eventHandler });
+
+    assertEqual(node.isSVG, false);
+    assertEqual(node.type, FunctionComponentWithProps);
+    assertEqual(node.key, null);
+    assertEqual(node.props.name, "xyz");
+    assertEqual(node.props.count, 123);
+    assertEqual(node.props.onSomeEvent, eventHandler);
+    assertEqual(node.content.length, 0);
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = <FunctionComponentWithProps name="xyz" count={123} onSomeEvent={eventHandler} />;
+    const jsxNodeType = jsxNode.type as PetitDom.FunctionComponent<CustomProps>;
+    const jsxNodeProps = jsxNode.props as CustomProps;
+
+    assertEqual(jsxNode.isSVG, false);
+    assertEqual(jsxNodeType, FunctionComponentWithProps);
+    assertEqual(jsxNode.key, null);
+    assertEqual(jsxNodeProps.name, "xyz");
+    assertEqual(jsxNodeProps.count, 123);
+    assertEqual(jsxNodeProps.onSomeEvent, eventHandler);
+    assertEqual(jsxNode.content.length, 0);
+}
+
+/**
+ * Create a function component with child content, using HyperScript syntax and JSX syntax
+ */
+export function testFunctionComponentWithChildren() {
+    function FunctionComponentWithChildren(props: CustomProps, content: ReadonlyArray<PetitDom.Content>): JSX.Element {
+        const { name, count, onSomeEvent } = props;
+        return <div className={name} tabIndex={count} onclick={onSomeEvent}>{content}</div>;
+    }
+
+    // HyperScript syntax returns a FunctionComponentNode<T> object, with typed properties
+    const node = h(
+        FunctionComponentWithChildren,
+        { name: "xyz", count: 123, onSomeEvent: eventHandler },
+        "Hello",
+        h("span", null, "World")
+    );
+
+    assertEqual(node.isSVG, false);
+    assertEqual(node.type, FunctionComponentWithChildren);
+    assertEqual(node.key, null);
+    assertEqual(node.props.name, "xyz");
+    assertEqual(node.props.count, 123);
+    assertEqual(node.props.onSomeEvent, eventHandler);
+    assertEqual(node.content.length, 2);
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = (
+        <FunctionComponentWithChildren name="xyz" count={123} onSomeEvent={eventHandler}>
+            Hello <span>World</span>
+        </FunctionComponentWithChildren>
+    );
+    const jsxNodeType = jsxNode.type as PetitDom.FunctionComponent<CustomProps>;
+    const jsxNodeProps = jsxNode.props as CustomProps;
+
+    assertEqual(jsxNode.isSVG, false);
+    assertEqual(jsxNodeType, FunctionComponentWithChildren);
+    assertEqual(jsxNode.key, null);
+    assertEqual(jsxNodeProps.name, "xyz");
+    assertEqual(jsxNodeProps.count, 123);
+    assertEqual(jsxNodeProps.onSomeEvent, eventHandler);
+    assertEqual(jsxNode.content.length, 2);
+}
+
+/**
+ * Create a component class, using HyperScript syntax and JSX syntax
+ */
+export function testComponentClass() {
+    class ComponentClass {
+        props = {};
+
+        mount(): Element {
+            return mount(<div className="some-class"></div>);
+        }
+
+        patch(element: Element, newProps: object, oldProps: object, newContent: ReadonlyArray<PetitDom.VNode>, oldContent: ReadonlyArray<PetitDom.VNode>): Element {
+            patch(
+                <div {...oldProps}>{oldContent}</div>,
+                <div {...newProps}>{newContent}</div>
+            );
+            return element;
+        }
+
+        unmount(element: Element): void {
+            unmount(<div>Hello World</div>);
+        }
+    }
+
+    // HyperScript syntax returns a ComponentClassNode<T> object, with typed properties
+    const node = h(ComponentClass, { key: "1" });
+
+    assertEqual(node.isSVG, false);
+    assertEqual(node.type, ComponentClass);
+    assertEqual(node.key, "1");
+    assertEqual(node.props.key, "1");
+    assertEqual(node.content.length, 0);
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = <ComponentClass key="1" />;
+    const jsxNodeType = jsxNode.type as PetitDom.ComponentClass<{}>;
+    const jsxNodeProps = jsxNode.props as PetitDom.IntrinsicProps;
+
+    assertEqual(jsxNode.isSVG, false);
+    assertEqual(jsxNodeType, ComponentClass);
+    assertEqual(jsxNode.key, "1");
+    assertEqual(jsxNodeProps.key, "1");
+    assertEqual(jsxNode.content.length, 0);
+}
+
+/**
+ * Create a component class with props, using HyperScript syntax and JSX syntax
+ */
+export function testComponentClassWithProps() {
+    class ComponentClassWithProps {
+        props: CustomProps;
+
+        constructor(props: CustomProps) {
+            this.props = props;
+        }
+
+        mount(props: CustomProps): Element {
+            const { name, count, onSomeEvent } = props;
+            return mount(<div className={name} tabIndex={count} onclick={onSomeEvent} />);
+        }
+
+        patch(element: Element, newProps: CustomProps, oldProps: CustomProps, newContent: ReadonlyArray<PetitDom.VNode>, oldContent: ReadonlyArray<PetitDom.VNode>): Element {
+            patch(
+                <div {...oldProps}>{oldContent}</div>,
+                <div {...newProps}>{newContent}</div>
+            );
+            return element;
+        }
+
+        unmount(element: Element): void {
+            unmount(<div> Hello World</div >);
+        }
+    }
+
+    // HyperScript syntax returns a ComponentClassNode<T> object, with typed properties
+    const node = h(ComponentClassWithProps, { name: "xyz", count: 123, onSomeEvent: eventHandler });
+
+    assertEqual(node.isSVG, false);
+    assertEqual(node.type, ComponentClassWithProps);
+    assertEqual(node.key, null);
+    assertEqual(node.props.name, "xyz");
+    assertEqual(node.props.count, 123);
+    assertEqual(node.props.onSomeEvent, eventHandler);
+    assertEqual(node.content.length, 0);
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = <ComponentClassWithProps name="xyz" count={123} onSomeEvent={eventHandler} />;
+    const jsxNodeType = jsxNode.type as PetitDom.ComponentClass<CustomProps>;
+    const jsxNodeProps = jsxNode.props as CustomProps;
+
+    assertEqual(jsxNode.isSVG, false);
+    assertEqual(jsxNodeType, ComponentClassWithProps);
+    assertEqual(jsxNode.key, null);
+    assertEqual(jsxNodeProps.name, "xyz");
+    assertEqual(jsxNodeProps.count, 123);
+    assertEqual(jsxNodeProps.onSomeEvent, eventHandler);
+    assertEqual(jsxNode.content.length, 0);
+}
+
+/**
+ * Create a component class with child content, using HyperScript syntax and JSX syntax
+ */
+export function testComponentClassWithChildren() {
+    class ComponentClassWithChildren {
+        props: CustomProps;
+
+        constructor(props: CustomProps) {
+            this.props = props;
+        }
+
+        mount(props: CustomProps, content: ReadonlyArray<PetitDom.Content>): Element {
+            const { name, count, onSomeEvent } = props;
+            return mount(
+                <div className={name} tabIndex={count} onclick={onSomeEvent}>{content}</div>
+            );
+        }
+
+        patch(element: Element, newProps: CustomProps, oldProps: CustomProps, newContent: ReadonlyArray<PetitDom.VNode>, oldContent: ReadonlyArray<PetitDom.VNode>): Element {
+            patch(
+                <div {...oldProps}>{oldContent}</div>,
+                <div {...newProps}>{newContent}</div>
+            );
+            return element;
+        }
+
+        unmount(element: Element): void {
+            unmount(<div> Hello World</div >);
+        }
+    }
+
+    // HyperScript syntax returns a ComponentClassNode<T> object, with typed properties
+    const node = h(
+        ComponentClassWithChildren,
+        { name: "xyz", count: 123, onSomeEvent: eventHandler },
+        "Hello",
+        h("span", null, "World")
+    );
+
+    assertEqual(node.isSVG, false);
+    assertEqual(node.type, ComponentClassWithChildren);
+    assertEqual(node.key, null);
+    assertEqual(node.props.name, "xyz");
+    assertEqual(node.props.count, 123);
+    assertEqual(node.props.onSomeEvent, eventHandler);
+    assertEqual(node.content.length, 2);
+
+    // JSX syntax returns a VNode object, so the "type" and "props" properties are "any"
+    const jsxNode = (
+        <ComponentClassWithChildren name="xyz" count={123} onSomeEvent={eventHandler}>
+            Hello <span>World</span>
+        </ComponentClassWithChildren>
+    );
+    const jsxNodeType = jsxNode.type as PetitDom.ComponentClass<CustomProps>;
+    const jsxNodeProps = jsxNode.props as CustomProps;
+
+    assertEqual(jsxNode.isSVG, false);
+    assertEqual(jsxNodeType, ComponentClassWithChildren);
+    assertEqual(jsxNode.key, null);
+    assertEqual(jsxNodeProps.name, "xyz");
+    assertEqual(jsxNodeProps.count, 123);
+    assertEqual(jsxNodeProps.onSomeEvent, eventHandler);
+    assertEqual(jsxNode.content.length, 2);
+}