Add test for map action receiver (replaces old viewport store test)

[easbar]

Here I tried adding a new test to replace ViewportStore.test.ts after #159.
Unfortunately I get the following error:

    Jest encountered an unexpected token

    This usually means that you are trying to import a file which Jest cannot parse, e.g. it's not plain JavaScript.

    By default, if Jest sees a Babel config, it will use that to transform your files, ignoring "node_modules".

    Here's what you can do:
     • If you are trying to use ECMAScript Modules, see https://jestjs.io/docs/en/ecmascript-modules for how to enable it.
     • To have some of your "node_modules" files transformed, you can specify a custom "transformIgnorePatterns" in your config.
     • If you need a custom transformation specify a "transform" option in your config.
     • If you simply want to mock your non-JS modules (e.g. binary assets) you can stub them out with the "moduleNameMapper" config option.

    You'll find more details and examples of these config options in the docs:
    https://jestjs.io/docs/en/configuration.html

    Details:

    /home/me/code/routing/graphhopper/gh-maps-react/node_modules/ol/proj.js:55
    import Projection from './proj/Projection.js';
    ^^^^^^

    SyntaxError: Cannot use import statement outside a module

      1 | import { Action, ActionReceiver } from '@/stores/Dispatcher'
      2 | import { Map } from 'ol'
    > 3 | import { fromLonLat } from 'ol/proj'
        | ^
      4 | import {
      5 |     PathDetailsRangeSelected,
      6 |     RouteRequestSuccess,

      at Runtime.createScriptFromCode (node_modules/jest-runtime/build/index.js:1350:14)
      at Object.<anonymous> (src/stores/MapActionReceiver.ts:3:1)

@Janekdererste any idea how to fix this? This test might not be crazy important but it might happen we see the same problem in another place later on.

[karussell]

From my understanding the core problem is that jest did not (or does not) support ES6 modules (ES2015 modules, i.e. stuff with import) and by default jest only supports CommonJS (stuff with require()).

Although babel is the most powerful tool for such conversions I did not want to add it and it should be possible to transpile simple import statements using webpack only. I had a similar problem in another PR but despite some good suggestions it wasn't working. I found this comment that says that it should be possible at least for openlayer:

Then the transformIgnorePatterns setting comes into play because by default everything in node_modules will not processed by the Jest transformers, so you need to specifically ask Jest to not ignore OL and process its files also.

See also this. (btw: everything in openlayers is a ES6 module since 2 years.)

Finally after hours, mostly due to trial and error, I think I found a working solution:

1. in tsconfig.json: allow JS code under compilerOptions
2. in jest.config.js: explicitly transform JS code with ts-jest transform: { "^.+\\.js?$": "ts-jest" }
3. in jest.config.js: explicitly only transform custom-model-editor, i.e. ignore everything except the custom-model-editor: transformIgnorePatterns: [ `<rootDir>/node_modules/(?!custom-model-editor/)` ]