Skip to content

Commit f35fa0b

Browse files
tstirrat15tstirrat15
committed
Inject map in tests to fix tests
1 parent 42e5dd5 commit f35fa0b

File tree

1 file changed

+110
-94
lines changed

1 file changed

+110
-94
lines changed

‎src/__tests__/map.test.tsx‎

Lines changed: 110 additions & 94 deletions
Original file line numberDiff line numberDiff line change
@@ -1,44 +1,51 @@
1-
let mockfitBounds = jest.fn();
2-
let mockon = jest.fn();
3-
4-
const mockMap = jest.fn(() => ({
5-
fitBounds: mockfitBounds,
6-
on: mockon,
7-
getCenter: jest.fn()
8-
}));
9-
101
jest.mock('mapbox-gl', () => ({
11-
Map: mockMap
2+
Map: jest.fn()
123
}));
134

145
import * as React from 'react';
156
import ReactMapboxGl, { FitBounds } from '../map';
167
import { mount } from 'enzyme';
8+
import { getMapMock } from '../jest/util';
9+
10+
let mockfitBounds = jest.fn();
11+
let mockon = jest.fn();
1712

13+
const getMock = (override = {}) =>
14+
getMapMock({
15+
fitBounds: mockfitBounds,
16+
on: mockon,
17+
remove: jest.fn(),
18+
getCenter: jest.fn().mockReturnValue({ lat: 2, lng: 1 }),
19+
getZoom: jest.fn(),
20+
getBearing: jest.fn(),
21+
getPitch: jest.fn(),
22+
flyTo: jest.fn(),
23+
...override
24+
});
1825
describe('Map', () => {
1926
// tslint:disable-next-line:no-any
20-
let mapState: any;
2127
beforeEach(() => {
2228
mockfitBounds = jest.fn();
2329
mockon = jest.fn();
24-
25-
mapState = {
26-
getCenter: jest.fn(() => ({ lng: 1, lat: 2 })),
27-
getZoom: jest.fn(() => 2),
28-
getBearing: jest.fn(),
29-
getPitch: jest.fn()
30-
};
3130
});
3231

3332
it('Should render the map correctly', () => {
34-
const MapboxMap = ReactMapboxGl({ accessToken: '', injectCSS: false });
33+
const MapboxMap = ReactMapboxGl({
34+
accessToken: '',
35+
injectCSS: false,
36+
mapInstance: getMock() as any
37+
});
3538
mount(<MapboxMap style="" />);
3639
});
3740

3841
it('Should call fitBounds with the right parameters', () => {
3942
const fitBoundsValues: FitBounds = [[0, 1], [2, 3]];
4043
const fitBoundsOptions = { linear: true };
41-
const MapboxMap = ReactMapboxGl({ accessToken: '', injectCSS: false });
44+
const MapboxMap = ReactMapboxGl({
45+
accessToken: '',
46+
injectCSS: false,
47+
mapInstance: getMock() as any
48+
});
4249

4350
mount(
4451
<MapboxMap
@@ -58,7 +65,14 @@ describe('Map', () => {
5865
const fitBoundsValues: FitBounds = [[0, 1], [2, 3]];
5966
const fitBoundsOptions = { offset: [150, 0] as [number, number] };
6067
const newFitBoundsOptions = { offset: [0, 0] };
61-
const MapboxMap = ReactMapboxGl({ accessToken: '', injectCSS: false });
68+
const MapboxMap = ReactMapboxGl({
69+
accessToken: '',
70+
injectCSS: false,
71+
mapInstance: getMock({
72+
flyTo,
73+
fitBounds: mockfitBounds
74+
}) as any
75+
});
6276

6377
const wrapper = mount(
6478
<MapboxMap
@@ -67,13 +81,6 @@ describe('Map', () => {
6781
fitBoundsOptions={fitBoundsOptions}
6882
/>
6983
);
70-
wrapper.setState({
71-
map: {
72-
...mapState,
73-
flyTo,
74-
fitBounds: mockfitBounds
75-
}
76-
});
7784

7885
wrapper.setProps({ fitBoundsOptions: newFitBoundsOptions });
7986

@@ -82,7 +89,12 @@ describe('Map', () => {
8289

8390
it('Should calc the center from fitbounds if center is not given', () => {
8491
const fitBoundsValues: FitBounds = [[0, 3], [2, 9]];
85-
const MapboxMap = ReactMapboxGl({ accessToken: '', injectCSS: false });
92+
const mockMap = getMock() as any;
93+
const MapboxMap = ReactMapboxGl({
94+
accessToken: '',
95+
injectCSS: false,
96+
mapInstance: mockMap
97+
});
8698

8799
mount(<MapboxMap style="" fitBounds={fitBoundsValues} />);
88100

@@ -92,7 +104,11 @@ describe('Map', () => {
92104
});
93105

94106
it('Should listen onStyleLoad event', () => {
95-
const MapboxMap = ReactMapboxGl({ accessToken: '', injectCSS: false });
107+
const MapboxMap = ReactMapboxGl({
108+
accessToken: '',
109+
injectCSS: false,
110+
mapInstance: getMock() as any
111+
});
96112

97113
mount(<MapboxMap style="" onStyleLoad={jest.fn()} />);
98114

@@ -102,17 +118,16 @@ describe('Map', () => {
102118
it('Should update the map center position', () => {
103119
const flyTo = jest.fn();
104120
const center = [3, 4];
105-
const MapboxMap = ReactMapboxGl({ accessToken: '', injectCSS: false });
106-
107-
const wrapper = mount(<MapboxMap style="" center={[1, 2]} />);
108-
109-
wrapper.setState({
110-
map: {
111-
...mapState,
121+
const MapboxMap = ReactMapboxGl({
122+
accessToken: '',
123+
injectCSS: false,
124+
mapInstance: getMock({
112125
flyTo
113-
}
126+
}) as any
114127
});
115128

129+
const wrapper = mount(<MapboxMap style="" center={[1, 2]} />);
130+
116131
wrapper.setProps({ center });
117132

118133
expect(flyTo.mock.calls[0][0].center).toEqual(center);
@@ -123,131 +138,139 @@ describe('Map', () => {
123138
const maxBoundsProps = [[1, 0], [0, 1]];
124139
const mockMaxBounds = jest.fn();
125140

126-
const MapboxMap = ReactMapboxGl({ accessToken: '', injectCSS: false });
127-
const wrapper = mount(<MapboxMap style="" />);
128-
wrapper.setState({
129-
map: {
141+
const MapboxMap = ReactMapboxGl({
142+
accessToken: '',
143+
injectCSS: false,
144+
mapInstance: getMock({
130145
setMaxBounds: mockMaxBounds,
131-
...mapState,
132146
flyTo
133-
}
147+
}) as any
134148
});
149+
150+
const wrapper = mount(<MapboxMap style="" />);
135151
wrapper.setProps({ maxBounds: maxBoundsProps });
136152

137153
expect(mockMaxBounds).toBeCalledWith(maxBoundsProps);
138154
});
139155

140156
// Handling zoom prop
141157
it('Should not update zoom when using same reference equality', () => {
142-
const MapboxMap = ReactMapboxGl({ accessToken: '', injectCSS: false });
143158
const flyTo = jest.fn();
159+
const MapboxMap = ReactMapboxGl({
160+
accessToken: '',
161+
injectCSS: false,
162+
mapInstance: getMock({
163+
flyTo
164+
}) as any
165+
});
166+
144167
const zoom: [number] = [3];
145168

146169
const wrapper = mount(<MapboxMap style="" zoom={zoom} />);
147170

148-
wrapper.setState({
149-
map: {
150-
...mapState,
151-
flyTo
152-
}
153-
});
154171
wrapper.setProps({ zoom });
155172

156173
expect(flyTo).not.toHaveBeenCalled();
157174
});
158175

159176
it('Should update the zoom on broken reference equality', () => {
160177
const flyTo = jest.fn();
161-
const MapboxMap = ReactMapboxGl({ accessToken: '', injectCSS: false });
178+
const MapboxMap = ReactMapboxGl({
179+
accessToken: '',
180+
injectCSS: false,
181+
mapInstance: getMock({
182+
flyTo
183+
}) as any
184+
});
162185

163186
const wrapper = mount(<MapboxMap style="" zoom={[1]} />);
164187

165-
wrapper.setState({
166-
map: {
167-
...mapState,
168-
flyTo
169-
}
170-
});
171188
wrapper.setProps({ zoom: [1] });
172189

173190
expect(flyTo).toHaveBeenCalled();
174191
});
175192

176193
// Handling bearing prop
177194
it('Should not update bearing when using same reference equality', () => {
178-
const MapboxMap = ReactMapboxGl({ accessToken: '', injectCSS: false });
179195
const flyTo = jest.fn();
196+
const MapboxMap = ReactMapboxGl({
197+
accessToken: '',
198+
injectCSS: false,
199+
mapInstance: getMock({
200+
flyTo
201+
}) as any
202+
});
180203
const bearing: [number] = [3];
181204

182205
const wrapper = mount(<MapboxMap style="" bearing={bearing} />);
183206

184-
wrapper.setState({
185-
map: {
186-
...mapState,
187-
flyTo
188-
}
189-
});
190207
wrapper.setProps({ bearing });
191208

192209
expect(flyTo).not.toHaveBeenCalled();
193210
});
194211

195212
it('Should update the bearing on broken reference equality', () => {
196213
const flyTo = jest.fn();
197-
const MapboxMap = ReactMapboxGl({ accessToken: '', injectCSS: false });
214+
const MapboxMap = ReactMapboxGl({
215+
accessToken: '',
216+
injectCSS: false,
217+
mapInstance: getMock({
218+
flyTo
219+
}) as any
220+
});
198221

199222
const wrapper = mount(<MapboxMap style="" bearing={[1]} />);
200223

201-
wrapper.setState({
202-
map: {
203-
...mapState,
204-
flyTo
205-
}
206-
});
207224
wrapper.setProps({ bearing: [1] });
208225

209226
expect(flyTo).toHaveBeenCalled();
210227
});
211228

212229
// Handling pitch prop
213230
it('Should not update pitch when using same reference equality', () => {
214-
const MapboxMap = ReactMapboxGl({ accessToken: '', injectCSS: false });
215231
const flyTo = jest.fn();
232+
const MapboxMap = ReactMapboxGl({
233+
accessToken: '',
234+
injectCSS: false,
235+
mapInstance: getMock({
236+
flyTo
237+
}) as any
238+
});
216239
const pitch: [number] = [3];
217240

218241
const wrapper = mount(<MapboxMap style="" pitch={pitch} />);
219242

220-
wrapper.setState({
221-
map: {
222-
...mapState,
223-
flyTo
224-
}
225-
});
226243
wrapper.setProps({ pitch });
227244

228245
expect(flyTo).not.toHaveBeenCalled();
229246
});
230247

231248
it('Should update the pitch on broken reference equality', () => {
232249
const flyTo = jest.fn();
233-
const MapboxMap = ReactMapboxGl({ accessToken: '', injectCSS: false });
250+
const MapboxMap = ReactMapboxGl({
251+
accessToken: '',
252+
injectCSS: false,
253+
mapInstance: getMock({
254+
flyTo
255+
}) as any
256+
});
234257

235258
const wrapper = mount(<MapboxMap style="" pitch={[1]} />);
236259

237-
wrapper.setState({
238-
map: {
239-
...mapState,
240-
flyTo
241-
}
242-
});
243260
wrapper.setProps({ pitch: [1] });
244261

245262
expect(flyTo).toHaveBeenCalled();
246263
});
247264

248265
it('Should pass animation options and flyTo options', () => {
249-
const MapboxMap = ReactMapboxGl({ accessToken: '', injectCSS: false });
250266
const flyTo = jest.fn();
267+
const MapboxMap = ReactMapboxGl({
268+
accessToken: '',
269+
injectCSS: false,
270+
mapInstance: getMock({
271+
flyTo
272+
}) as any
273+
});
251274
const zoom: [number] = [3];
252275
const flyToOptions = {
253276
speed: 0.1,
@@ -266,13 +289,6 @@ describe('Map', () => {
266289
/>
267290
);
268291

269-
wrapper.setState({
270-
map: {
271-
...mapState,
272-
flyTo
273-
}
274-
});
275-
276292
wrapper.setProps({ zoom: [1] });
277293

278294
expect(flyTo.mock.calls[0][0]).toEqual({

0 commit comments

Comments
 (0)