From e74fade855f2cc3726e5810807155bcbc9e7f79f Mon Sep 17 00:00:00 2001 From: Molly Lloyd Date: Tue, 23 Aug 2016 11:23:36 -0700 Subject: [PATCH 1/5] add bindPopup and other related methods to the Marker class --- js/ui/marker.js | 88 +++++++++++++++++++++++++++++++++++++++++++++++-- 1 file changed, 86 insertions(+), 2 deletions(-) diff --git a/js/ui/marker.js b/js/ui/marker.js index 6a6e34510e5..991dd6eea95 100644 --- a/js/ui/marker.js +++ b/js/ui/marker.js @@ -4,8 +4,11 @@ module.exports = Marker; var DOM = require('../util/dom'); +var util = require('../util/util'); +var Evented = require('../util/evented'); var LngLat = require('../geo/lng_lat'); var Point = require('point-geometry'); +var Popup = require('./popup'); /** * Creates a marker component @@ -30,7 +33,7 @@ function Marker(element, options) { this._update = this._update.bind(this); } -Marker.prototype = { +Marker.prototype = util.inherit(Evented, { /** * Attaches the marker to a map * @param {Map} map @@ -59,6 +62,7 @@ Marker.prototype = { } var parent = this._el.parentNode; if (parent) parent.removeChild(this._el); + if (this._popup) this._closePopup(); return this; }, @@ -77,6 +81,7 @@ Marker.prototype = { */ setLngLat: function(lnglat) { this._lngLat = LngLat.convert(lnglat); + if (this._popup) this._popup.setLngLat(this._lngLat); this._update(); return this; }, @@ -85,9 +90,88 @@ Marker.prototype = { return this._el; }, + /** + * Binds a Popup to the Marker + * @param {HTMLElement|String|Popup} content the DOM content to appear in the popup, or + * an instance of the Popup class + * @param {Object} [options] options for the Popup class + * @param {boolean} [options.closeButton=true] If `true`, a close button will appear in the + * top right corner of the popup. + * @param {boolean} [options.closeOnClick=true] If `true`, the popup will closed when the + * map is clicked. + * @param {string} options.anchor - A string indicating the popup's location relative to + * the coordinate set via [Popup#setLngLat](#Popup#setLngLat). + * Options are `'top'`, `'bottom'`, `'left'`, `'right'`, `'top-left'`, + * `'top-right'`, `'bottom-left'`, and `'bottom-right'`. + * @returns {Marker} `this` + */ + + bindPopup: function(content, options){ + if (content instanceof Popup) { + this._popup = content; + } else { + if (!this._popup || options) { + this._popup = new Popup(options); + } + content instanceof HTMLElement ? this._popup.setDOMContent(content) : this._popup.setHTML(content); + } + + if (this._popup && this._lngLat) this._popup.setLngLat(this._lngLat); + + if (!this._popupHandlersAdded) { + this.getElement().addEventListener('click', this._openPopup.bind(this)); + this._popupHandlersAdded = true; + } + return this; + }, + + /** + * Opens or closes the bound popup, depending on the current state + * @returns {Marker} `this` + */ + togglePopup: function(){ + if (this._popup) { + if (this._popup._map){ + this._closePopup(); + } else { + this._openPopup(); + } + } + }, + + /** + * Returns the Popup instance that is bound to the Marker + * @returns {Popup} popup + */ + getPopup: function(){ + if (this._popup) { + return this._popup; + } + }, + + _openPopup: function(e) { + // prevent event from bubbling up to the map canvas + // e.stopPropagation(); + if (!this._popup || !this._map) return; + + if (!this._popup._map) { + this._popup.addTo(this._map); + } + + return this; + }, + + _closePopup: function(){ + if (this._popup) { + this._popup.remove(); + } + + return this; + }, + _update: function() { if (!this._map) return; var pos = this._map.project(this._lngLat)._add(this._offset); DOM.setTransform(this._el, 'translate(' + pos.x + 'px,' + pos.y + 'px)'); } -}; +}); From 12b3329bf7571b080f368473600975f65bc0cf58 Mon Sep 17 00:00:00 2001 From: Molly Lloyd Date: Tue, 23 Aug 2016 15:08:39 -0700 Subject: [PATCH 2/5] add DOM tests for Marker --- js/ui/marker.js | 7 ++- js/util/dom.js | 9 ++-- package.json | 4 +- test/js/ui/marker.test.js | 91 +++++++++++++++++++++++++++++++++++++++ 4 files changed, 101 insertions(+), 10 deletions(-) create mode 100644 test/js/ui/marker.test.js diff --git a/js/ui/marker.js b/js/ui/marker.js index 991dd6eea95..3dbc46f5ae7 100644 --- a/js/ui/marker.js +++ b/js/ui/marker.js @@ -5,7 +5,6 @@ module.exports = Marker; var DOM = require('../util/dom'); var util = require('../util/util'); -var Evented = require('../util/evented'); var LngLat = require('../geo/lng_lat'); var Point = require('point-geometry'); var Popup = require('./popup'); @@ -33,7 +32,7 @@ function Marker(element, options) { this._update = this._update.bind(this); } -Marker.prototype = util.inherit(Evented, { +Marker.prototype = { /** * Attaches the marker to a map * @param {Map} map @@ -151,7 +150,7 @@ Marker.prototype = util.inherit(Evented, { _openPopup: function(e) { // prevent event from bubbling up to the map canvas - // e.stopPropagation(); + e.stopPropagation(); if (!this._popup || !this._map) return; if (!this._popup._map) { @@ -174,4 +173,4 @@ Marker.prototype = util.inherit(Evented, { var pos = this._map.project(this._lngLat)._add(this._offset); DOM.setTransform(this._el, 'translate(' + pos.x + 'px,' + pos.y + 'px)'); } -}); +}; diff --git a/js/util/dom.js b/js/util/dom.js index 6ad303b1d4e..f05e47de5d9 100644 --- a/js/util/dom.js +++ b/js/util/dom.js @@ -2,12 +2,15 @@ exports.create = function (tagName, className, container) { return { - offsetWidth: container.offsetWidth, - offsetHeight: container.offsetHeight, + offsetWidth: container ? container.offsetWidth : null, + offsetHeight: container ? container.offsetHeight : null, remove: function () {}, addEventListener: function() {}, classList: { add: function () {} - } + }, + appendChild: function () {} }; }; + +exports.setTransform = function() {}; diff --git a/package.json b/package.json index 4bc6094db0f..7a19b2a4d3b 100644 --- a/package.json +++ b/package.json @@ -58,6 +58,7 @@ "handlebars": "4.0.5", "highlight.js": "9.3.0", "istanbul": "^0.4.2", + "jsdom": "^9.4.2", "json-loader": "^0.5.4", "lodash": "^4.13.1", "mapbox-gl-test-suite": "mapbox/mapbox-gl-test-suite#3e36b193a0c442a3fd863119f101afa6db97b32d", @@ -93,15 +94,12 @@ "build-token": "browserify debug/access-token.js --debug --transform envify > debug/access-token-generated.js", "watch-bench": "node bench/download-data.js && watchify bench/index.js --plugin [minifyify --no-map] --transform [babelify --presets react] --transform unassertify --transform envify --outfile bench/index-generated.js --verbose", "start-server": "st --no-cache --localhost --port 9966 --index index.html .", - "start": "run-p build-token watch-dev watch-bench start-server", "start-debug": "run-p build-token watch-dev start-server", "start-bench": "run-p build-token watch-bench start-server", - "build-docs": "documentation build --github --format html --config documentation.yml --theme ./docs/_theme --output docs/api/", "build": "npm run build-docs # invoked by publisher when publishing docs on the mb-pages branch", "start-docs": "npm run build-min && npm run build-docs && jekyll serve --watch", - "lint": "eslint --ignore-path .gitignore js test bench docs/_posts/examples/*.html", "open-changed-examples": "git diff --name-only mb-pages HEAD -- docs/_posts/examples/*.html | awk '{print \"http://127.0.0.1:4000/mapbox-gl-js/example/\" substr($0,33,length($0)-37)}' | xargs open", "test-suite": "node test/render.test.js && node test/query.test.js", diff --git a/test/js/ui/marker.test.js b/test/js/ui/marker.test.js new file mode 100644 index 00000000000..1bd1c27c490 --- /dev/null +++ b/test/js/ui/marker.test.js @@ -0,0 +1,91 @@ +'use strict'; + +var test = require('tap').test; +var jsdom = require('jsdom'); + +var extend = require('../../../js/util/util').extend; +var Map = require('../../../js/ui/map'); +var Marker = require('../../../js/ui/marker'); +var Popup = require('../../../js/ui/popup'); + +function prepareDOM(html) { + html = html || '
'; + if (typeof document !== 'undefined') { + return; + } + global.document = jsdom.jsdom(html); + global.window = global.document.defaultView; + global.navigator = { + userAgent: 'JSDOM' + }; + global.HTMLElement = global.window.HTMLElement; + +} + +function createMap(options, callback) { + var map = new Map(extend({ + container: 'map', + attributionControl: false, + trackResize: true, + style: { + "version": 8, + "sources": {}, + "layers": [] + } + }, options)); + + if (callback) map.on('load', function () { + callback(null, map); + }); + + return map; +} + + + +test('Marker', function (t) { + t.test('constructor', function (t) { + prepareDOM(); + var el = document.createElement('div'); + var marker = new Marker(el); + t.ok(marker.getElement(), 'marker element is created'); + t.end(); + }); + + t.test('marker is added to map', function (t) { + prepareDOM(); + var map = createMap(); + var el = document.createElement('div'); + + map.on('load', function () { + var marker = new Marker(el).setLngLat([-77.01866, 38.888]); + t.ok(marker.addTo(map) instanceof Marker, 'marker.addTo(map) returns Marker instance'); + t.ok(marker._map, 'marker instance is bound to map instance'); + t.end(); + }); + + + }); + + t.test('popups can be bound to marker instance', function (t) { + prepareDOM(); + var map = createMap(); + var el = document.createElement('div'); + var popup = new Popup(); + var marker = new Marker(el).setLngLat([-77.01866, 38.888]).addTo(map); + marker.bindPopup(popup); + t.ok(marker.getPopup() instanceof Popup, 'popup created with Popup instance'); + + marker.bindPopup('

pop

'); + t.ok(marker.getPopup() instanceof Popup, 'popup created with HTML string'); + + el.text = 'pop pop'; + marker.bindPopup(el); + t.ok(marker.getPopup() instanceof Popup, 'popup created with HTMLElement'); + + t.end(); + }); + + t.end(); +}); + From fe2f6da829fb4c635171b8254b3203331c016c16 Mon Sep 17 00:00:00 2001 From: Molly Lloyd Date: Tue, 23 Aug 2016 15:55:15 -0700 Subject: [PATCH 3/5] add unbindPopup method to Marker with tests, add bindPopup to debug/markers.html --- debug/markers.html | 7 ++++--- js/ui/marker.js | 13 +++++++++++++ package.json | 3 +++ test/js/ui/marker.test.js | 14 ++++++++++++++ 4 files changed, 34 insertions(+), 3 deletions(-) diff --git a/debug/markers.html b/debug/markers.html index 52bbe38ab39..7271b1d0a80 100644 --- a/debug/markers.html +++ b/debug/markers.html @@ -37,7 +37,7 @@ hash: true }); -function addRandomMarker() { +function addRandomMarker(i) { var bounds = map.getBounds(); var s = bounds.getSouth(); var n = bounds.getNorth(); @@ -47,13 +47,14 @@ var lng = w + (e - w) * Math.random(); var lat = s + (n - s) * Math.random(); + var popupHtml = "

hi html

"; var marker = new mapboxgl.Marker() .setLngLat([lng, lat]) + .bindPopup(popupHtml) .addTo(map); marker.getElement().onclick = function(e) { - alert('Hello world'); - e.stopPropagation(); + alert('clicked me'); }; } diff --git a/js/ui/marker.js b/js/ui/marker.js index 3dbc46f5ae7..c3908e7a36e 100644 --- a/js/ui/marker.js +++ b/js/ui/marker.js @@ -148,6 +148,19 @@ Marker.prototype = { } }, + /** + * Unbinds a Popup from the Marker instance + * Returns the Popup instance that was bound to the Marker + * @returns {Popup} popup + */ + unbindPopup: function(){ + this._closePopup(); + var popup = this._popup; + delete this._popupHandlersAdded; + delete this._popup; + return popup; + }, + _openPopup: function(e) { // prevent event from bubbling up to the map canvas e.stopPropagation(); diff --git a/package.json b/package.json index 7a19b2a4d3b..3e988f01578 100644 --- a/package.json +++ b/package.json @@ -94,12 +94,15 @@ "build-token": "browserify debug/access-token.js --debug --transform envify > debug/access-token-generated.js", "watch-bench": "node bench/download-data.js && watchify bench/index.js --plugin [minifyify --no-map] --transform [babelify --presets react] --transform unassertify --transform envify --outfile bench/index-generated.js --verbose", "start-server": "st --no-cache --localhost --port 9966 --index index.html .", + "start": "run-p build-token watch-dev watch-bench start-server", "start-debug": "run-p build-token watch-dev start-server", "start-bench": "run-p build-token watch-bench start-server", + "build-docs": "documentation build --github --format html --config documentation.yml --theme ./docs/_theme --output docs/api/", "build": "npm run build-docs # invoked by publisher when publishing docs on the mb-pages branch", "start-docs": "npm run build-min && npm run build-docs && jekyll serve --watch", + "lint": "eslint --ignore-path .gitignore js test bench docs/_posts/examples/*.html", "open-changed-examples": "git diff --name-only mb-pages HEAD -- docs/_posts/examples/*.html | awk '{print \"http://127.0.0.1:4000/mapbox-gl-js/example/\" substr($0,33,length($0)-37)}' | xargs open", "test-suite": "node test/render.test.js && node test/query.test.js", diff --git a/test/js/ui/marker.test.js b/test/js/ui/marker.test.js index 1bd1c27c490..c9632ccbad7 100644 --- a/test/js/ui/marker.test.js +++ b/test/js/ui/marker.test.js @@ -75,9 +75,11 @@ test('Marker', function (t) { var marker = new Marker(el).setLngLat([-77.01866, 38.888]).addTo(map); marker.bindPopup(popup); t.ok(marker.getPopup() instanceof Popup, 'popup created with Popup instance'); + marker.unbindPopup(); marker.bindPopup('

pop

'); t.ok(marker.getPopup() instanceof Popup, 'popup created with HTML string'); + marker.unbindPopup(); el.text = 'pop pop'; marker.bindPopup(el); @@ -86,6 +88,18 @@ test('Marker', function (t) { t.end(); }); + t.test('popups can be unbound from a marker instance', function (t) { + prepareDOM(); + var map = createMap(); + var el = document.createElement('div'); + var marker = new Marker(el).setLngLat([-77.01866, 38.888]).addTo(map); + marker.bindPopup('

pop

'); + t.ok(marker.getPopup() instanceof Popup); + t.deepEqual(marker.getPopup(), marker.unbindPopup(), 'Marker.unbindPopup returns previously bound popup'); + t.ok(!marker.getPopup(), 'Marker.unbindPopup successfully removes Popup instance from Marker instance'); + t.end(); + }); + t.end(); }); From c3f4c3d9c08e5935e6363c2e77dacd223574010d Mon Sep 17 00:00:00 2001 From: Molly Lloyd Date: Wed, 24 Aug 2016 15:22:46 -0700 Subject: [PATCH 4/5] refactor to conform to setter/getter conventions --- js/ui/marker.js | 83 +++++++++++++++------------------------ package.json | 4 +- test/js/ui/marker.test.js | 53 +++++++++---------------- 3 files changed, 51 insertions(+), 89 deletions(-) diff --git a/js/ui/marker.js b/js/ui/marker.js index c3908e7a36e..d3915f81baf 100644 --- a/js/ui/marker.js +++ b/js/ui/marker.js @@ -38,7 +38,7 @@ Marker.prototype = { * @param {Map} map * @returns {Marker} `this` */ - addTo: function(map) { + addTo: function (map) { this.remove(); this._map = map; map.getCanvasContainer().appendChild(this._el); @@ -54,7 +54,7 @@ Marker.prototype = { * marker.remove(); * @returns {Marker} `this` */ - remove: function() { + remove: function () { if (this._map) { this._map.off('move', this._update); this._map = null; @@ -69,7 +69,7 @@ Marker.prototype = { * Get the marker's geographical location * @returns {LngLat} */ - getLngLat: function() { + getLngLat: function () { return this._lngLat; }, @@ -78,43 +78,35 @@ Marker.prototype = { * @param {LngLat} lnglat * @returns {Marker} `this` */ - setLngLat: function(lnglat) { + setLngLat: function (lnglat) { this._lngLat = LngLat.convert(lnglat); if (this._popup) this._popup.setLngLat(this._lngLat); this._update(); return this; }, - getElement: function() { + getElement: function () { return this._el; }, /** * Binds a Popup to the Marker - * @param {HTMLElement|String|Popup} content the DOM content to appear in the popup, or - * an instance of the Popup class - * @param {Object} [options] options for the Popup class - * @param {boolean} [options.closeButton=true] If `true`, a close button will appear in the - * top right corner of the popup. - * @param {boolean} [options.closeOnClick=true] If `true`, the popup will closed when the - * map is clicked. - * @param {string} options.anchor - A string indicating the popup's location relative to - * the coordinate set via [Popup#setLngLat](#Popup#setLngLat). - * Options are `'top'`, `'bottom'`, `'left'`, `'right'`, `'top-left'`, - * `'top-right'`, `'bottom-left'`, and `'bottom-right'`. + * @param {Popup=} popup an instance of the `Popup` class. If undefined or null, any popup + * set on this `Marker` instance is unset * @returns {Marker} `this` */ - bindPopup: function(content, options){ - if (content instanceof Popup) { - this._popup = content; + setPopup: function (popup) { + if (popup == null) { + this._closePopup(); + delete this._popupHandlersAdded; + delete this._popup; + } else if (popup instanceof Popup) { + this._popup = popup; } else { - if (!this._popup || options) { - this._popup = new Popup(options); - } - content instanceof HTMLElement ? this._popup.setDOMContent(content) : this._popup.setHTML(content); + util.warnOnce('Marker.setPopup only accepts an instance of the Popup class as an argument. If no argument is provided, the popup is unset from this Marker instance'); } - + if (this._popup && this._lngLat) this._popup.setLngLat(this._lngLat); if (!this._popupHandlersAdded) { @@ -124,13 +116,21 @@ Marker.prototype = { return this; }, + /** + * Returns the Popup instance that is bound to the Marker + * @returns {Popup} popup + */ + getPopup: function () { + return this._popup; + }, + /** * Opens or closes the bound popup, depending on the current state * @returns {Marker} `this` */ - togglePopup: function(){ + togglePopup: function () { if (this._popup) { - if (this._popup._map){ + if (this._popup._map) { this._closePopup(); } else { this._openPopup(); @@ -138,32 +138,10 @@ Marker.prototype = { } }, - /** - * Returns the Popup instance that is bound to the Marker - * @returns {Popup} popup - */ - getPopup: function(){ - if (this._popup) { - return this._popup; - } - }, - - /** - * Unbinds a Popup from the Marker instance - * Returns the Popup instance that was bound to the Marker - * @returns {Popup} popup - */ - unbindPopup: function(){ - this._closePopup(); - var popup = this._popup; - delete this._popupHandlersAdded; - delete this._popup; - return popup; - }, - - _openPopup: function(e) { + _openPopup: function (e) { // prevent event from bubbling up to the map canvas e.stopPropagation(); + if (!this._popup || !this._map) return; if (!this._popup._map) { @@ -173,7 +151,7 @@ Marker.prototype = { return this; }, - _closePopup: function(){ + _closePopup: function () { if (this._popup) { this._popup.remove(); } @@ -181,9 +159,10 @@ Marker.prototype = { return this; }, - _update: function() { + _update: function () { if (!this._map) return; var pos = this._map.project(this._lngLat)._add(this._offset); DOM.setTransform(this._el, 'translate(' + pos.x + 'px,' + pos.y + 'px)'); } }; + diff --git a/package.json b/package.json index 3e988f01578..720582aa100 100644 --- a/package.json +++ b/package.json @@ -59,6 +59,7 @@ "highlight.js": "9.3.0", "istanbul": "^0.4.2", "jsdom": "^9.4.2", + "jsdom-global": "^2.1.0", "json-loader": "^0.5.4", "lodash": "^4.13.1", "mapbox-gl-test-suite": "mapbox/mapbox-gl-test-suite#3e36b193a0c442a3fd863119f101afa6db97b32d", @@ -94,15 +95,12 @@ "build-token": "browserify debug/access-token.js --debug --transform envify > debug/access-token-generated.js", "watch-bench": "node bench/download-data.js && watchify bench/index.js --plugin [minifyify --no-map] --transform [babelify --presets react] --transform unassertify --transform envify --outfile bench/index-generated.js --verbose", "start-server": "st --no-cache --localhost --port 9966 --index index.html .", - "start": "run-p build-token watch-dev watch-bench start-server", "start-debug": "run-p build-token watch-dev start-server", "start-bench": "run-p build-token watch-bench start-server", - "build-docs": "documentation build --github --format html --config documentation.yml --theme ./docs/_theme --output docs/api/", "build": "npm run build-docs # invoked by publisher when publishing docs on the mb-pages branch", "start-docs": "npm run build-min && npm run build-docs && jekyll serve --watch", - "lint": "eslint --ignore-path .gitignore js test bench docs/_posts/examples/*.html", "open-changed-examples": "git diff --name-only mb-pages HEAD -- docs/_posts/examples/*.html | awk '{print \"http://127.0.0.1:4000/mapbox-gl-js/example/\" substr($0,33,length($0)-37)}' | xargs open", "test-suite": "node test/render.test.js && node test/query.test.js", diff --git a/test/js/ui/marker.test.js b/test/js/ui/marker.test.js index c9632ccbad7..bf9d8cd91d8 100644 --- a/test/js/ui/marker.test.js +++ b/test/js/ui/marker.test.js @@ -1,25 +1,19 @@ 'use strict'; var test = require('tap').test; -var jsdom = require('jsdom'); +var jsdomGlobal = require('jsdom-global'); var extend = require('../../../js/util/util').extend; var Map = require('../../../js/ui/map'); var Marker = require('../../../js/ui/marker'); var Popup = require('../../../js/ui/popup'); -function prepareDOM(html) { - html = html || '
'; - if (typeof document !== 'undefined') { - return; - } - global.document = jsdom.jsdom(html); - global.window = global.document.defaultView; - global.navigator = { - userAgent: 'JSDOM' - }; - global.HTMLElement = global.window.HTMLElement; - +function prepareDOM() { + var cleanup = jsdomGlobal(); + var mapdiv = document.createElement('div'); + mapdiv.id = "map"; + document.body.appendChild(mapdiv); + return cleanup; } function createMap(options, callback) { @@ -45,59 +39,50 @@ function createMap(options, callback) { test('Marker', function (t) { t.test('constructor', function (t) { - prepareDOM(); + var cleanup = prepareDOM(); var el = document.createElement('div'); var marker = new Marker(el); t.ok(marker.getElement(), 'marker element is created'); + cleanup(); t.end(); }); t.test('marker is added to map', function (t) { - prepareDOM(); + var cleanup = prepareDOM(); var map = createMap(); var el = document.createElement('div'); - map.on('load', function () { var marker = new Marker(el).setLngLat([-77.01866, 38.888]); t.ok(marker.addTo(map) instanceof Marker, 'marker.addTo(map) returns Marker instance'); t.ok(marker._map, 'marker instance is bound to map instance'); + cleanup(); t.end(); }); - - }); t.test('popups can be bound to marker instance', function (t) { - prepareDOM(); + var cleanup = prepareDOM(); var map = createMap(); var el = document.createElement('div'); var popup = new Popup(); var marker = new Marker(el).setLngLat([-77.01866, 38.888]).addTo(map); - marker.bindPopup(popup); + marker.setPopup(popup); t.ok(marker.getPopup() instanceof Popup, 'popup created with Popup instance'); - marker.unbindPopup(); - - marker.bindPopup('

pop

'); - t.ok(marker.getPopup() instanceof Popup, 'popup created with HTML string'); - marker.unbindPopup(); - - el.text = 'pop pop'; - marker.bindPopup(el); - t.ok(marker.getPopup() instanceof Popup, 'popup created with HTMLElement'); - + cleanup(); t.end(); }); t.test('popups can be unbound from a marker instance', function (t) { - prepareDOM(); + var cleanup = prepareDOM(); var map = createMap(); var el = document.createElement('div'); var marker = new Marker(el).setLngLat([-77.01866, 38.888]).addTo(map); - marker.bindPopup('

pop

'); + marker.setPopup(new Popup()); t.ok(marker.getPopup() instanceof Popup); - t.deepEqual(marker.getPopup(), marker.unbindPopup(), 'Marker.unbindPopup returns previously bound popup'); - t.ok(!marker.getPopup(), 'Marker.unbindPopup successfully removes Popup instance from Marker instance'); + t.ok(marker.setPopup() instanceof Marker, 'passing no argument to Marker.setPopup() is valid'); + t.ok(!marker.getPopup(), 'Calling setPopup with no argument successfully removes Popup instance from Marker instance'); t.end(); + cleanup(); }); t.end(); From 04bc89573cc627a70a795202e9b9443d0faf7aa7 Mon Sep 17 00:00:00 2001 From: Molly Lloyd Date: Wed, 24 Aug 2016 15:37:06 -0700 Subject: [PATCH 5/5] fix markers.html debug page --- debug/markers.html | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/debug/markers.html b/debug/markers.html index 7271b1d0a80..2651054f671 100644 --- a/debug/markers.html +++ b/debug/markers.html @@ -37,7 +37,7 @@ hash: true }); -function addRandomMarker(i) { +function addRandomMarker() { var bounds = map.getBounds(); var s = bounds.getSouth(); var n = bounds.getNorth(); @@ -46,11 +46,11 @@ var lng = w + (e - w) * Math.random(); var lat = s + (n - s) * Math.random(); + var popup = new mapboxgl.Popup().setText('hello hi'); - var popupHtml = "

hi html

"; var marker = new mapboxgl.Marker() .setLngLat([lng, lat]) - .bindPopup(popupHtml) + .setPopup(popup) .addTo(map); marker.getElement().onclick = function(e) { @@ -61,6 +61,7 @@ for (var i = 0; i < 100; i++) addRandomMarker(); map.addControl(new mapboxgl.Navigation()); +