@homebound/form-state 2.22.2 → 2.22.4

package/dist/fields/listField.js

@@ -31,7 +31,9 @@ function newListFieldState(parentCopy, parentInstance, parentState, key, rules,
         if (!childState) {
             for (const [, otherState] of rowMap.entries()) {
                 if (otherState.isSameEntity(child)) {
-                    otherState.set(child, opts);
+                    // If we're being called from `list.rows`, we should be careful to not trigger mutations
+                    if (!(opts === null || opts === void 0 ? void 0 : opts.skipSet))
+                        otherState.set(child, opts);
                     rowMap.set(child, otherState);
                     return otherState;
                 }
@@ -100,7 +102,7 @@ function newListFieldState(parentCopy, parentInstance, parentState, key, rules,
                 (0, utils_1.fail)();
             // Avoid using `this.value` to avoid registering `_childTick` as a dependency
             const value = parentInstance[key];
-            return (value || []).map((child) => getOrCreateChildState(child));
+            return (value || []).map((child) => getOrCreateChildState(child, { skipSet: true }));
         },
         // TODO Should this be true when all rows are touched?
         get touched() {

package/dist/fields/objectField.js

@@ -163,6 +163,8 @@ function newObjectState(config, parentState, parentListState, instance, key, may
         get changedValue() {
             const result = {};
             getFields(this).forEach((f) => {
+                if (f._computed)
+                    return;
                 if (f.dirty ||
                     // If the caller used useFormState.ifUndefined to provide some default values, then those keys may not
                     // look dirty, but if we're new we should include them anyway.

package/dist/fields/valueField.js

@@ -18,6 +18,8 @@ function newValueFieldState(parentCopy, parentInstance, parentState, key, rules,
         _readOnly: readOnly || false,
         _loading: false,
         _focused: false,
+        // Expose so computed can be skipped in changedValue
+        _computed: computed,
         _isIdKey: isIdKey,
         _isDeleteKey: isDeleteKey,
         _isReadOnlyKey: isReadOnlyKey,
@@ -54,6 +56,12 @@ function newValueFieldState(parentCopy, parentInstance, parentState, key, rules,
         },
         // For primitive fields, the changed value is just the value.
         get changedValue() {
+            // Usually if we see a field being unset, we set `parent[key] = null`, but if we're wrapping
+            // a mobx observable object, it might have changed to `undefined` without us being able to
+            // tell it to be `null` (and potentially break the type contract of `string | undefined`).
+            // So detect un-set-ness here and return `null`.
+            if (this.value === undefined && this.originalValue !== undefined)
+                return null;
             return this.value;
         },
         get valid() {

package/dist/formState.test.js

@@ -442,6 +442,20 @@ describe("formState", () => {
         a1.books.remove(0);
         expect(a1.dirty).toBeFalsy();
     });
+    it("handles list fields with duplicate ids", () => {
+        // Given an author that incorrectly has duplicate books
+        const a1 = createAuthorInputState({
+            books: [
+                { id: "b:1", title: "b1" },
+                { id: "b:1", title: "b2" },
+            ],
+        });
+        // Then it didn't blow up
+        expect(a1.books.dirty).toBeFalsy();
+        // And the 1st book won
+        expect(a1.books.rows[0].title.value).toBe("b1");
+        expect(a1.books.rows[1].title.value).toBe("b1");
+    });
     it("calls maybeAutoSave when adding or removing to a list", () => {
         const maybeAutoSave = jest.fn();
         const a1 = createAuthorInputState({ books: [] }, maybeAutoSave);
@@ -979,11 +993,7 @@ describe("formState", () => {
     it("can observe observable objects being mutated directly", () => {
         // Given a mobx class with a computed
         const instance = new ObservableObject();
-        const formState = (0, objectField_1.createObjectState)({
-            firstName: { type: "value" },
-            lastName: { type: "value" },
-            fullName: { type: "value", computed: true },
-        }, instance);
+        const formState = (0, objectField_1.createObjectState)(authorWithFullName, instance);
         expect(formState.firstName.value).toEqual("first");
         expect(formState.fullName.value).toEqual("first last");
         // And we hook up reactivity to the computed
@@ -999,9 +1009,11 @@ describe("formState", () => {
         expect(formState.fullName.value).toEqual("change last");
         // And when the underlying mobx class has a field unset
         instance.firstName = undefined;
-        // Then our fomr-state computed re-runs again
+        // Then our form-state computed re-runs again
         expect(numCalcs).toBe(3);
         expect(formState.fullName.value).toEqual("undefined last");
+        // And knows the field should be sent as null
+        expect(formState.changedValue).toEqual({ firstName: null });
     });
     it("can set computeds that have setters", () => {
         const formState = (0, objectField_1.createObjectState)({
@@ -1086,6 +1098,18 @@ describe("formState", () => {
         // because this might trigger creating a throw-away entity
         expect(formState.changedValue).toEqual({ firstName: "f" });
     });
+    it("changedValue skips computeds", () => {
+        // Given a new author that calls full name
+        const formState = (0, objectField_1.createObjectState)(authorWithFullName, new ObservableObject());
+        expect(formState.fullName.value).toEqual("first last");
+        // When the firstName changes
+        formState.firstName.value = "First";
+        // Then the fullName changes
+        expect(formState.fullName.value).toBe("First last");
+        expect(formState.fullName.dirty).toBe(true);
+        // And we don't include it in the changedValue
+        expect(formState.changedValue).toEqual({ firstName: "First" });
+    });
     it("can return only changed list fields", () => {
         // Given an author with some books
         const formState = (0, objectField_1.createObjectState)(authorWithBooksConfig, {
@@ -1579,6 +1603,11 @@ const authorWithBooksConfig = configBuilders_1.f.config({
 function createAuthorInputState(input, maybeAutoSave) {
     return (0, objectField_1.createObjectState)(authorWithBooksConfig, input, { maybeAutoSave });
 }
+const authorWithFullName = {
+    firstName: { type: "value" },
+    lastName: { type: "value" },
+    fullName: { type: "value", computed: true },
+};
 const authorWithAddressConfig = {
     id: { type: "value" },
     firstName: { type: "value" },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@homebound/form-state",
-  "version": "2.22.2",
+  "version": "2.22.4",
   "author": "Homebound",
   "license": "MIT",
   "main": "dist/index.js",