Fixes #14: Update form state when new formData prop is passed.

Author: n1k0

dist/react-jsonschema-form-0.4.1.js

@@ -13,9 +13,17 @@ export default class Form extends Component {
 
   constructor(props) {
     super(props);
+    this.state = this.getStateFromProps(props);
+  }
+
+  componentWillReceiveProps(nextProps) {
+    this.setState(this.getStateFromProps(nextProps));
+  }
+
+  getStateFromProps(props) {
     const edit = !!props.formData;
     const formData = props.formData || getDefaultFormState(props.schema) || null;
-    this.state = {
+    return {
       status: "initial",
       formData,
       edit,

dist/react-jsonschema-form-0.4.1.js.map

@@ -11,8 +11,16 @@ class ArrayField extends Component {
 
   constructor(props) {
     super(props);
+    this.state = this.getStateFromProps(props);
+  }
+
+  componentWillReceiveProps(nextProps) {
+    this.setState(this.getStateFromProps(nextProps));
+  }
+
+  getStateFromProps(props) {
     const formData = Array.isArray(props.formData) ? props.formData : null;
-    this.state = {items: formData || getDefaultFormState(props.schema) || []};
+    return {items: formData || getDefaultFormState(props.schema) || []};
   }
 
   get itemTitle() {

src/components/Form.js

@@ -11,7 +11,15 @@ class ObjectField extends Component {
 
   constructor(props) {
     super(props);
-    this.state = props.formData || getDefaultFormState(props.schema) || {};
+    this.state = this.getStateFromProps(props);
+  }
+
+  componentWillReceiveProps(nextProps) {
+    this.setState(this.getStateFromProps(nextProps));
+  }
+
+  getStateFromProps(props) {
+    return props.formData || getDefaultFormState(props.schema) || {};
   }
 
   isRequired(name) {

src/components/fields/ArrayField.js

@@ -830,4 +830,35 @@ describe("Form", () => {
       sinon.assert.calledOnce(onError);
     });
   });
+
+  describe("External formData updates", () => {
+    describe("root level", () => {
+      it("should update form state from new formData prop value", () => {
+        const schema = {type: "string"};
+        const {comp} = createComponent({schema});
+
+        comp.componentWillReceiveProps({formData: "yo"});
+
+        expect(comp.state.formData).eql("yo");
+      });
+    });
+
+    describe("object level", () => {
+      it("should update form state from new formData prop value", () => {
+        const schema = {
+          type: "object",
+          properties: {
+            foo: {
+              type: "string"
+            }
+          }
+        };
+        const {comp} = createComponent({schema});
+
+        comp.componentWillReceiveProps({formData: {foo: "yo"}});
+
+        expect(comp.state.formData).eql({foo: "yo"});
+      });
+    });
+  });
 });