Fix bug that does not return updated diffs for empty objects

Author: mattphillips

src/diff/index.js

@@ -1,4 +1,4 @@
-import { isDate, isEmpty, isObject, properObject } from '../utils';
+import { isDate, isEmptyObject, isObject, properObject } from "../utils";
 
 const diff = (lhs, rhs) => {
   if (lhs === rhs) return {}; // equal return no diff
@@ -22,7 +22,9 @@ const diff = (lhs, rhs) => {
 
     const difference = diff(l[key], r[key]);
 
-    if (isObject(difference) && isEmpty(difference) && !isDate(difference)) return acc; // return no diff
+    // If the difference is empty, and the lhs is an empty object or the rhs is not an empty object
+    if (isEmptyObject(difference) && !isDate(difference) && (isEmptyObject(l[key]) || !isEmptyObject(r[key])))
+      return acc; // return no diff
 
     return { ...acc, [key]: difference }; // return updated key
   }, deletedValues);

src/diff/index.test.js

@@ -43,6 +43,10 @@ describe('.diff', () => {
 
   describe('recursive case', () => {
     describe('object', () => {
+      test("return right hand side empty object value when left hand side has been updated", () => {
+        expect(diff({ a: 1 }, { a: {} })).toEqual({ a: {} });
+      });
+
       test('returns right hand side value when given objects are different', () => {
         expect(diff({ a: 1 }, { a: 2 })).toEqual({ a: 2 });
       });
@@ -77,6 +81,9 @@ describe('.diff', () => {
     });
 
     describe('arrays', () => {
+      test("return right hand side empty object value when left hand side has been updated", () => {
+        expect(diff([{ a: 1 }], [{ a: {} }])).toEqual({ 0: { a: {} } });
+      });
       test('returns right hand side value as object of indices to value when arrays are different', () => {
         expect(diff([1], [2])).toEqual({ 0: 2 });
       });

src/updated/index.js

@@ -1,7 +1,6 @@
-import { isDate, isEmpty, isObject, properObject } from '../utils';
+import { isDate, isEmptyObject, isObject, properObject } from "../utils";
 
 const updatedDiff = (lhs, rhs) => {
-
   if (lhs === rhs) return {};
 
   if (!isObject(lhs) || !isObject(rhs)) return rhs;
@@ -15,11 +14,12 @@ const updatedDiff = (lhs, rhs) => {
   }
 
   return Object.keys(r).reduce((acc, key) => {
-
     if (l.hasOwnProperty(key)) {
       const difference = updatedDiff(l[key], r[key]);
 
-      if (isObject(difference) && isEmpty(difference) && !isDate(difference)) return acc;
+      // If the difference is empty, and the lhs is an empty object or the rhs is not an empty object
+      if (isEmptyObject(difference) && !isDate(difference) && (isEmptyObject(l[key]) || !isEmptyObject(r[key])))
+        return acc; // return no diff
 
       return { ...acc, [key]: difference };
     }

src/updated/index.test.js

@@ -43,6 +43,10 @@ describe('.updatedDiff', () => {
 
   describe('recursive case', () => {
     describe('object', () => {
+      test("return right hand side empty object value when left hand side has been updated", () => {
+        expect(updatedDiff({ a: 1 }, { a: {} })).toEqual({ a: {} });
+      });
+
       test('returns right hand side value when given objects are different at root', () => {
         expect(updatedDiff({ a: 1 }, { a: 2 })).toEqual({ a: 2 });
       });
@@ -77,6 +81,10 @@ describe('.updatedDiff', () => {
     });
 
     describe('arrays', () => {
+      test("return right hand side empty object value when left hand side has been updated", () => {
+        expect(updatedDiff([{ a: 1 }], [{ a: {} }])).toEqual({ 0: { a: {} } });
+      });
+
       test('returns right hand side value as object of indices to value when arrays are different', () => {
         expect(updatedDiff([1], [2])).toEqual({ 0: 2 });
       });

src/utils/index.js

@@ -1,4 +1,5 @@
-export const isDate = d => d instanceof Date;
-export const isEmpty = o => Object.keys(o).length === 0;
-export const isObject = o => o != null && typeof o === 'object';
-export const properObject = o => isObject(o) && !o.hasOwnProperty ? { ...o } : o;
+export const isDate = (d) => d instanceof Date;
+export const isEmpty = (o) => Object.keys(o).length === 0;
+export const isObject = (o) => o != null && typeof o === "object";
+export const properObject = (o) => (isObject(o) && !o.hasOwnProperty ? { ...o } : o);
+export const isEmptyObject = (o) => isObject(o) && isEmpty(o);