question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

L.Util.setOptions does not merge objects in config

See original GitHub issue

Checklist

  • I’ve looked at the documentation to make sure the behavior isn’t documented and expected.
  • I’m sure this is an issue with Leaflet, not with my app or other dependencies (Angular, Cordova, React, etc.).
  • I’ve searched through the current issues to make sure this hasn’t been reported yet.
  • I agree to follow the Code of Conduct that this project adheres to.

Steps to reproduce

When extending a LeafletControl (maybe other classes as well), nested options are not merged, as I expect it. If I have an object within my options object, the merging only adds the explicitely newly given attributes and does not keep the old ones.

In the minimal example, I add a control to the map. The control can be configured through the options passed in the factory function L.control.simpleControl(options); The nested options object in the class L.Control-SimpleControl is overwritten by the given options, without considering already stored default values: this leads to undefined values in the control to the bottom right. In my oppinion, leaflet should store these values to allow both separation of variables and providing default values.

Expected behavior

Leaflet should add the newly given properties to the nested configuration like this:

If adding the object to the map with these options…

L.control.simpleControl({
            position: "bottomleft",
            configurationObject: {
                currency: "euro"
            }
        }).addTo(map);

… leaflet should merge the configuration object, so explicitely given values through the factory function are changed, but others should be kept in default.

    options: {
        heading: "Checkout",
        configurationObject: {
            amount: 20,
            currency: "euro",
            sign: "$"
        }
    }

Current behavior

When adding the object to the leaflet map, keys in options are overwritten and no default can be described in the options:

L.control.simpleControl({
            position: "bottomleft",
            configurationObject: {
                currency: "euro"
            }
        }).addTo(map);

Leaflet overwrites the keys in options.configurationObject:

        {
            position: "bottomleft",
            configurationObject: {
                currency: "euro"
            }
        }

overwrites the properties options.configurationObject.amount and options.configurationObject.sign.

I have condensed the issue in the following image:

image

Minimal example reproducing the issue

https://plnkr.co/edit/FffSux4MRKmllYyo

Environment

  • Leaflet version: 1.7.1, 1.8

Issue Analytics

  • State:open
  • Created a year ago
  • Comments:20 (8 by maintainers)

github_iconTop GitHub Comments

2reactions
jonkoopscommented, Oct 4, 2022

I’m not against this adding this as an option. But perhaps this can also easily be done with existing JS features or a small lib?

1reaction
jonkoopscommented, Oct 12, 2022

We do not want to add dependencies when we can avoid this. So if this were to be implemented, then it would have to be in Leaflet itself.

However I think we should avoid complicating this functionality in Leaflet. One can even question if we still need to have this functionality at all since Object.assign and spread syntax are basically a more familiar and standardized way to accomplish this.

Perhaps this is more API that we should be stripping out for the 2.0 release?

Read more comments on GitHub >

github_iconTop Results From Across the Web

Leaflet: Seven rarely used features - webkid blog
In this post I will share some Leaflet features with you I wish I knew earlier. It should help you to use the...
Read more >
L.Util
Merges the given properties to the options of the obj object, returning the resulting options. See Class options. Has an L.setOptions shortcut. getParamString( ......
Read more >
Documentation - a JavaScript library for interactive maps
Instantiates a map object given the DOM ID of a <div> element and optionally an object literal with Map options . L.map(<HTMLElement> el,...
Read more >
How to Create Leaflet Control and Layer Plugins | Jeffrey
In the following initialize method, we call L. Util. setOptions to combine the values of the default settings (specified by the options object...
Read more >
protobuf.js
protobuf.js is a pure JavaScript implementation with TypeScript support for ... A valid message is an object (1) not missing any required fields...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found