Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

How do I properly test a custom icon function?

I have a function that returns a leaflet icon with some properties:

addSimpleIcon(
    iconUrl,
    iconRetinaUrl: string = null,
    iconHeight: number = 20,
    iconWidth: number = 20
  ): Icon {
    const icon: Icon = L.icon({
      iconUrl,
      iconRetinaUrl,
      iconSize: [iconWidth, iconHeight], 
      shadowSize: [0, 0],
      iconAnchor: [iconWidth / 2, iconHeight / 2], 
      shadowAnchor: [0, 0], 
      popupAnchor: [0, 0]
    });
    return icon;
  }

Here is my test

it('should return a simple icon with properties', () => {
    const test = 'testUrl';
    const anotherTestString = 'test';
    const testHeight = 2;
    const testWidth = 2;
    expect(
      service.addSimpleIcon(test, anotherTestString, testHeight, testWidth)
    ).toEqual(anotherTestIcon);
  });

Here is that const that the test is seeing if it is equal:

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

const anotherTestIcon: Icon = L.icon({
    iconUrl: 'testUrl',
    iconRetinaUrl: 'test',
    iconSize: [2, 2],
    shadowSize: [0, 0],
    iconAnchor: [20 / 2, 20 / 2],
    shadowAnchor: [0, 0],
    popupAnchor: [0, 0]
  });

My overall thinking is I want to make sure that these values are getting set properly but I’m coming across this error here:

Expected $.options.iconAnchor[0] = 1 to equal 10.
Expected $.options.iconAnchor[1] = 1 to equal 10.

I know it’s expecting the iconAnchor, shadowAnchor, and popupAnchor but how can I pass these in if the method only takes four parameters, right?

Is there a better way to test this function?

>Solution :

I think maybe your setup is off. Looks like "anotherTestIcon" is passed in but is never defined.

Here’s a working example: https://stackblitz.com/edit/github-test-run-draft-fn737v?file=src/app/app.component.spec.ts

Try changing your test to look more like this:

  it('should return a simple icon with properties', () => {
    const anotherTestIcon = {
      iconUrl: 'foop',
      iconRetinaUrl: 'doop',
      iconSize: [1, 1],
      shadowSize: [0, 0],
      iconAnchor: [1 / 2, 1 / 2],
      shadowAnchor: [0, 0],
      popupAnchor: [0, 0],
    };

    const result = component.addSimpleIcon(
      anotherTestIcon.iconUrl,
      anotherTestIcon.iconRetinaUrl,
      1,
      1
    );

    expect(result).toEqual(anotherTestIcon);
  });
Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading