Repository: DevExpress/devextreme-react
Pull request #62 (2018-04-18 13:51:26)

Stop pass React children to a widget options


Patch:
diff --git a/src/core/component.ts b/src/core/component.ts
index 7a440f8..2255483 100644
--- a/src/core/component.ts
+++ b/src/core/component.ts
@@ -113,17 +113,25 @@ export default class Component<P> extends React.PureComponent<P, any> {
     const options: Record<string, any> = {};
     const templates: Record<string, any> = {};
 
+    const knownTemplates: Record<string, any> = {};
+
+    const reactProps: Record<string, any> = {
+      children: true
+    };
+
+    this._templateProps.forEach((value) => {
+      knownTemplates[value.component] = true;
+      knownTemplates[value.render] = true;
+    });
+
     Object.keys(props).forEach((key) => {
-      const gaurdedOptionName = this._defaults ? this._defaults[key] : null;
-      const templateFilter = (templateProp: ITemplateMeta) =>
-        templateProp.render === key || templateProp.component === key;
-      const templateOptionName = this._templateProps.filter(templateFilter).length ? key : null;
-
-      if (gaurdedOptionName) {
-        defaults[gaurdedOptionName] = props[key];
-      } else if (templateOptionName) {
-        templates[templateOptionName] = props[key];
-      } else {
+      const defaultOptionName = this._defaults ? this._defaults[key] : null;
+
+      if (defaultOptionName) {
+        defaults[defaultOptionName] = props[key];
+      } else if (knownTemplates[key]) {
+        templates[key] = props[key];
+      } else if (!reactProps[key]) {
         options[key] = this._wrapEventHandler(props, key);
       }
     });
@@ -187,11 +195,10 @@ export default class Component<P> extends React.PureComponent<P, any> {
           this._fillTemplate(options[m.render].bind(this));
       }
     });
-    if (Object.keys(templates).length === 0) {
-      return null;
-    }
 
-    return result;
+    if (Object.keys(templates).length > 0) {
+      return result;
+    }
   }
 
   private _fillTemplate(tmplFn: any): object {
diff --git a/tools/integration-data.json b/tools/integration-data.json
index fd56875..940df09 100644
--- a/tools/integration-data.json
+++ b/tools/integration-data.json
@@ -2304,7 +2304,7 @@
       {
         "name": "firstDayOfWeek",
         "types": [
-          "String"
+          "Number"
         ],
         "valueRestriction": {
           "type": "Number",
@@ -18648,7 +18648,7 @@
           {
             "name": "layout",
             "types": [
-              "String"
+              "Number"
             ],
             "valueRestriction": {
               "type": "Number",
@@ -19348,7 +19348,7 @@
       {
         "name": "layout",
         "types": [
-          "String"
+          "Number"
         ],
         "valueRestriction": {
           "type": "Number",
@@ -25210,7 +25210,7 @@
       {
         "name": "firstDayOfWeek",
         "types": [
-          "String"
+          "Number"
         ],
         "valueRestriction": {
           "type": "Number",
@@ -25640,7 +25640,7 @@
           {
             "name": "firstDayOfWeek",
             "types": [
-              "String"
+              "Number"
             ],
             "valueRestriction": {
               "type": "Number",


Test patch:
diff --git a/src/core/component.test.tsx b/src/core/component.test.tsx
index e111c6f..250e917 100644
--- a/src/core/component.test.tsx
+++ b/src/core/component.test.tsx
@@ -68,6 +68,16 @@ describe("component rendering", () => {
         expect(WidgetClass.mock.instances.length).toBe(2);
         expect(WidgetClass.mock.instances[1]).toEqual({});
     });
+
+    it("do not pass children to options", () => {
+        mount(
+            <TestComponent>
+                <TestComponent />
+            </TestComponent>
+        );
+
+        expect(WidgetClass.mock.calls[1][1]).toEqual({});
+    });
 });
 
 describe("templates", () => {