Implement support for Arrays

.github/workflows/ci.yml

@@ -37,3 +37,25 @@ jobs:
       run: npm run lint
     - name: test
       run: npm run test
+
+  compat:
+    name: Compatibility
+    env:
+      CI: true
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        lib:
+          - ember-changeset
+          - ember-changeset-validations
+
+    steps:
+    - uses: actions/checkout@v2
+    - name: Install node
+      uses: actions/setup-node@v2-beta
+      with:
+        node-version: 12.x
+    - run: npm install
+    - name: "Test: ${{ matrix.lib }}"
+      run: npm run test-external:${{ matrix.lib }}
+

package.json

@@ -10,6 +10,7 @@
     "test": "jest",
     "test:all": "npm run test && npm run test-external:ember-changeset && npm run test-external:ember-changeset-validations",
     "test.watch": "jest --watch",
+    "test:debug:named": "node --inspect-brk node_modules/.bin/jest --runInBand --watch --testNamePattern",
     "lint": "eslint .",
     "prepare": "npm run build",
     "prepublishOnly": "npm run test && npm run lint",

src/index.ts

@@ -39,6 +39,7 @@ import {
   ValidatorAction,
   ValidatorMap
 } from './types';
+import { isArrayObject } from './utils/array-object';
 
 export {
   CHANGESET,
@@ -919,7 +920,9 @@ export class BufferedChangeset implements IChangeset {
     let content: Content = this[CONTENT];
     if (Object.prototype.hasOwnProperty.call(changes, baseKey)) {
       const changesValue = this.getDeep(changes, key);
-      if (!this.isObject(changesValue) && changesValue !== undefined) {
+      const isObject = this.isObject(changesValue);
+
+      if (!isObject && changesValue !== undefined) {
         // if safeGet returns a primitive, then go ahead return
         return changesValue;
       }
@@ -955,12 +958,26 @@ export class BufferedChangeset implements IChangeset {
           const baseContent = this.safeGet(content, baseKey);
           const subContent = this.getDeep(baseContent, remaining.join('.'));
           const subChanges = getSubObject(changes, key);
-          // give back and object that can further retrieve changes and/or content
+          // give back an object that can further retrieve changes and/or content
           const tree = new ObjectTreeNode(subChanges, subContent, this.getDeep, this.isObject);
           return tree.proxy;
         } else if (typeof result !== 'undefined') {
           return result;
         }
+        const baseContent = this.safeGet(content, baseKey);
+
+        if (Array.isArray(baseContent)) {
+          const subChanges = getSubObject(changes, key);
+
+          if (!subChanges) {
+            return this.getDeep(baseContent, remaining.join('.'));
+          }
+
+          // give back an object that can further retrieve changes and/or content
+          const tree = new ObjectTreeNode(subChanges, baseContent, this.getDeep, this.isObject);
+
+          return tree;
+        }
       }
 
       // this comes after the isObject check to ensure we don't lose remaining keys

src/utils/array-object.ts

@@ -0,0 +1,24 @@
+export function isArrayObject(obj: Record<string, any>) {
+  if (!obj) return false;
+
+  let maybeIndicies = Object.keys(obj);
+
+  return maybeIndicies.every(key => Number.isInteger(parseInt(key, 10)));
+}
+
+export function arrayToObject(array: any[]): Record<string, any> {
+  return array.reduce((obj, item, index) => {
+    obj[index] = item;
+    return obj;
+  }, {} as Record<string, any>);
+}
+
+export function objectToArray(obj: Record<string, any>): any[] {
+  let result: any[] = [];
+
+  for (let [index, value] of Object.entries(obj)) {
+    result[parseInt(index, 10)] = value;
+  }
+
+  return result;
+}

src/utils/merge-deep.ts

@@ -1,5 +1,6 @@
 import Change, { getChangeValue, isChange } from '../-private/change';
 import normalizeObject from './normalize-object';
+import { isArrayObject, objectToArray, arrayToObject } from './array-object';
 
 interface Options {
   safeGet: any;
@@ -154,6 +155,12 @@ export default function mergeDeep(
   let sourceAndTargetTypesMatch = sourceIsArray === targetIsArray;
 
   if (!sourceAndTargetTypesMatch) {
+    let sourceIsArrayLike = isArrayObject(source);
+
+    if (targetIsArray && sourceIsArrayLike) {
+      return objectToArray(mergeTargetAndSource(arrayToObject(target), source, options));
+    }
+
     return source;
   } else if (sourceIsArray) {
     return source;

src/utils/object-tree-node.ts

@@ -3,6 +3,8 @@ import isObject from './is-object';
 import setDeep from './set-deep';
 import Change, { getChangeValue, isChange } from '../-private/change';
 import normalizeObject from './normalize-object';
+import { objectToArray, arrayToObject, isArrayObject } from './array-object';
+import mergeDeep from './merge-deep';
 
 const objectProxyHandler = {
   /**
@@ -18,6 +20,7 @@ const objectProxyHandler = {
 
     if (node.changes.hasOwnProperty && node.changes.hasOwnProperty(key)) {
       childValue = node.safeGet(node.changes, key);
+
       if (typeof childValue === 'undefined') {
         return;
       }
@@ -118,11 +121,19 @@ class ObjectTreeNode implements ProxyHandler {
       if (isObject(content)) {
         changes = normalizeObject(changes, this.isObject);
         return { ...content, ...changes };
+      } else if (Array.isArray(content)) {
+        changes = normalizeObject(changes, this.isObject);
+
+        return objectToArray(mergeDeep(arrayToObject(content), changes));
       }
     }
 
     return changes;
   }
+
+  toJSON() {
+    return JSON.parse(JSON.stringify(this.unwrap()));
+  }
 }
 
 export { ObjectTreeNode };

src/utils/set-deep.ts

@@ -1,5 +1,6 @@
 import Change, { getChangeValue, isChange } from '../-private/change';
 import isObject from './is-object';
+import { isArrayObject } from './array-object';
 
 interface Options {
   safeSet: any;
@@ -59,18 +60,34 @@ export default function setDeep(
   for (let i = 0; i < keys.length; i++) {
     let prop = keys[i];
 
+    if (Array.isArray(target) && parseInt(prop, 10) < 0) {
+      throw new Error(
+        'Negative indices are not allowed as arrays do not serialize values at negative indices'
+      );
+    }
+
     const isObj = isObject(target[prop]);
-    if (!isObj) {
+    const isArray = Array.isArray(target[prop]);
+    const isComplex = isObj || isArray;
+
+    if (!isComplex) {
       options.safeSet(target, prop, {});
-    } else if (isObj && isChange(target[prop])) {
+    } else if (isComplex && isChange(target[prop])) {
       let changeValue = getChangeValue(target[prop]);
+
       if (isObject(changeValue)) {
         // if an object, we don't want to lose sibling keys
         const siblings = findSiblings(changeValue, keys);
+
         const resolvedValue = isChange(value) ? getChangeValue(value) : value;
-        target[prop] = new Change(
-          setDeep(siblings, keys.slice(1, keys.length).join('.'), resolvedValue, options)
-        );
+        const nestedKeys =
+          Array.isArray(target) || isArrayObject(target)
+            ? keys.slice(i + 1, keys.length).join('.') // remove first key segment as well as the index
+            : keys.slice(1, keys.length).join('.'); // remove first key segment
+
+        const newValue = setDeep(siblings, nestedKeys, resolvedValue, options);
+
+        target[prop] = new Change(newValue);
 
         // since we are done with the `path`, we can terminate the for loop and return control
         break;