I've written a function that creates a Leaflet icon with specified properties:
createIcon(
url,
retinaUrl: string = null,
height: number = 20,
width: number = 20
): Icon {
const icon: Icon = L.icon({
iconUrl: url,
iconRetinaUrl: retinaUrl,
iconSize: [width, height],
shadowSize: [0, 0],
iconAnchor: [width / 2, height / 2],
shadowAnchor: [0, 0],
popupAnchor: [0, 0]
});
return icon;
}
Now, let's test this function:
it('should create an icon with specified properties', () => {
const testURL = 'testUrl';
const testRetinaURL = 'test';
const testHeight = 2;
const testWidth = 2;
expect(
service.createIcon(testURL, testRetinaURL, testHeight, testWidth)
).toEqual(expectedIcon);
});
Here is the expected icon object we are comparing against:
const expectedIcon: Icon = L.icon({
iconUrl: 'testUrl',
iconRetinaUrl: 'test',
iconSize: [2, 2],
shadowSize: [0, 0],
iconAnchor: [20 / 2, 20 / 2],
shadowAnchor: [0, 0],
popupAnchor: [0, 0]
});
While testing, I encountered an error message:
Expected $.options.iconAnchor[0] = 1 to equal 10.
Expected $.options.iconAnchor[1] = 1 to equal 10.
It seems like the anchor values are not matching. How can I set these additional properties when the function only accepts four parameters?
Any suggestions on improving the testing process for this function?