react-spatial/components/Popup/Popup.test.js

Components to build React map apps.

import React from 'react';
import renderer from 'react-test-renderer';
import { configure, mount, shallow } from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';
import 'jest-canvas-mock';

import OLMap from 'ol/Map';
import Feature from 'ol/Feature';
import Point from 'ol/geom/Point';
import Line from 'ol/geom/LineString';
import Popup from './Popup';

var map = new OLMap({});

configure({ adapter: new Adapter() });

var feat = new Feature({
  geometry: new Point(0, 0),
});

var featLine = new Feature({
  geometry: new Line([
    [0, 0],
    [1, 1] ]),
});

describe('Popup', function () {
  describe('should match snapshot', function () {
    test('without feature', function () {
      var component = renderer.create(
        React.createElement( Popup, { map: map },
          React.createElement( 'div', { id: "foo" })
        )
      );
      var tree = component.toJSON();
      expect(tree).toMatchSnapshot();
    });

    test('with default values.', function () {
      var component = renderer.create(
        React.createElement( Popup, { map: map, feature: feat },
          React.createElement( 'div', { id: "foo" })
        )
      );
      var tree = component.toJSON();
      expect(tree).toMatchSnapshot();
    });

    test('without close button.', function () {
      var component = renderer.create(
        React.createElement( Popup, { map: map, feature: feat, showCloseButton: false },
          React.createElement( 'div', { id: "bar" })
        )
      );
      var tree = component.toJSON();
      expect(tree).toMatchSnapshot();
    });

    test('with tabIndex defined.', function () {
      var component = renderer.create(
        React.createElement( Popup, { map: map, feature: feat, tabIndex: "0" },
          React.createElement( 'div', { id: "bar" })
        )
      );
      var tree = component.toJSON();
      expect(tree).toMatchSnapshot();
    });
  });

  [
    ['click', {}],
    ['keypress', { which: 13 }] ].forEach(function (evt) {
    test(("should trigger onCloseClick function on " + (evt[0]) + " event."), function () {
      var ref;

      var Closer = function Closer () {};

      Closer.onCloseClick = function onCloseClick () {};

      var spy = jest.spyOn(Closer, 'onCloseClick');

      var component = mount(
        React.createElement( Popup, {
          map: map, feature: feat, onCloseClick: function () { return Closer.onCloseClick(); } },
          React.createElement( 'div', { id: "gux" })
        )
      );

      (ref = component
        .find('.rs-popup-close-bt')
        .at(1))
        .simulate.apply(ref, evt);

      expect(spy).toHaveBeenCalled();
    });

    test(("should trigger default onCloseClick function on " + (evt[0]) + " event without errors."), function () {
      var ref;

      var component = mount(
        React.createElement( Popup, { map: map, feature: feat, n: true },
          React.createElement( 'div', { id: "gux" })
        )
      );
      // test if no js error triggered by the default value
      try {
        (ref = component
          .find('.rs-popup-close-bt')
          .at(1))
          .simulate.apply(ref, evt);
        expect(true).toBe(true);
      } catch (e) {
        expect(false).toBe(true);
      }
    });
  });

  describe("updates position", function () {
    test("on map postrender event.", function () {
      map.getPixelFromCoordinate = jest.fn(function () { return [10, 200]; });
      var component = shallow(
        React.createElement( Popup, { map: map, feature: feat },
          React.createElement( 'div', { id: "gux" })
        )
      );
      var spy = jest.spyOn(component.instance(), 'updatePixelPosition');
      map.dispatchEvent({ type: 'postrender' });
      expect(spy).toHaveBeenCalledTimes(1);
    });
  });

  test("deregisters postrender on unmount.", function () {
    map.getPixelFromCoordinate = jest.fn(function () { return [10, 200]; });
    var component = shallow(
      React.createElement( Popup, { map: map, feature: featLine },
        React.createElement( 'div', { id: "gux" })
      )
    );
    var spy = jest.spyOn(component.instance(), 'updatePixelPosition');
    map.dispatchEvent({ type: 'postrender' });
    expect(spy).toHaveBeenCalledTimes(1);
    component.unmount();
    map.dispatchEvent({ type: 'postrender' });
    expect(spy).toHaveBeenCalledTimes(1);
  });
});

//# sourceMappingURL=Popup.test.js.map