Support a mixture of arrays and single children for class based widgets using tsx

src/core/WidgetBase.ts

@@ -93,7 +93,7 @@ export class WidgetBase<P = WidgetProperties, C extends DNode = DNode> implement
 	 * property specifically for typing when using tsx
 	 */
 	/* tslint:disable-next-line:variable-name */
-	public __properties__!: this['properties'] & WidgetProperties & { __children__?: DNode[] | DNode };
+	public __properties__!: this['properties'] & WidgetProperties & { __children__?: DNode | (DNode | DNode[])[] };
 
 	/**
 	 * children array

src/core/interfaces.d.ts

@@ -576,7 +576,7 @@ export interface WidgetBaseInterface<P = WidgetProperties, C extends DNode = DNo
 	/**
 	 * property used for typing with tsx
 	 */
-	__properties__: this['properties'] & { __children__?: DNode[] | DNode };
+	__properties__: this['properties'] & { __children__?: DNode | (DNode | DNode[])[] };
 }
 
 /**

tests/core/unit/vdom.tsx

@@ -2828,6 +2828,26 @@ jsdomDescribe('vdom', () => {
 			assert.strictEqual(root.innerHTML, 'hello');
 		});
 
+		it('tsx supports a mixture of array and non array children', () => {
+			class App extends WidgetBase {
+				render() {
+					return <div>{this.children}</div>;
+				}
+			}
+			const domNode = document.createElement('div');
+			const r = renderer(() => (
+				<App>
+					{[<div>first</div>, <div>second</div>]}
+					{<div>third</div>}
+				</App>
+			));
+			r.mount({ domNode });
+			assert.strictEqual(
+				domNode.outerHTML,
+				'<div><div><div>first</div><div>second</div><div>third</div></div></div>'
+			);
+		});
+
 		describe('supports merging with a widget returned a the top level', () => {
 			it('Supports merging DNodes onto existing HTML', () => {
 				const iframe = document.createElement('iframe');
@@ -3194,7 +3214,7 @@ jsdomDescribe('vdom', () => {
 			});
 		});
 
-		describe('functional', () => {
+		describe('function based', () => {
 			it('children', () => {
 				const createWidget = create({ invalidator });