Wie können Sie Leaflet JS Karten testen?

Question

Wie können Sie Leaflet JS Karten testen?

Answer 1

Ich habe wirklich mit dem gleichen Problem zu kämpfen. Hier ist ein Link zu einigen Tests mit der js Test-Bibliothek 'Mokka':

Allerdings stieß ich auf weitere Probleme bei dem Versuch, Flugblatt Art von Fang alle 'L' Funktion zu nennen. Die erste war:

// Create globals so leaflet can load 
GLOBAL.window = {}; 
GLOBAL.document = { 
    documentElement: { 
    style: {} 
    }, 
    getElementsByTagName: function() { return []; }, 
    createElement: function() { return {}; } 
}; 
GLOBAL.navigator = { 
    userAgent: 'nodejs' 
}; 
GLOBAL.L = require('leaflet'); 

Node.js Leaflet error

Nachdem ich mit diesem Thema befasst, ich laufe in ein Problem mit der tatsächlichen:

}(window, document)); 
^

ReferenceError: window is not defined 

ich dieses Problem mit diesem Stück Code behoben Funktionen wie 'L.map (' '). Es scheint, dass die Funktion ein Element mit einer ID benötigt, um korrekt zu funktionieren. Hier

ist der Fehler, den ich für diese Funktion erhalten:

 return (typeof id === 'string' ? document.getElementById(id) : id); 
               ^

TypeError: document.getElementById is not a function 

Ich hoffe, das hilft Ihnen ein wenig, ich sicherlich haben es immer noch nicht herausgefunden.

Answer 2

Ich habe ein bisschen mehr daran gearbeitet, Leaflet zu testen und zu benutzen.

Derzeit verwende ich QUnit, um die Tests auszuführen.

Ich muss es derzeit in einem Browser öffnen, um zu sehen, ob es funktioniert, vielleicht jemand anderes weiß, wie man QUnit über die Befehlszeile ausführen kann.

Bevor ich meine Tests geschrieben und ausgeführt habe, habe ich mir die Leafletjs-Dokumentseite angesehen und angefangen, die verschiedenen js-Objekte mit der Developer Tools-Konsole auf Google Chrome zu erkunden.

Prospekt docs: http://leafletjs.com/reference-1.0.0.html

Beispiel Tests von meiner QUnit tests.js Datei:

QUnit.test("map default options", function(assert) assert.equal(myMap.getCenter().toString(), 
      "LatLng(0, 8.846)", 
      "The map is centered at the ZMT's longitude, and the equator" 
    ); 
    assert.equal(myMap.getZoom(), 
      2, 
      "The default zoom is set to 2" 
    ); 
}); 

QUnit.test("baseLayer layerGroup", function(assert) { 
    assert.equal(baseLayer.getLayers().length, 
      1, 
      "There is just one layer in 'baseLayer' layerGroup" 
    ); 
    assert.equal(baseLayer.getLayers()[0]._url, 
      "http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", 
      "The url of the layer leads to the correct openstreet map tiles" 
    ); 

    assert.equal(baseLayer.getLayers()[0].options.attribution, 
      '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>', 
      "The attribution for the layer is correct" 
    ); 
    assert.equal(baseLayer.getLayers()[0].options.minZoom, 
      0, 
      "The default minimum zoom is set to 0" 
    ); 
    assert.equal(baseLayer.getLayers()[0].options.maxZoom, 
      19, 
      "The default maximum zoom is set to 19" 
    ); 
});