Fix(Map): set internal flags at beginning of map initialization (#6362)
* test(Map): add test for container size
When the map view is set directly during its initialization (i.e. using center and zoom map options), there is an edge case where later modifying the map container size may get invalidateSize into trouble, because it "already thinks" that the size has changed (flag _sizeChanged), hence re-reads it first, whereas it needs the previous size to be able to correctly compute the size difference.
This test fails in current state, fix to be added in next commit.
* fix(Map): assign internal flags first
in map initialization, in order to avoid inconsistent state if setView is called before (which happens if map is initialized with center and zoom options).
* test(Map): dummy mod
to re-trigger CI test…
* style(MapSpec): remove whitespace
ghybs authored 5 years ago
Vladimir Agafonkin committed 5 years ago
| 709 | 709 |
|
| 710 | 710 |
expect(spy.called).to.be.ok();
|
| 711 | 711 |
});
|
|
712 |
|
|
713 |
it("correctly adjusts for new container size when view is set during map initialization (#6165)", function () {
|
|
714 |
// Use a newly initialized map
|
|
715 |
map.remove();
|
|
716 |
|
|
717 |
var center = [0, 0];
|
|
718 |
|
|
719 |
// The edge case is only if view is set directly during map initialization
|
|
720 |
map = L.map(container, {
|
|
721 |
center: center,
|
|
722 |
zoom: 0
|
|
723 |
});
|
|
724 |
|
|
725 |
// Change the container size
|
|
726 |
container.style.width = '600px';
|
|
727 |
|
|
728 |
// The map should not be aware yet of container size change,
|
|
729 |
// otherwise the next invalidateSize will not be able to
|
|
730 |
// compute the size difference
|
|
731 |
expect(map.getSize().x).to.equal(100);
|
|
732 |
expect(map.latLngToContainerPoint(center).x).to.equal(50);
|
|
733 |
|
|
734 |
// Now notifying the map that the container size has changed,
|
|
735 |
// it should return new values and correctly position coordinates
|
|
736 |
map.invalidateSize();
|
|
737 |
|
|
738 |
expect(map.getSize().x).to.equal(600);
|
|
739 |
expect(map.latLngToContainerPoint(center).x).to.equal(300);
|
|
740 |
});
|
| 712 | 741 |
});
|
| 713 | 742 |
|
| 714 | 743 |
describe('#flyTo', function () {
|
| 125 | 125 |
initialize: function (id, options) { // (HTMLElement or String, Object)
|
| 126 | 126 |
options = Util.setOptions(this, options);
|
| 127 | 127 |
|
| 128 | |
this._initContainer(id);
|
| 129 | |
this._initLayout();
|
| 130 | |
|
| 131 | |
// hack for https://github.com/Leaflet/Leaflet/issues/1980
|
| 132 | |
this._onResize = Util.bind(this._onResize, this);
|
| 133 | |
|
| 134 | |
this._initEvents();
|
| 135 | |
|
| 136 | |
if (options.maxBounds) {
|
| 137 | |
this.setMaxBounds(options.maxBounds);
|
| 138 | |
}
|
| 139 | |
|
| 140 | |
if (options.zoom !== undefined) {
|
| 141 | |
this._zoom = this._limitZoom(options.zoom);
|
| 142 | |
}
|
| 143 | |
|
| 144 | |
if (options.center && options.zoom !== undefined) {
|
| 145 | |
this.setView(toLatLng(options.center), options.zoom, {reset: true});
|
| 146 | |
}
|
| 147 | |
|
|
128 |
// Make sure to assign internal flags at the beginning,
|
|
129 |
// to avoid inconsistent state in some edge cases.
|
| 148 | 130 |
this._handlers = [];
|
| 149 | 131 |
this._layers = {};
|
| 150 | 132 |
this._zoomBoundLayers = {};
|
| 151 | 133 |
this._sizeChanged = true;
|
|
134 |
|
|
135 |
this._initContainer(id);
|
|
136 |
this._initLayout();
|
|
137 |
|
|
138 |
// hack for https://github.com/Leaflet/Leaflet/issues/1980
|
|
139 |
this._onResize = Util.bind(this._onResize, this);
|
|
140 |
|
|
141 |
this._initEvents();
|
|
142 |
|
|
143 |
if (options.maxBounds) {
|
|
144 |
this.setMaxBounds(options.maxBounds);
|
|
145 |
}
|
|
146 |
|
|
147 |
if (options.zoom !== undefined) {
|
|
148 |
this._zoom = this._limitZoom(options.zoom);
|
|
149 |
}
|
|
150 |
|
|
151 |
if (options.center && options.zoom !== undefined) {
|
|
152 |
this.setView(toLatLng(options.center), options.zoom, {reset: true});
|
|
153 |
}
|
| 152 | 154 |
|
| 153 | 155 |
this.callInitHooks();
|
| 154 | 156 |
|