[node] Fix order of operations when setting zoom and center

Zoom must be set first, to avoid center potentially getting constrained.

Fixes #7351

3 files changed, 46 insertions, 4 deletions

diff --git a/platform/node/src/node_map.cpp b/platform/node/src/node_map.cpp
index 48a954504c..acf83eef66 100644
--- a/platform/node/src/node_map.cpp
+++ b/platform/node/src/node_map.cpp
@@ -371,15 +371,15 @@ void NodeMap::startRender(NodeMap::RenderOptions options) {
         map->setClasses(options.classes);
     }
 
+    if (map->getZoom() != options.zoom) {
+        map->setZoom(options.zoom);
+    }
+
     mbgl::LatLng latLng(options.latitude, options.longitude);
     if (map->getLatLng() != latLng) {
         map->setLatLng(latLng);
     }
 
-    if (map->getZoom() != options.zoom) {
-        map->setZoom(options.zoom);
-    }
-
     if (map->getBearing() != options.bearing) {
         map->setBearing(options.bearing);
     }
diff --git a/platform/node/test/fixtures/zoom-center/expected.png b/platform/node/test/fixtures/zoom-center/expected.png
new file mode 100644
index 0000000000..93365c04d2
--- /dev/null
+++ b/platform/node/test/fixtures/zoom-center/expected.png
diff --git a/platform/node/test/js/map.test.js b/platform/node/test/js/map.test.js
index e2ff8d85d0..e3b287f68f 100644
--- a/platform/node/test/js/map.test.js
+++ b/platform/node/test/js/map.test.js
@@ -371,6 +371,48 @@ test('Map', function(t) {
             map.release();
             t.end();
         });
+
+        // This can't be tested with a test-suite render test because zoom and center
+        // are set via a different code path when included as style properties.
+        t.test('sets zoom before center', function(t) {
+            var map = new mbgl.Map(options);
+            map.load({
+                "version": 8,
+                "sources": {
+                    "geojson": {
+                        "type": "geojson",
+                        "data": {
+                            "type": "Point",
+                            "coordinates": [
+                                18.05489,
+                                59.32744
+                            ]
+                        }
+                    }
+                },
+                "layers": [
+                    {
+                        "id": "circle",
+                        "type": "circle",
+                        "source": "geojson",
+                        "paint": {
+                            "circle-color": "red"
+                        }
+                    }
+                ]
+            });
+            map.render({width: 400, height: 400, zoom: 5, center: [18.05489, 59.32744]}, function(err, actual) {
+                t.error(err);
+
+                var PNG = require('pngjs').PNG;
+                var pixelmatch = require('pixelmatch');
+                var expected = PNG.sync.read(
+                    fs.readFileSync(path.join(__dirname, '../fixtures/zoom-center/expected.png'))).data;
+                var numPixels = pixelmatch(actual, expected, undefined, 400, 400, { threshold: 0.13 });
+                t.equal(numPixels, 0);
+                t.end();
+            });
+        })
     });
 
     t.test('request callback', function (t) {