jest.mock('mapbox-gl', () => ({
Map: jest.fn()
}));
import * as React from 'react';
import ReactMapboxGl, { FitBounds } from '../map';
import { mount } from 'enzyme';
import { getMapMock } from '../jest/util';
let mockfitBounds = jest.fn();
let mockon = jest.fn();
const getMock = (override = {}) =>
getMapMock({
fitBounds: mockfitBounds,
on: mockon,
remove: jest.fn(),
getCenter: jest.fn().mockReturnValue({ lat: 2, lng: 1 }),
getZoom: jest.fn(),
getBearing: jest.fn(),
getPitch: jest.fn(),
flyTo: jest.fn(),
...override
});
describe('Map', () => {
// tslint:disable-next-line:no-any
beforeEach(() => {
mockfitBounds = jest.fn();
mockon = jest.fn();
});
it('Should render the map correctly', () => {
const MapboxMap = ReactMapboxGl({
accessToken: '',
mapInstance: getMock() as any
});
mount();
});
it('Should call fitBounds with the right parameters', () => {
const fitBoundsValues: FitBounds = [[0, 1], [2, 3]];
const fitBoundsOptions = { linear: true };
const MapboxMap = ReactMapboxGl({
accessToken: '',
mapInstance: getMock() as any
});
mount(
);
expect(mockfitBounds).toBeCalledWith(fitBoundsValues, fitBoundsOptions, {
fitboundUpdate: true
});
});
it('Should update fitBounds if fitBoundsOptions changes', () => {
const flyTo = jest.fn();
const fitBoundsValues: FitBounds = [[0, 1], [2, 3]];
const fitBoundsOptions = { offset: [150, 0] as [number, number] };
const newFitBoundsOptions = { offset: [0, 0] };
const MapboxMap = ReactMapboxGl({
accessToken: '',
mapInstance: getMock({
flyTo,
fitBounds: mockfitBounds
}) as any
});
const wrapper = mount(
);
wrapper.setProps({ fitBoundsOptions: newFitBoundsOptions });
expect(mockfitBounds.mock.calls[1][1]).toBe(newFitBoundsOptions);
});
it.skip('Should calc the center from fitbounds if center is not given', () => {
const fitBoundsValues: FitBounds = [[0, 3], [2, 9]];
const mockMap = getMock() as any;
const MapboxMap = ReactMapboxGl({ accessToken: '', mapInstance: mockMap });
mount();
// tslint:disable-next-line:no-any
const lastCall: any = mockMap.mock.calls[mockMap.mock.calls.length - 1];
expect(lastCall[0].center).toEqual([1, 6]);
});
it('Should listen onStyleLoad event', () => {
const MapboxMap = ReactMapboxGl({
accessToken: '',
mapInstance: getMock() as any
});
mount();
expect(mockon).toBeCalledWith('load', jasmine.any(Function));
});
it('Should update the map center position', () => {
const flyTo = jest.fn();
const center = [3, 4];
const MapboxMap = ReactMapboxGl({
accessToken: '',
mapInstance: getMock({
flyTo
}) as any
});
const wrapper = mount();
wrapper.setProps({ center });
expect(flyTo.mock.calls[0][0].center).toEqual(center);
});
it('Should update maxBounds', () => {
const flyTo = jest.fn();
const maxBoundsProps = [[1, 0], [0, 1]];
const mockMaxBounds = jest.fn();
const MapboxMap = ReactMapboxGl({
accessToken: '',
mapInstance: getMock({
setMaxBounds: mockMaxBounds,
flyTo
}) as any
});
const wrapper = mount();
wrapper.setProps({ maxBounds: maxBoundsProps });
expect(mockMaxBounds).toBeCalledWith(maxBoundsProps);
});
// Handling zoom prop
it('Should not update zoom when using same reference equality', () => {
const flyTo = jest.fn();
const MapboxMap = ReactMapboxGl({
accessToken: '',
mapInstance: getMock({
flyTo
}) as any
});
const zoom: [number] = [3];
const wrapper = mount();
wrapper.setProps({ zoom });
expect(flyTo).not.toHaveBeenCalled();
});
it('Should update the zoom on broken reference equality', () => {
const flyTo = jest.fn();
const MapboxMap = ReactMapboxGl({
accessToken: '',
mapInstance: getMock({
flyTo
}) as any
});
const wrapper = mount();
wrapper.setProps({ zoom: [1] });
expect(flyTo).toHaveBeenCalled();
});
// Handling bearing prop
it('Should not update bearing when using same reference equality', () => {
const flyTo = jest.fn();
const MapboxMap = ReactMapboxGl({
accessToken: '',
mapInstance: getMock({
flyTo
}) as any
});
const bearing: [number] = [3];
const wrapper = mount();
wrapper.setProps({ bearing });
expect(flyTo).not.toHaveBeenCalled();
});
it('Should update the bearing on broken reference equality', () => {
const flyTo = jest.fn();
const MapboxMap = ReactMapboxGl({
accessToken: '',
mapInstance: getMock({
flyTo
}) as any
});
const wrapper = mount();
wrapper.setProps({ bearing: [1] });
expect(flyTo).toHaveBeenCalled();
});
// Handling pitch prop
it('Should not update pitch when using same reference equality', () => {
const flyTo = jest.fn();
const MapboxMap = ReactMapboxGl({
accessToken: '',
mapInstance: getMock({
flyTo
}) as any
});
const pitch: [number] = [3];
const wrapper = mount();
wrapper.setProps({ pitch });
expect(flyTo).not.toHaveBeenCalled();
});
it('Should update the pitch on broken reference equality', () => {
const flyTo = jest.fn();
const MapboxMap = ReactMapboxGl({
accessToken: '',
mapInstance: getMock({
flyTo
}) as any
});
const wrapper = mount();
wrapper.setProps({ pitch: [1] });
expect(flyTo).toHaveBeenCalled();
});
it('Should pass animation options and flyTo options', () => {
const flyTo = jest.fn();
const MapboxMap = ReactMapboxGl({
accessToken: '',
mapInstance: getMock({
flyTo
}) as any
});
const zoom: [number] = [3];
const flyToOptions = {
speed: 0.1,
curve: 0.9
};
const animationOptions = {
offset: [20, 60]
};
const wrapper = mount(
);
wrapper.setProps({ zoom: [1] });
expect(flyTo.mock.calls[0][0]).toEqual({
...flyToOptions,
...animationOptions,
bearing: undefined,
center: { lat: 2, lng: 1 },
pitch: undefined,
zoom: 1
});
});
});