GH-2614: N4JSX should accept functions that return ReactNodes (#2621)

* allow ReactNodes as a return type for jsx component functions

* adjust tests

* adjust tests

plugins/org.eclipse.n4js/src/org/eclipse/n4js/tooling/react/ReactHelper.java

@@ -77,6 +77,8 @@ public class ReactHelper {
 	/***/
 	public final static String REACT_COMPONENT = "Component";
 	/***/
+	public final static String REACT_NODE = "ReactNode";
+	/***/
 	public final static String REACT_ELEMENT = "ReactElement";
 	/***/
 	public final static String REACT_FRAGMENT_NAME = "Fragment";
@@ -174,6 +176,20 @@ public IdentifiableElement getJsxBackendFragmentComponent(Resource resource) {
 		return null;
 	}
 
+	/**
+	 * Look up React.Node in the index.
+	 *
+	 * @param context
+	 *            the EObject serving the context to look for React.Node.
+	 */
+	public TClassifier lookUpReactNode(EObject context) {
+		// val reactElement = lookUpReactClassifier(context, REACT_ELEMENT, TInterface)
+		// if (reactElement !== null) {
+		// return reactElement;
+		// }
+		return lookUpReactClassifier_OLD(context, REACT_NODE, TInterface.class);
+	}
+
 	/**
 	 * Look up React.Element in the index.
 	 *

plugins/org.eclipse.n4js/src/org/eclipse/n4js/validation/validators/N4JSXValidator.xtend

@@ -221,11 +221,11 @@ class N4JSXValidator extends AbstractN4JSDeclarativeValidator {
 	 * See Req. IDE-241116
 	 */
 	def private void checkFunctionTypeExprOrRef(JSXElement jsxElem, FunctionTypeExprOrRef exprTypeRef) {
-		val tReactElement = reactHelper.lookUpReactElement(jsxElem);
-		if (tReactElement === null)
+		val tReactNode = reactHelper.lookUpReactNode(jsxElem);
+		if (tReactNode === null)
 			return;
 
-		val expectedReturnTypeRef = TypeUtils.createTypeRef(tReactElement, TypingStrategy.DEFAULT, true);
+		val expectedReturnTypeRef = TypeUtils.createTypeRef(tReactNode, TypingStrategy.DEFAULT, true);
 
 		val expr = jsxElem.jsxElementName.expression;
 		val G = expr.newRuleEnvironment;

tests/org.eclipse.n4js.spec.tests/xt-tests/FunctionReactNode.n4jsx.xt

@@ -0,0 +1,37 @@
+/*
+ * Copyright (c) 2016 NumberFour AG.
+ * All rights reserved. This program and the accompanying materials
+ * are made available under the terms of the Eclipse Public License v1.0
+ * which accompanies this distribution, and is available at
+ * http://www.eclipse.org/legal/epl-v10.html
+ *
+ * Contributors:
+ *   NumberFour AG - Initial API and implementation
+ */
+
+/* XPECT_SETUP org.eclipse.n4js.spec.tests.SpecXtTest
+
+   Workspace {
+		Project "N4JSXSpecTest" {
+			Folder "src" {
+				ThisFile {}
+			}
+			File "package.json" { from="../package_default.json" }
+		}
+		Project "react" {
+			File "index.n4jsd" { from = "react/index.n4jsd" }
+			File "package.json" { from = "react/package.json" }
+		}
+	}
+
+	END_SETUP
+*/
+
+import * as React from "react/index";
+
+
+function Comp(): React.ReactNode {
+    return null;
+}
+// XPECT noerrors -->
+<Comp />

tests/org.eclipse.n4js.spec.tests/xt-tests/Req241116_JSXElements_Referring_to_React_Components.n4jsx.xt

@@ -40,7 +40,7 @@ function MyNormalFunction(props: ~React.ComponentProps with {myOtherProp: string
 	return "My Normal Function";
 }
 
-// XPECT errors --> "Expecting a function returning a value of type ReactElement<?> but the return type is string." at "MyNormalFunction"
+// XPECT noerrors --> "Expecting a function returning a value of type ReactElement<?> but the return type is string." at "MyNormalFunction"
 <MyNormalFunction myOtherProp="Hello"/>
 
 class MyReactClassComponent extends React.Component<~React.ComponentProps with {prop: int}, Object> {

tests/org.eclipse.n4js.spec.tests/xt-tests/react/index.n4jsd

@@ -45,6 +45,16 @@ export external public abstract class PureComponent<PropsT extends ComponentProp
         extends Component<PropsT, StateT> {
 }
 
+
+export external public type ReactText = string | number;
+export external public type ReactChild = ReactElement<?> | ReactText;
+
+export external public type ReactNodeArray = ReactNode[];
+export external public type ReactFragment = Object | ReactNodeArray;
+export external public type ReactNode = ReactChild | ReactFragment | /* ReactPortal<?> | */ boolean;
+
+
+
 // mor TODO IDE-2323
 //    public static <PropsT extends ComponentProps> createElement(
 //        type: union{string, {function(PropsT?): ReactElement}, constructor{Component<PropsT, ?>}},

tests/org.eclipse.n4js.spec.tests/xt-tests/reactWithModifications/index.n4jsd

@@ -49,6 +49,17 @@ export external public abstract class Component<PropsT extends ComponentProps, S
     protected componentWillUnmount(): void;
 }
 
+
+export external public type ReactText = string | number;
+export external public type ReactChild = ReactElement<?> | ReactText;
+
+export external public type ReactNodeArray = ReactNode[];
+export external public type ReactFragment = Object | ReactNodeArray;
+export external public type ReactNode = ReactChild | ReactFragment | /* ReactPortal<?> | */ boolean;
+
+
+
+
 export external public abstract class PureComponent<PropsT extends ComponentProps, StateT extends Object>
         extends Component<PropsT, StateT> {
 }

tests/org.eclipse.n4js.xpect.tests/react-implementations/valid/index.n4jsd

@@ -45,6 +45,17 @@ export external public abstract class PureComponent<PropsT extends ComponentProp
         extends Component<PropsT, StateT> {
 }
 
+
+export external public type ReactText = string | number;
+export external public type ReactChild = ReactElement<?> | ReactText;
+
+export external public type ReactNodeArray = ReactNode[];
+export external public type ReactFragment = Object | ReactNodeArray;
+export external public type ReactNode = ReactChild | ReactFragment | /* ReactPortal<?> | */ boolean;
+
+
+
+
 // mor TODO IDE-2323
 //    public static <PropsT extends ComponentProps> createElement(
 //        type: union{string, {function(PropsT?): ReactElement}, constructor{Component<PropsT, ?>}},

tests/org.eclipse.n4js.xpect.tests/xt-tests/scoping/n4jsx/ClassComponentDescriptions.n4jsx.xt

@@ -43,7 +43,7 @@ export public class LowerComponent extends React.Component<~React.ComponentProps
 
 
 /* XPECT scope at 'React.<|>Component'  ---
-Component, ComponentProps, Fragment, PropConstraint, PropType, PropTypes, PureComponent, ReactElement
+Component, ComponentProps, Fragment, PropConstraint, PropType, PropTypes, PureComponent, ReactChild, ReactElement, ReactFragment, ReactNode, ReactNodeArray, ReactText
 --- */
 export public class MyComponent extends React.Component<~React.ComponentProps with {aProp: string}, String> {
 
@@ -72,7 +72,7 @@ export public class MyComponent extends React.Component<~React.ComponentProps wi
 		__proto__, arguments, console, global, constText, constructor,
 		decodeURI, decodeURIComponent, encodeURI, encodeURIComponent, eval, hasOwnProperty,
 		index.Component, index.ComponentProps, index.Fragment, index.PropConstraint,
-		index.PropType, index.PropTypes, import, index.PureComponent, index.ReactElement, index.cloneElement, index.createElement,
+		index.PropType, index.PropTypes, import, index.PureComponent, index.ReactChild, index.ReactElement, index.ReactFragment, index.ReactNode, index.ReactNodeArray, index.ReactText, index.cloneElement, index.createElement,
 		index.isValidElement, index.renderToStaticMarkup, index.renderToString, isFinite, isNaN,
 		isPrototypeOf, null, parseFloat, parseInt, propertyIsEnumerable,
 		toLocaleString, toString, undefined, valueOf, void

tests/org.eclipse.n4js.xpect.tests/xt-tests/scoping/n4jsx/FunctionComponentDescriptions.n4jsx.xt

@@ -39,7 +39,7 @@ class Props {
 }
 
 	/* XPECT scope at 'React.<|>ReactElement'  ---
-Component, ComponentProps, Fragment, PropConstraint, PropType, PropTypes, PureComponent, ReactElement
+Component, ComponentProps, Fragment, PropConstraint, PropType, PropTypes, PureComponent, ReactChild, ReactElement, ReactFragment, ReactNode, ReactNodeArray, ReactText
 --- */
 export public function NamedFnComponent(props: Props): React.ReactElement {
 	return (<div>{props.myProp}</div>);