Add Selenium test

mapbox · Apr 6, 2020 · 3209bdc · 3209bdc
1 parent 41e5bd5
commit 3209bdc
Show file tree

Hide file tree

Showing 2 changed files with 77 additions and 1 deletion.
diff --git a/test/browser/fixtures/scaled-land.html b/test/browser/fixtures/scaled-land.html
@@ -0,0 +1,59 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <title>Mapbox GL JS debug page</title>
+    <meta charset='utf-8'>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
+    <link rel='stylesheet' href='../../../dist/mapbox-gl.css' />
+    <style>
+        body { margin: 0; padding: 0; }
+        html, body, #map { height: 100%; }
+        #map { transform: scale(2); }
+    </style>
+</head>
+
+<body>
+<div id='map'></div>
+
+<script src='../../../dist/mapbox-gl-dev.js'></script>
+<script src='../../../debug/access_token_generated.js'></script>
+
+<script>
+
+var map = window.map = new mapboxgl.Map({
+    container: 'map',
+    zoom: 1,
+    fadeDuration: 0,
+    center: [0, 0],
+    style: {
+        version: 8,
+        sources: {
+            land: {
+                type: 'geojson',
+                data: `${location.origin}/test/browser/fixtures/land.json`
+            }
+        },
+        layers: [
+            {
+                id: 'background',
+                type: 'background',
+                paint: {
+                    'background-color': '#72d0f2'
+                }
+            },
+            {
+                id: 'land',
+                type: 'fill',
+                source: 'land',
+                paint: {
+                    'fill-color': '#f0e9e1'
+                }
+            }
+        ]
+    }
+});
+
+</script>
+
+</body>
+</html>
diff --git a/test/browser/zoom.test.js b/test/browser/zoom.test.js
@@ -1,11 +1,12 @@
 import {test} from '../util/test';
 import browser from './util/browser';
+import {equalWithPrecision} from '../util';
 
 test("zooming", async t => {
     const {driver} = browser;
 
     await t.test("double click at the center", async t => {
-        const canvas = await browser.getMapCanvas(`${browser.basePath}/test/browser/fixtures/land.html`);
+        const canvas = await browser.getMapCanvas(`${browser.basePath}/test/browser/fixtures/land.html`, 'canvas');
 
         // Double-click on the center of the map.
         await driver.executeScript(browser.doubleClick, canvas);
@@ -18,4 +19,20 @@ test("zooming", async t => {
 
         t.equals(zoom, 2, 'zoomed in by 1 zoom level');
     });
+
+    await t.test("double click at the center with scaled map", async t => {
+        const canvas = await browser.getMapCanvas(`${browser.basePath}/test/browser/fixtures/scaled-land.html`);
+
+        // Double-click on the center of the map.
+        await driver.executeScript(browser.doubleClick, canvas);
+
+        // Wait until the map has settled, then report the zoom level back.
+        const center = await driver.executeAsyncScript(callback => {
+            /* eslint-disable no-undef */
+            map.once('idle', () => callback(map.getCenter()));
+        });
+
+        equalWithPrecision(t, center.lng, -0.044, 0.001);
+        equalWithPrecision(t, center.lat, 0, 0.001);
+    });
 });