0

I've got this simple mapModule that works just fine:

mapModule = function(canvasId){

    var _canvas,
        _gmap,
        _geocoder,
        _markers = [],
        _mapOpts = {
            center: new google.maps.LatLng(51.919438, 19.14513599999998),
            zoom: 6
        };

    _init();

    //private
    function _init(){
        _canvas = document.getElementById(canvasId);
        _gmap = new google.maps.Map(_canvas, _mapOpts);

        //debug/convenience
        google.maps.event.addListener(_gmap, 'click', function(event) {
            console.log(event.latLng);
        });

    }

    function _checkMarker(marker){
        if(typeof marker != 'object' || marker === null)
            throw new Error('Marker is not an object')
        if(!marker.label)
            throw new Error("Marker has no label.")
    }

    function _rememberMarker(m){
        if(!m){
            throw new Error("Failed to add marker");
        }else{
            _markers.push(m);
        }
    }

    //public
    var addMarkerByLatLen = function(m){
            _checkMarker(m);

            if(isNaN(m.lat) || isNaN(m.len))
                throw new Error("Invalid position. Lat: "+m.lat+" Len:"+m.len)

            var marker = new google.maps.Marker({
                position: new google.maps.LatLng(m.lat,m.len),
                map: _gmap,
                title: m.label
            });

            _rememberMarker(marker);
        },
        addByLatLen = function(markersArr){
            for(var i = 0; i < markersArr.length; i++){
                try{
                    addMarkerByLatLen(markersArr[i]);
                }catch(err){
                    console.log(err)
                }
            }
        },
        updateBounds = function(){
            var bounds = new google.maps.LatLngBounds();
            for(var i = 0; i < _markers.length; i++){
                bounds.extend(_markers[i].getPosition())
            }
            _gmap.fitBounds(bounds);

            if(_gmap.getZoom()> 15){
                _gmap.setZoom(15);
            }
        };

    return {
        getMap: function(){return _gmap},
        getMarkers: function(){return _markers},
        addMarkerByLatLen: addMarkerByLatLen,
        addByLatLen: addByLatLen,
        updateBounds: updateBounds
    }
}

but I have a Jasmine 2.0 test that fails:

describe("mapModule", function(){

    var mm, $canvas;

    beforeEach(function(){
        $canvas = $('<div>').attr("id", "map-canvas");
        $(document.body).append($canvas);
        mm = mapModule("map-canvas");
    });

    afterEach(function(){
        $canvas.remove();
        $canvas = null;
        mm = null;
    })

    it("should encompass all added markers", function(done){
        var mapModule = mm;

        var idleListener = google.maps.event.addListener(mapModule.getMap(), 'idle', function() {

            idleListener.remove(); //don't fire again when bounds are updated
            mapModule.addByLatLen([
                {label:"My marker", lat: 40, len: 20},
                {label:"My marker", lat: 42, len: 23},
                {label:"My marker2", lat: 47, len: 19},
                {label:"My marker3", lat: 59, len: 12}
            ]);

            google.maps.event.addListener(mapModule.getMap(), 'bounds_changed', function() {
                console.log("bounds_changed", mapModule.getMap().getBounds().toString())
                expect(typeof mapModule.getMap().getBounds()).toBe("object");
                expect(isNaN(mapModule.getMap().getBounds().pa.j)).toBe(false);
                expect(mapModule.getMap().getBounds().pa.j < 12).toBe(true);
                expect(mapModule.getMap().getBounds().pa.k > 23).toBe(true);
                expect(mapModule.getMap().getBounds().xa.j < 40).toBe(true);
                expect(mapModule.getMap().getBounds().xa.k > 59).toBe(true);
                done();
            })

            mapModule.updateBounds();
        });
    })
});

I use the module within my application: I add the exact same markers as in the test, call mm.updateBounds(), and the map boundaries include the added markers.

But the test fails:

Expected false to be true.

outputing mm.getMap().getBounds().toString() revealed that the bounds are broken. They should be:

"((34.865862155014426, -3.857421875), (62.17459747407728, 38.857421875))"

while the test receives:

"((50.44192744802642, -180), (50.44192744802642, 180))"

I know that (-180, 180) means that the map is zoomed out completely, but I still don't know what's wrong with the test (or the code).

The strangest thing is that now I can see the "bounds_changed is fired twice,

Another issue, that Appeared when I introduced "bounds_changed" listener is that apparently there's:

TypeError: currentSpec is null

This happens when the done() once function is executed;

I'm new to both Jasmine and google API so any input would be appreciated.

This Question is not a duplicate of this because the answer to the allegedly duplicated question is already incorporated in the jasmine test code like this:

google.maps.event.addListener(mapModule.getMap(), 'bounds_changed', function() {

besides the problem is not that getBounds() is empty, but that it's broken.

Community
  • 1
  • 1
Piotr Ma'niak
  • 698
  • 8
  • 17
  • 2
    This happens when you call `getBounds()` of map too quickly after map creation. You have to wait for event `bounds_changed` and than call `getBounds()`. – Anto Jurković Jul 08 '14 at 15:18
  • 1
    You really don't want to use the internal properties of the google.maps.LatLngBounds and LatLng objects (pa, xa, j, k), those can change with each new release and will change. – geocodezip Jul 09 '14 at 06:37
  • Thanks Anto, sounds like the solution! @geocodezip - thanks, I will use getSouthWest/NorthEast once the code is less of a polygon :) – Piotr Ma'niak Jul 09 '14 at 08:21
  • I'm affraid that Anto's suggestion is just a good replacement for the timeout(), but still doesn't fix these strange bounds: ((50.44192744802642, -180), (50.44192744802642, 180)), I updated the question with a new version of test, but the problem remains the same :( – Piotr Ma'niak Jul 09 '14 at 09:06

0 Answers0