mapbox-gl-directions icon indicating copy to clipboard operation
mapbox-gl-directions copied to clipboard

Evaluate usage of Object.assign()

Open mapsam opened this issue 9 years ago • 1 comments

Currently in our reducer we use Object.assign() liberally. This works great for single-depth objects, and key value pairs where the value isn't another object. Working on #101 shows that if you pass the following options:

var directions = new MapboxDirections({
  controls: {
    inputs: false
  }
});

The options reducer outputs the following object:

console.log(options); // { controls: { inputs: false } }

But I would expect the default instructions to still exist:

console.log(options); // { controls: { inputs: false, instructions: true } }

The source of the problem here is Object.assign() here where we add defaults and custom options, but deeply nested object values completely override instead of replacing individual key/value pairs. Example:

var defaults = { 
  "hello": "world", 
  "items": { 
    "one": true, 
    "two": true 
  } 
};
var custom = { 
  "hello": "earth", 
  "items": { 
    "one": false 
  }
};

var obj = Object.assign({}, defaults, custom);
console.log(obj); // =>
// { 
//   "hello": "earth", 
//   "items": { 
//     "one": false
//   }
// }

// but I expect

// { 
//   "hello": "earth", 
//   "items": { 
//     "one": false,
//     "two": true
//   }
// }

We need to deep assign here: https://github.com/sindresorhus/deep-assign

cc @tmcw @springmeyer

mapsam avatar Dec 06 '16 23:12 mapsam

👍 Yep, sounds like a good plan, let's switch to deep-assign where appropriate.

tmcw avatar Dec 08 '16 17:12 tmcw