How to use FakeMap method in chai

Best JavaScript code snippet using chai

DrawSupport-test.jsx

Source:DrawSupport-test.jsx

1/*2 * Copyright 2017, GeoSolutions Sas.3 * All rights reserved.4 *5 * This source code is licensed under the BSD-style license found in the6 * LICENSE file in the root directory of this source tree.7 */8import React from 'react';9import ReactDOM from 'react-dom';10import expect from 'expect';11import assign from 'object-assign';12import DrawSupport from '../DrawSupport';13import {DEFAULT_ANNOTATIONS_STYLES} from '../../../../utils/AnnotationsUtils';14import {circle, geomCollFeature} from '../../../../test-resources/drawsupport/features';15import {Map, View, Feature} from 'ol';16import {Point, Circle, Polygon, LineString, MultiPoint, MultiPolygon, MultiLineString} from 'ol/geom';17import Collection from 'ol/Collection';18const viewOptions = {19    projection: 'EPSG:3857',20    center: [0, 0],21    zoom: 522};23let olMap = new Map({24    target: "map",25    view: new View(viewOptions)26});27olMap.disableEventListener = () => {};28const testHandlers = {29    onStatusChange: () => {},30    onSelectFeatures: () => {},31    onGeometryChanged: () => {},32    onChangeDrawingStatus: () => {},33    onEndDrawing: () => {},34    onDrawingFeatures: () => {}35};36/*  used to render the DrawSupport component with some default props*/37const renderDrawSupport = (props = {}) => {38    return ReactDOM.render(39        <DrawSupport40            features={props.features | []}41            map={props.map || olMap}42            {...testHandlers}43            {...props}44        />, document.getElementById("container"));45};46/**47 * it renders Drawsupport in edit mode with singleclick Listener enabled and48 * it dispatches a singleclick mouse event49*/50const renderAndClick = (props = {}, options = {}) => {51    let support = renderDrawSupport();52    // entering UNSAFE_componentWillReceiveProps53    support = renderDrawSupport({54        drawStatus: "drawOrEdit",55        features: [props.feature],56        options: {57            drawEnabled: false,58            editEnabled: true,59            addClickCallback: true60        },61        ...props62    });63    support.props.map.dispatchEvent({64        type: "singleclick",65        coordinate: options.singleClickCoordiante || [500, 30]66    });67    return support;68};69describe('Test DrawSupport', () => {70    beforeEach((done) => {71        document.body.innerHTML = '<div id="map"></div><div id="container"></div>';72        setTimeout(done);73    });74    afterEach((done) => {75        document.body.innerHTML = '';76        olMap = new Map({77            target: "map",78            view: new View(viewOptions)79        });80        olMap.disableEventListener = () => {};81        expect.restoreSpies();82        setTimeout(done);83    });84    it('creates a default style when none is specified', () => {85        // create layers86        const support = ReactDOM.render(87            <DrawSupport/>, document.getElementById("container"));88        expect(support).toExist();89        expect(support.toOlStyle()).toExist();90    });91    it('creates a drawing layer', () => {92        const fakeMap = {93            addLayer: () => {},94            getView: () => ({getProjection: () => ({getCode: () => "EPSG:3857"})})95        };96        const spy = expect.spyOn(fakeMap, "addLayer");97        const support = ReactDOM.render(98            <DrawSupport features={[]} map={fakeMap}/>, document.getElementById("container"));99        expect(support).toExist();100        ReactDOM.render(101            <DrawSupport features={[]} map={fakeMap} drawStatus="create" drawMethod="Point"/>, document.getElementById("container"));102        expect(spy.calls.length).toBe(1);103    });104    it('starts drawing', () => {105        const fakeMap = {106            addLayer: () => {},107            getView: () => ({getProjection: () => ({getCode: () => "EPSG:3857"})}),108            disableEventListener: () => {},109            addInteraction: () => {},110            enableEventListener: () => {},111            removeInteraction: () => {},112            removeLayer: () => {},113            getInteractions: () => ({114                getLength: () => 0115            })116        };117        const spyAddLayer = expect.spyOn(fakeMap, "addLayer");118        const spyAddInteraction = expect.spyOn(fakeMap, "addInteraction");119        const support = ReactDOM.render(120            <DrawSupport features={[]} map={fakeMap}/>, document.getElementById("container"));121        expect(support).toExist();122        ReactDOM.render(123            <DrawSupport features={[]} map={fakeMap} drawStatus="start" drawMethod="Point"/>, document.getElementById("container"));124        ReactDOM.render(125            <DrawSupport features={[]} map={fakeMap} drawStatus="start" drawMethod="LineString  "/>, document.getElementById("container"));126        expect(spyAddLayer.calls.length).toBe(2);127        expect(spyAddInteraction.calls.length).toBe(2);128    });129    it('starts drawing bbox', () => {130        const fakeMap = {131            addLayer: () => {},132            getView: () => ({getProjection: () => ({getCode: () => "EPSG:3857"})}),133            disableEventListener: () => {},134            addInteraction: () => {},135            getInteractions: () => ({136                getLength: () => 0137            })138        };139        const spyAdd = expect.spyOn(fakeMap, "addLayer");140        const spyInteraction = expect.spyOn(fakeMap, "addInteraction");141        const support = ReactDOM.render(142            <DrawSupport features={[]} map={fakeMap}/>, document.getElementById("container"));143        expect(support).toExist();144        ReactDOM.render(145            <DrawSupport features={[]} map={fakeMap} drawStatus="start" drawMethod="BBOX"/>, document.getElementById("container"));146        expect(spyAdd.calls.length).toBe(1);147        expect(spyInteraction.calls.length).toBe(1);148    });149    it('starts drawing circle', () => {150        const fakeMap = {151            addLayer: () => {},152            getView: () => ({getProjection: () => ({getCode: () => "EPSG:3857"})}),153            disableEventListener: () => {},154            addInteraction: () => {},155            getInteractions: () => ({156                getLength: () => 0157            })158        };159        const spyAdd = expect.spyOn(fakeMap, "addLayer");160        const spyInteraction = expect.spyOn(fakeMap, "addInteraction");161        const support = ReactDOM.render(162            <DrawSupport features={[]} map={fakeMap}/>, document.getElementById("container"));163        expect(support).toExist();164        ReactDOM.render(165            <DrawSupport features={[]} map={fakeMap} drawStatus="start" drawMethod="Circle"/>, document.getElementById("container"));166        expect(spyAdd.calls.length).toBe(1);167        expect(spyInteraction.calls.length).toBe(1);168    });169    it('starts drawing with editing', () => {170        const fakeMap = {171            addLayer: () => {},172            getView: () => ({getProjection: () => ({getCode: () => "EPSG:3857"})}),173            disableEventListener: () => {},174            addInteraction: () => {},175            getInteractions: () => ({176                getLength: () => 0177            })178        };179        const spyAdd = expect.spyOn(fakeMap, "addLayer");180        const spyInteraction = expect.spyOn(fakeMap, "addInteraction");181        const support = ReactDOM.render(182            <DrawSupport features={[]} map={fakeMap}/>, document.getElementById("container"));183        expect(support).toExist();184        ReactDOM.render(185            <DrawSupport features={[]} map={fakeMap} drawStatus="start" drawMethod="Point" options={{editEnabled: true}}/>, document.getElementById("container"));186        expect(spyAdd.calls.length).toBe(1);187        expect(spyInteraction.calls.length).toBe(4);188    });189    it('select interaction', () => {190        const fakeMap = {191            addLayer: () => {},192            getView: () => ({getProjection: () => ({getCode: () => "EPSG:3857"})}),193            disableEventListener: () => {},194            addInteraction: () => {},195            on: () => {},196            getInteractions: () => ({197                getLength: () => 0198            })199        };200        const ft = {201            type: "Feature",202            geometry: {203                type: "Point",204                coordinates: [1, 2]205            }206        };207        const spyChangeStatus = expect.spyOn(testHandlers, "onStatusChange");208        const support = ReactDOM.render(209            <DrawSupport features={[ft]} map={fakeMap}/>, document.getElementById("container"));210        expect(support).toExist();211        ReactDOM.render(212            <DrawSupport features={[ft]} map={fakeMap} drawStatus="drawOrEdit" drawMethod="Point"213                options={{editEnabled: true, selectEnabled: true}}214                onSelectFeatures={testHandlers.onStatusChange}/>, document.getElementById("container"));215        const feature = new Feature({216            geometry: new Point(13.0, 43.0),217            name: 'My Point'218        });219        support.selectInteraction.dispatchEvent({220            type: 'select',221            feature: feature222        });223        expect(spyChangeStatus.calls.length).toBe(1);224    });225    it('translate interaction', () => {226        const fakeMap = {227            addLayer: () => {},228            getView: () => ({getProjection: () => ({getCode: () => "EPSG:3857"})}),229            disableEventListener: () => {},230            addInteraction: () => {},231            getInteractions: () => ({232                getLength: () => 0233            })234        };235        const spyChangeStatus = expect.spyOn(testHandlers, "onStatusChange");236        const support = ReactDOM.render(237            <DrawSupport features={[]} map={fakeMap}/>, document.getElementById("container"));238        expect(support).toExist();239        ReactDOM.render(240            <DrawSupport features={[]} map={fakeMap} drawStatus="start" drawMethod="Point" options={{editEnabled: true}}241                onChangeDrawingStatus={testHandlers.onStatusChange}/>, document.getElementById("container"));242        const feature = new Feature({243            geometry: new Point(13.0, 43.0),244            name: 'My Point'245        });246        support.translateInteraction.dispatchEvent({247            type: 'translateend',248            features: {249                getArray: () => ([feature])250            }251        });252        expect(spyChangeStatus.calls.length).toBe(1);253    });254    it('translate disabled when not editing', () => {255        const fakeMap = {256            addLayer: () => {},257            removeLayer: () => {},258            disableEventListener: () => {},259            enableEventListener: () => {},260            addInteraction: () => {},261            removeInteraction: () => {},262            getInteractions: () => ({263                getLength: () => 0264            }),265            getView: () => ({266                getProjection: () => ({267                    getCode: () => 'EPSG:4326'268                })269            })270        };271        const feature = {272            type: 'Feature',273            geometry: {274                type: 'Polygon',275                coordinates: [[276                    [13, 43],277                    [15, 43],278                    [15, 44],279                    [13, 44]280                ]]281            },282            properties: {283                'name': "some name"284            }285        };286        const support = ReactDOM.render(287            <DrawSupport features={[]} map={fakeMap}/>, document.getElementById("container"));288        expect(support).toExist();289        ReactDOM.render(290            <DrawSupport features={[feature]} map={fakeMap} drawStatus="drawOrEdit" drawMethod="Some" options={{291                drawEnabled: false, editEnabled: false}}292            />, document.getElementById("container"));293        expect(support.translateInteraction).toNotExist();294    });295    it('translate disabled when Polygon', () => {296        const fakeMap = {297            addLayer: () => {},298            removeLayer: () => {},299            disableEventListener: () => {},300            enableEventListener: () => {},301            addInteraction: () => {},302            removeInteraction: () => {},303            getInteractions: () => ({304                getLength: () => 0305            }),306            on: () => {},307            getView: () => ({308                getProjection: () => ({309                    getCode: () => 'EPSG:4326'310                })311            })312        };313        const feature = {314            type: 'Feature',315            geometry: {316                type: 'Polygon',317                coordinates: [[318                    [13, 43],319                    [15, 43],320                    [15, 44],321                    [13, 44]322                ]]323            },324            properties: {325                'name': "some name"326            }327        };328        const support = ReactDOM.render(329            <DrawSupport features={[]} map={fakeMap}/>, document.getElementById("container"));330        expect(support).toExist();331        ReactDOM.render(332            <DrawSupport features={[feature]} map={fakeMap} drawStatus="drawOrEdit" drawMethod="Polygon" options={{333                drawEnabled: false, editEnabled: true}}334            />, document.getElementById("container"));335        expect(support.translateInteraction).toExist();336    });337    it('end drawing', () => {338        const fakeMap = {339            addLayer: () => {},340            disableEventListener: () => {},341            addInteraction: () => {},342            getInteractions: () => ({343                getLength: () => 0344            }),345            getView: () => ({346                getProjection: () => ({347                    getCode: () => 'EPSG:4326'348                })349            })350        };351        const feature = new Feature({352            geometry: new Point(13.0, 43.0),353            name: 'My Point'354        });355        const spyEnd = expect.spyOn(testHandlers, "onEndDrawing");356        const spyChangeStatus = expect.spyOn(testHandlers, "onStatusChange");357        const support = ReactDOM.render(358            <DrawSupport features={[]} map={fakeMap}/>, document.getElementById("container"));359        expect(support).toExist();360        ReactDOM.render(361            <DrawSupport features={[]} map={fakeMap} drawStatus="start" drawMethod="Point" options={{stopAfterDrawing: true}}362                onEndDrawing={testHandlers.onEndDrawing} onChangeDrawingStatus={testHandlers.onStatusChange}/>, document.getElementById("container"));363        support.drawInteraction.dispatchEvent({364            type: 'drawstart',365            feature: feature366        });367        support.drawInteraction.dispatchEvent({368            type: 'drawend',369            feature: feature370        });371        expect(spyEnd.calls.length).toBe(1);372        expect(spyChangeStatus.calls.length).toBe(1);373    });374    it('end drawing a circle feature ', () => {375        const fakeMap = {376            addLayer: () => {},377            disableEventListener: () => {},378            addInteraction: () => {},379            getInteractions: () => ({380                getLength: () => 0381            }),382            getView: () => ({383                getProjection: () => ({384                    getCode: () => 'EPSG:4326'385                })386            })387        };388        const feature = new Feature({389            geometry: new Circle([13.0, 43.0], 100),390            name: 'My Point'391        });392        const spyEnd = expect.spyOn(testHandlers, "onEndDrawing");393        const spyChangeStatus = expect.spyOn(testHandlers, "onStatusChange");394        const support = ReactDOM.render(395            <DrawSupport features={[]} map={fakeMap}/>, document.getElementById("container"));396        expect(support).toExist();397        ReactDOM.render(398            <DrawSupport features={[]} map={fakeMap} drawStatus="start" drawMethod="Circle" options={{399                stopAfterDrawing: true,400                geodesic: true401            }}402            onEndDrawing={testHandlers.onEndDrawing} onChangeDrawingStatus={testHandlers.onStatusChange}/>, document.getElementById("container"));403        support.drawInteraction.dispatchEvent({404            type: 'drawstart',405            feature: feature406        });407        support.drawInteraction.dispatchEvent({408            type: 'drawend',409            feature: feature410        });411        expect(spyEnd.calls.length).toBe(1);412        expect(spyChangeStatus.calls.length).toBe(1);413    });414    it('tests a replace of geodesic circle feature ', () => {415        const fakeMap = {416            addLayer: () => {},417            disableEventListener: () => {},418            addInteraction: () => {},419            getInteractions: () => ({420                getLength: () => 0421            }),422            getView: () => ({423                getProjection: () => ({424                    getCode: () => 'EPSG:4326'425                })426            })427        };428        const support = ReactDOM.render(429            <DrawSupport features={[]} map={fakeMap}/>, document.getElementById("container"));430        expect(support).toExist();431        ReactDOM.render(432            <DrawSupport433                features={[]}434                map={fakeMap}435                drawStatus="start"436                drawMethod="Circle"437                options={{438                    stopAfterDrawing: true,439                    geodesic: true440                }}441            />, document.getElementById("container"));442        ReactDOM.render(443            <DrawSupport444                features={[445                    {446                        type: 'Polygon',447                        center: {448                            x: 721565.5470120639,449                            y: 5586683.477814646450                        },451                        coordinates: [452                            721565.5470120639,453                            5586683.477814646454                        ],455                        radius: 294110.99,456                        projection: 'EPSG:3857'457                    }458                ]}459                map={fakeMap}460                drawStatus="replace"461                drawMethod="Circle"462                options={{463                    geodesic: true464                }}465                onEndDrawing={testHandlers.onEndDrawing}466                onChangeDrawingStatus={testHandlers.onStatusChange}467            />, document.getElementById("container"));468        const {geodesicCenter} = support.drawSource.getFeatures()[0].getGeometry().getProperties();469        const isNearlyEqual = function(a, b) {470            if (a === undefined || b === undefined) {471                return false;472            }473            return a.toFixed(12) - b.toFixed(12) === 0;474        };475        expect(isNearlyEqual(geodesicCenter[0], 721565.5470120639)).toBeTruthy();476        expect(isNearlyEqual(geodesicCenter[1], 5586683.477814646)).toBeTruthy();477    });478    it('end drawing with continue', () => {479        const fakeMap = {480            addLayer: () => {},481            disableEventListener: () => {},482            addInteraction: () => {},483            getInteractions: () => ({484                getLength: () => 0485            }),486            getView: () => ({487                getProjection: () => ({488                    getCode: () => 'EPSG:4326'489                })490            })491        };492        const feature = new Feature({493            geometry: new Point(13.0, 43.0),494            name: 'My Point'495        });496        const spyEnd = expect.spyOn(testHandlers, "onEndDrawing");497        const spyChangeStatus = expect.spyOn(testHandlers, "onStatusChange");498        const support = ReactDOM.render(499            <DrawSupport features={[]} map={fakeMap}/>, document.getElementById("container"));500        expect(support).toExist();501        ReactDOM.render(502            <DrawSupport features={[]} map={fakeMap} drawStatus="start" drawMethod="Point" options={{stopAfterDrawing: false}}503                onEndDrawing={testHandlers.onEndDrawing} onChangeDrawingStatus={testHandlers.onStatusChange}/>, document.getElementById("container"));504        support.drawInteraction.dispatchEvent({505            type: 'drawend',506            feature: feature507        });508        expect(spyEnd.calls.length).toBe(1);509        expect(spyChangeStatus.calls.length).toBe(0);510    });511    it('stop drawing', () => {512        const fakeMap = {513            addLayer: () => {},514            disableEventListener: () => {},515            enableEventListener: () => {},516            addInteraction: () => {},517            removeInteraction: () => {},518            getInteractions: () => ({519                getLength: () => 0520            }),521            getView: () => ({522                getProjection: () => ({523                    getCode: () => 'EPSG:4326'524                })525            })526        };527        const spyRemove = expect.spyOn(fakeMap, "removeInteraction");528        const support = ReactDOM.render(529            <DrawSupport features={[]} map={fakeMap}/>, document.getElementById("container"));530        expect(support).toExist();531        ReactDOM.render(532            <DrawSupport features={[]} map={fakeMap} drawStatus="start" drawMethod="Point" options={{stopAfterDrawing: false}}533            />, document.getElementById("container"));534        ReactDOM.render(535            <DrawSupport features={[]} map={fakeMap} drawStatus="stop" drawMethod="Point" options={{stopAfterDrawing: true}}536            />, document.getElementById("container"));537        expect(spyRemove.calls.length).toBe(1);538    });539    it('replace features', () => {540        const fakeMap = {541            addLayer: () => {},542            disableEventListener: () => {},543            enableEventListener: () => {},544            addInteraction: () => {},545            removeInteraction: () => {},546            getInteractions: () => ({547                getLength: () => 0548            }),549            getView: () => ({550                getProjection: () => ({551                    getCode: () => 'EPSG:4326'552                })553            })554        };555        const feature = {556            type: 'Feature',557            geometry: {558                type: 'Polygon',559                coordinates: [[560                    [13, 43],561                    [15, 43],562                    [15, 44],563                    [13, 44]564                ]]565            },566            featureProjection: "EPSG:4326",567            properties: {568                'name': "some name"569            },570            style: {type: "Polygon", "Polygon": DEFAULT_ANNOTATIONS_STYLES.Polygon}571        };572        const support = ReactDOM.render(573            <DrawSupport features={[]} map={fakeMap}/>, document.getElementById("container"));574        expect(support).toExist();575        ReactDOM.render(576            <DrawSupport features={[]} map={fakeMap} drawStatus="create" drawMethod="Polygon" options={{stopAfterDrawing: false}}577            />, document.getElementById("container"));578        const spyAddFeature = expect.spyOn(support.drawSource, "addFeature");579        ReactDOM.render(580            <DrawSupport features={[feature]} map={fakeMap} drawStatus="replace" drawMethod="Polygon" options={{stopAfterDrawing: true}}581            />, document.getElementById("container"));582        expect(spyAddFeature.calls.length).toBe(1);583    });584    it('replace features multipolygon', () => {585        const fakeMap = {586            addLayer: () => {},587            disableEventListener: () => {},588            enableEventListener: () => {},589            addInteraction: () => {},590            removeInteraction: () => {},591            getInteractions: () => ({592                getLength: () => 0593            }),594            getView: () => ({595                getProjection: () => ({596                    getCode: () => 'EPSG:4326'597                })598            })599        };600        const feature = {601            type: 'Feature',602            geometry: {603                type: 'Polygon',604                coordinates: [[605                    [13, 43],606                    [15, 43],607                    [15, 44],608                    [13, 44]609                ]]610            },611            featureProjection: "EPSG:4326",612            properties: {613                'name': "some name"614            }615        };616        const support = ReactDOM.render(617            <DrawSupport features={[]} map={fakeMap}/>, document.getElementById("container"));618        expect(support).toExist();619        ReactDOM.render(620            <DrawSupport features={[]} map={fakeMap} drawStatus="create" drawMethod="MultiPolygon" options={{stopAfterDrawing: false}}621            />, document.getElementById("container"));622        const spyAddFeature = expect.spyOn(support.drawSource, "addFeature");623        ReactDOM.render(624            <DrawSupport features={[feature]} map={fakeMap} drawStatus="replace" drawMethod="MultiPolygon" options={{stopAfterDrawing: true}}625            />, document.getElementById("container"));626        expect(spyAddFeature.calls.length).toBe(1);627    });628    it('replace features point', () => {629        const fakeMap = {630            addLayer: () => {},631            disableEventListener: () => {},632            enableEventListener: () => {},633            addInteraction: () => {},634            removeInteraction: () => {},635            getInteractions: () => ({636                getLength: () => 0637            }),638            getView: () => ({639                getProjection: () => ({640                    getCode: () => 'EPSG:4326'641                })642            })643        };644        const feature = {645            type: 'Feature',646            geometry: {647                type: 'Point',648                coordinates: [13, 43]649            },650            featureProjection: "EPSG:4326",651            properties: {652                'name': "some name"653            }654        };655        const support = ReactDOM.render(656            <DrawSupport features={[]} map={fakeMap}/>, document.getElementById("container"));657        expect(support).toExist();658        ReactDOM.render(659            <DrawSupport features={[]} map={fakeMap} drawStatus="create" drawMethod="Point" options={{stopAfterDrawing: false}}660            />, document.getElementById("container"));661        const spyAddFeature = expect.spyOn(support.drawSource, "addFeature");662        ReactDOM.render(663            <DrawSupport features={[feature]} map={fakeMap} drawStatus="replace" drawMethod="Point" options={{stopAfterDrawing: true}}664            />, document.getElementById("container"));665        expect(spyAddFeature.calls.length).toBe(1);666    });667    it('replace features linestring', () => {668        const fakeMap = {669            addLayer: () => {},670            disableEventListener: () => {},671            enableEventListener: () => {},672            addInteraction: () => {},673            removeInteraction: () => {},674            getInteractions: () => ({675                getLength: () => 0676            }),677            getView: () => ({678                getProjection: () => ({679                    getCode: () => 'EPSG:4326'680                })681            })682        };683        const feature = {684            type: 'Feature',685            geometry: {686                type: 'LineString',687                coordinates: [[13, 43], [14, 44]]688            },689            featureProjection: "EPSG:4326",690            properties: {691                'name': "some name"692            }693        };694        const support = ReactDOM.render(695            <DrawSupport features={[]} map={fakeMap}/>, document.getElementById("container"));696        expect(support).toExist();697        ReactDOM.render(698            <DrawSupport features={[]} map={fakeMap} drawStatus="create" drawMethod="LineString" options={{stopAfterDrawing: false}}699            />, document.getElementById("container"));700        const spyAddFeature = expect.spyOn(support.drawSource, "addFeature");701        ReactDOM.render(702            <DrawSupport features={[feature]} map={fakeMap} drawStatus="replace" drawMethod="LineString" options={{stopAfterDrawing: true}}703            />, document.getElementById("container"));704        expect(spyAddFeature.calls.length).toBe(1);705    });706    it('replace features multilinestring', () => {707        const fakeMap = {708            addLayer: () => {},709            disableEventListener: () => {},710            enableEventListener: () => {},711            addInteraction: () => {},712            removeInteraction: () => {},713            getInteractions: () => ({714                getLength: () => 0715            }),716            getView: () => ({717                getProjection: () => ({718                    getCode: () => 'EPSG:4326'719                })720            })721        };722        const feature = {723            type: 'Feature',724            geometry: {725                type: 'LineString',726                coordinates: [[13, 43], [14, 44]]727            },728            featureProjection: "EPSG:4326",729            properties: {730                'name': "some name"731            }732        };733        const support = ReactDOM.render(734            <DrawSupport features={[]} map={fakeMap}/>, document.getElementById("container"));735        expect(support).toExist();736        ReactDOM.render(737            <DrawSupport features={[]} map={fakeMap} drawStatus="create" drawMethod="MultiLineString" options={{stopAfterDrawing: false}}738            />, document.getElementById("container"));739        const spyAddFeature = expect.spyOn(support.drawSource, "addFeature");740        ReactDOM.render(741            <DrawSupport features={[feature]} map={fakeMap} drawStatus="replace" drawMethod="MultiLineString" options={{stopAfterDrawing: true}}742            />, document.getElementById("container"));743        expect(spyAddFeature.calls.length).toBe(1);744    });745    it('replace features no draw interaction', () => {746        const fakeMap = {747            addLayer: () => {},748            disableEventListener: () => {},749            enableEventListener: () => {},750            addInteraction: () => {},751            removeInteraction: () => {},752            getInteractions: () => ({753                getLength: () => 0754            }),755            getView: () => ({756                getProjection: () => ({757                    getCode: () => 'EPSG:4326'758                })759            })760        };761        const feature = {762            type: 'Feature',763            geometry: {764                type: 'LineString',765                coordinates: [[13, 43], [14, 44]]766            },767            properties: {768                'name': "some name"769            }770        };771        const support = ReactDOM.render(772            <DrawSupport features={[]} map={fakeMap}/>, document.getElementById("container"));773        expect(support).toExist();774        const spyAddInteraction = expect.spyOn(support, "addInteractions");775        ReactDOM.render(776            <DrawSupport features={[feature]} map={fakeMap} drawStatus="replace" drawMethod="MultiLineString" options={{drawEnabled: false}}777            />, document.getElementById("container"));778        expect(spyAddInteraction.calls.length).toBe(0);779    });780    it('replace features with draw interaction', () => {781        const fakeMap = {782            addLayer: () => {},783            disableEventListener: () => {},784            enableEventListener: () => {},785            addInteraction: () => {},786            removeInteraction: () => {},787            getInteractions: () => ({788                getLength: () => 0789            }),790            getView: () => ({791                getProjection: () => ({792                    getCode: () => 'EPSG:4326'793                })794            })795        };796        const feature = {797            type: 'Feature',798            geometry: {799                type: 'LineString',800                coordinates: [[13, 43], [14, 44]]801            },802            properties: {803                'name': "some name"804            }805        };806        const support = ReactDOM.render(807            <DrawSupport features={[]} map={fakeMap}/>, document.getElementById("container"));808        expect(support).toExist();809        const spyAddInteraction = expect.spyOn(support, "addInteractions");810        ReactDOM.render(811            <DrawSupport features={[feature]} map={fakeMap} drawStatus="replace" drawMethod="MultiLineString" options={{drawEnabled: true}}812            />, document.getElementById("container"));813        expect(spyAddInteraction.calls.length).toBe(1);814    });815    it('replace features circle', () => {816        const fakeMap = {817            addLayer: () => {},818            disableEventListener: () => {},819            enableEventListener: () => {},820            addInteraction: () => {},821            removeInteraction: () => {},822            getInteractions: () => ({823                getLength: () => 0824            }),825            getView: () => ({826                getProjection: () => ({827                    getCode: () => 'EPSG:4326'828                })829            })830        };831        const feature = {832            type: 'Feature',833            geometry: {834                type: 'Circle',835                coordinates: [[13, 43], [14, 44]]836            },837            featureProjection: "EPSG:4326",838            properties: {839                'name': "some name"840            }841        };842        const support = ReactDOM.render(843            <DrawSupport features={[]} map={fakeMap}/>, document.getElementById("container"));844        expect(support).toExist();845        ReactDOM.render(846            <DrawSupport features={[]} map={fakeMap} drawStatus="create" drawMethod="Circle" options={{stopAfterDrawing: false}}847            />, document.getElementById("container"));848        const spyAddFeature = expect.spyOn(support.drawSource, "addFeature");849        ReactDOM.render(850            <DrawSupport features={[feature]} map={fakeMap} drawStatus="replace" drawMethod="Circle" options={{stopAfterDrawing: true}}851            />, document.getElementById("container"));852        expect(spyAddFeature.calls.length).toBe(1);853    });854    it('replace features with style', () => {855        const fakeMap = {856            addLayer: () => {},857            disableEventListener: () => {},858            enableEventListener: () => {},859            addInteraction: () => {},860            removeInteraction: () => {},861            getInteractions: () => ({862                getLength: () => 0863            }),864            getView: () => ({865                getProjection: () => ({866                    getCode: () => 'EPSG:4326'867                })868            })869        };870        const feature = {871            type: 'Feature',872            geometry: {873                type: 'Polygon',874                coordinates: [[875                    [13, 43],876                    [15, 43],877                    [15, 44],878                    [13, 44]879                ]]880            },881            featureProjection: "EPSG:4326",882            properties: {883                'name': "some name"884            }885        };886        const support = ReactDOM.render(887            <DrawSupport features={[]} map={fakeMap}/>, document.getElementById("container"));888        expect(support).toExist();889        ReactDOM.render(890            <DrawSupport features={[]} map={fakeMap} drawStatus="create" drawMethod="Polygon" options={{stopAfterDrawing: false}}891            />, document.getElementById("container"));892        const spyStyle = expect.spyOn(support.drawLayer, "setStyle");893        ReactDOM.render(894            <DrawSupport features={[feature]} map={fakeMap} drawStatus="replace" drawMethod="Polygon" options={{stopAfterDrawing: true}} style={{}}895            />, document.getElementById("container"));896        expect(spyStyle.calls.length).toBe(1);897    });898    it('styling fill color', () => {899        const support = ReactDOM.render(900            <DrawSupport/>, document.getElementById("container"));901        expect(support).toExist();902        const style = support.toOlStyle({903            fillColor: '#ff0'904        });905        expect(style).toExist();906        expect(style.getFill().getColor()).toExist();907        expect(style.getFill().getColor()[0]).toBe(255);908        expect(style.getFill().getColor()[1]).toBe(255);909        expect(style.getFill().getColor()[2]).toBe(0);910        expect(style.getFill().getColor()[3]).toBe(1);911    });912    it('styling fill transparency', () => {913        const support = ReactDOM.render(914            <DrawSupport/>, document.getElementById("container"));915        expect(support).toExist();916        const style = support.toOlStyle({917            fillColor: '#ff0',918            fillTransparency: 0.5919        });920        expect(style).toExist();921        expect(style.getFill().getColor()).toExist();922        expect(style.getFill().getColor()[0]).toBe(255);923        expect(style.getFill().getColor()[1]).toBe(255);924        expect(style.getFill().getColor()[2]).toBe(0);925        expect(style.getFill().getColor()[3]).toBe(0.5);926    });927    it('styling stroke color', () => {928        const support = ReactDOM.render(929            <DrawSupport/>, document.getElementById("container"));930        expect(support).toExist();931        const style = support.toOlStyle({932            strokeColor: '#ff0'933        });934        expect(style).toExist();935        expect(style.getStroke().getColor().length).toBe(4);936        expect(style.getStroke().getColor()[0]).toBe(255);937        expect(style.getStroke().getColor()[1]).toBe(255);938        expect(style.getStroke().getColor()[2]).toBe(0);939        expect(style.getStroke().getColor()[3]).toBe(1);940    });941    it('styling icon url', () => {942        const support = ReactDOM.render(943            <DrawSupport/>, document.getElementById("container"));944        expect(support).toExist();945        const style = support.toOlStyle({946            iconUrl: '#myUrl',947            shadowUrl: 'otherurl'948        });949        expect(style).toExist();950        expect(style.length).toBe(2);951    });952    it('styling icon glyph', () => {953        const support = ReactDOM.render(954            <DrawSupport/>, document.getElementById("container"));955        expect(support).toExist();956        const style = support.toOlStyle({957            iconGlyph: 'comment'958        });959        expect(style).toExist();960        expect(style.length).toBe(2);961    });962    it('clean', () => {963        const fakeMap = {964            addLayer: () => {},965            removeLayer: () => {},966            disableEventListener: () => {},967            enableEventListener: () => {},968            addInteraction: () => {},969            removeInteraction: () => {},970            getInteractions: () => ({971                getLength: () => 0972            }),973            on: () => {},974            un: () => {},975            getView: () => ({976                getProjection: () => ({977                    getCode: () => 'EPSG:4326'978                })979            })980        };981        const spyRemoveLayer = expect.spyOn(fakeMap, "removeLayer");982        const spyRemoveInteraction = expect.spyOn(fakeMap, "removeInteraction");983        const support = ReactDOM.render(984            <DrawSupport features={[]} map={fakeMap}/>, document.getElementById("container"));985        expect(support).toExist();986        ReactDOM.render(987            <DrawSupport features={[]} map={fakeMap} drawStatus="start" drawMethod="Polygon" options={{editEnabled: true}}988            />, document.getElementById("container"));989        ReactDOM.render(990            <DrawSupport features={[]} map={fakeMap} drawStatus="clean" drawMethod="Polygon" options={{stopAfterDrawing: true}} style={{}}991            />, document.getElementById("container"));992        expect(spyRemoveLayer.calls.length).toBe(1);993        expect(spyRemoveInteraction.calls.length).toBe(4);994    });995    it('clean and continue', () => {996        const fakeMap = {997            addLayer: () => {},998            removeLayer: () => {},999            disableEventListener: () => {},1000            enableEventListener: () => {},1001            addInteraction: () => {},1002            removeInteraction: () => {},1003            getInteractions: () => ({1004                getLength: () => 01005            }),1006            getView: () => ({1007                getProjection: () => ({1008                    getCode: () => 'EPSG:4326'1009                })1010            })1011        };1012        const spyRemoveLayer = expect.spyOn(fakeMap, "removeLayer");1013        const spyRemoveInteraction = expect.spyOn(fakeMap, "removeInteraction");1014        const support = ReactDOM.render(1015            <DrawSupport features={[]} map={fakeMap}/>, document.getElementById("container"));1016        expect(support).toExist();1017        ReactDOM.render(1018            <DrawSupport features={[]} map={fakeMap} drawStatus="start" drawMethod="Polygon" options={{editEnabled: true}}1019            />, document.getElementById("container"));1020        ReactDOM.render(1021            <DrawSupport features={[]} map={fakeMap} drawStatus="cleanAndContinueDrawing" drawMethod="Polygon" options={{stopAfterDrawing: true}} style={{}}1022            />, document.getElementById("container"));1023        expect(spyRemoveLayer.calls.length).toBe(1);1024        expect(spyRemoveInteraction.calls.length).toBe(0);1025    });1026    it('draw or edit, only draw', () => {1027        const fakeMap = {1028            addLayer: () => {},1029            removeLayer: () => {},1030            disableEventListener: () => {},1031            enableEventListener: () => {},1032            addInteraction: () => {},1033            removeInteraction: () => {},1034            getInteractions: () => ({1035                getLength: () => 01036            }),1037            on: () => {},1038            getView: () => ({1039                getProjection: () => ({1040                    getCode: () => 'EPSG:4326'1041                })1042            })1043        };1044        const feature = {1045            type: 'Feature',1046            geometry: {1047                type: 'Polygon',1048                coordinates: [[1049                    [13, 43],1050                    [15, 43],1051                    [15, 44],1052                    [13, 44]1053                ]]1054            },1055            properties: {1056                'name': "some name"1057            }1058        };1059        const spyAddLayer = expect.spyOn(fakeMap, "addLayer");1060        const spyAddInteraction = expect.spyOn(fakeMap, "addInteraction");1061        const support = ReactDOM.render(1062            <DrawSupport features={[]} map={fakeMap}/>, document.getElementById("container"));1063        expect(support).toExist();1064        ReactDOM.render(1065            <DrawSupport features={[feature]} map={fakeMap} drawStatus="drawOrEdit" drawMethod="Polygon" options={{1066                drawEnabled: true}}1067            />, document.getElementById("container"));1068        expect(spyAddLayer.calls.length).toBe(1);1069        expect(spyAddInteraction.calls.length).toBe(1);1070    });1071    it('draw or edit, both', () => {1072        const fakeMap = {1073            addLayer: () => {},1074            removeLayer: () => {},1075            disableEventListener: () => {},1076            enableEventListener: () => {},1077            addInteraction: () => {},1078            on: () => {},1079            removeInteraction: () => {},1080            getInteractions: () => ({1081                getLength: () => 01082            }),1083            getView: () => ({1084                getProjection: () => ({1085                    getCode: () => 'EPSG:4326'1086                })1087            })1088        };1089        const feature = {1090            type: 'Feature',1091            geometry: {1092                type: 'Polygon',1093                coordinates: [[1094                    [13, 43],1095                    [15, 43],1096                    [15, 44],1097                    [13, 44]1098                ]]1099            },1100            properties: {1101                'name': "some name"1102            }1103        };1104        const spyAddLayer = expect.spyOn(fakeMap, "addLayer");1105        const spyAddInteraction = expect.spyOn(fakeMap, "addInteraction");1106        const support = ReactDOM.render(1107            <DrawSupport features={[]} map={fakeMap}/>, document.getElementById("container"));1108        expect(support).toExist();1109        ReactDOM.render(1110            <DrawSupport features={[feature]} map={fakeMap} drawStatus="drawOrEdit" drawMethod="Polygon" options={{1111                drawEnabled: true,1112                editEnabled: true1113            }}1114            />, document.getElementById("container"));1115        expect(spyAddLayer.calls.length).toBe(1);1116        expect(spyAddInteraction.calls.length).toBe(3);1117    });1118    it('draw or edit, endevent', () => {1119        const fakeMap = {1120            addLayer: () => {},1121            removeLayer: () => {},1122            disableEventListener: () => {},1123            enableEventListener: () => {},1124            addInteraction: () => {},1125            removeInteraction: () => {},1126            getInteractions: () => ({1127                getLength: () => 01128            }),1129            getView: () => ({1130                getProjection: () => ({1131                    getCode: () => 'EPSG:4326'1132                })1133            })1134        };1135        const geoJSON = {1136            type: 'Feature',1137            geometry: {1138                type: 'Point',1139                coordinates: [13, 43]1140            },1141            properties: {1142                'name': "some name"1143            }1144        };1145        const feature = new Feature({1146            geometry: new Point(13.0, 43.0),1147            name: 'My Point'1148        });1149        const spyEnd = expect.spyOn(testHandlers, "onEndDrawing");1150        const spyChange = expect.spyOn(testHandlers, "onGeometryChanged");1151        const spyChangeStatus = expect.spyOn(testHandlers, "onStatusChange");1152        const support = ReactDOM.render(1153            <DrawSupport features={[]} map={fakeMap}/>, document.getElementById("container"));1154        expect(support).toExist();1155        ReactDOM.render(1156            <DrawSupport features={[geoJSON]} map={fakeMap} drawStatus="drawOrEdit" drawMethod="Point" options={{1157                drawEnabled: true}}1158            onEndDrawing={testHandlers.onEndDrawing}1159            onChangeDrawingStatus={testHandlers.onStatusChange}1160            onGeometryChanged={testHandlers.onGeometryChanged}1161            />, document.getElementById("container"));1162        support.drawInteraction.dispatchEvent({1163            type: 'drawend',1164            feature: feature1165        });1166        expect(spyEnd.calls.length).toBe(1);1167        expect(spyChangeStatus.calls.length).toBe(1);1168        expect(spyChange.calls.length).toBe(1);1169    });1170    it('draw or edit, update spatial field', () => {1171        const fakeMap = {1172            addLayer: () => {},1173            removeLayer: () => {},1174            disableEventListener: () => {},1175            enableEventListener: () => {},1176            addInteraction: () => {},1177            removeInteraction: () => {},1178            getInteractions: () => ({1179                getLength: () => 01180            }),1181            getView: () => ({1182                getProjection: () => ({1183                    getCode: () => 'EPSG:4326'1184                })1185            })1186        };1187        const geoJSON = {1188            type: 'Feature',1189            geometry: {1190                type: 'Point',1191                coordinates: [13, 43]1192            },1193            properties: {1194                'name': "some name"1195            }1196        };1197        const feature = new Feature({1198            geometry: new Point(13.0, 43.0),1199            name: 'My Point'1200        });1201        const spyEnd = expect.spyOn(testHandlers, "onEndDrawing");1202        const spyChange = expect.spyOn(testHandlers, "onGeometryChanged");1203        const spyChangeStatus = expect.spyOn(testHandlers, "onStatusChange");1204        const support = ReactDOM.render(1205            <DrawSupport features={[]} map={fakeMap}/>, document.getElementById("container"));1206        expect(support).toExist();1207        ReactDOM.render(1208            <DrawSupport features={[geoJSON]} map={fakeMap} drawStatus="drawOrEdit" drawMethod="Point" options={{1209                drawEnabled: true,1210                updateSpatialField: true1211            }}1212            onEndDrawing={testHandlers.onEndDrawing}1213            onChangeDrawingStatus={testHandlers.onStatusChange}1214            onGeometryChanged={testHandlers.onGeometryChanged}1215            />, document.getElementById("container"));1216        support.drawInteraction.dispatchEvent({1217            type: 'drawend',1218            feature: feature1219        });1220        expect(spyEnd.calls.length).toBe(1);1221        expect(spyChangeStatus.calls.length).toBe(1);1222        expect(spyChange.calls.length).toBe(1);1223    });1224    it('drawsupport test for polygonCoordsFromCircle', () => {1225        const fakeMap = {1226            addLayer: () => {},1227            removeLayer: () => {},1228            disableEventListener: () => {},1229            enableEventListener: () => {},1230            addInteraction: () => {},1231            removeInteraction: () => {},1232            getInteractions: () => ({1233                getLength: () => 01234            }),1235            getView: () => ({1236                getProjection: () => ({1237                    getCode: () => 'EPSG:4326'1238                })1239            })1240        };1241        const support = ReactDOM.render(1242            <DrawSupport features={[circle]} map={fakeMap}/>, document.getElementById("container"));1243        expect(support).toExist();1244        const center = [1, 1];1245        const radius = 100;1246        const coords = support.polygonCoordsFromCircle(center, radius);1247        expect(coords[0].length).toBe(101);1248    });1249    it('drawsupport test for polygonCoordsFromCircle', () => {1250        const fakeMap = {1251            addLayer: () => {},1252            removeLayer: () => {},1253            disableEventListener: () => {},1254            enableEventListener: () => {},1255            addInteraction: () => {},1256            removeInteraction: () => {},1257            getInteractions: () => ({1258                getLength: () => 01259            }),1260            getView: () => ({1261                getProjection: () => ({1262                    getCode: () => 'EPSG:4326'1263                })1264            })1265        };1266        const support = ReactDOM.render(1267            <DrawSupport features={[circle]} map={fakeMap}/>, document.getElementById("container"));1268        expect(support).toExist();1269        const center = [1, 1];1270        const radius = 123459;1271        const coords = support.polygonCoordsFromCircle(center, radius);1272        expect(coords[0].length).toBe(101);1273    });1274    it('test createOLGeometry with type in properties', () => {1275        const features = [{"type": "Feature", "id": "protected_areas.1", "geometry": {"type": "MultiPolygon", "coordinates": [[[[15.5436, 40.1345], [15.5439, 40.1358], [15.5448, 40.1376], [15.5456, 40.1397], [15.5444, 40.1419], [15.5443, 40.1439], [15.5462, 40.1446], [15.5473, 40.1455], [15.5485, 40.1464], [15.5496, 40.1482], [15.5506, 40.1483], [15.5514, 40.1473], [15.552, 40.1459], [15.5526, 40.1448], [15.5529, 40.1443], [15.5529, 40.1424], [15.552, 40.1414], [15.553, 40.1389], [15.5536, 40.137], [15.5527, 40.136], [15.5511, 40.1373], [15.5498, 40.1361], [15.5476, 40.1345], [15.5449, 40.1339], [15.5436, 40.1345]]]]}, "geometry_name": "the_geom", "properties": {"fid_1": 1, "fid": 1, "id": "214710630", "type": "protected_area", "name": "Oasi del Bussento"}, "bbox": [15.5436, 40.1339, 15.5536, 40.1483]}];1276        const fakeMap = {1277            addLayer: () => {},1278            removeLayer: () => {},1279            disableEventListener: () => {},1280            enableEventListener: () => {},1281            addInteraction: () => {},1282            updateOnlyFeatureStyles: () => {},1283            on: () => {},1284            removeInteraction: () => {},1285            getInteractions: () => ({1286                getLength: () => 01287            }),1288            getView: () => ({1289                getProjection: () => ({1290                    getCode: () => 'EPSG:4326'1291                })1292            })1293        };1294        let support = ReactDOM.render(<DrawSupport options={{geodesic: true}} map={fakeMap}/>, document.getElementById("container"));1295        support = ReactDOM.render(<DrawSupport options={{geodesic: true}} map={fakeMap} projection={"EPSG:900913"} features={features} method="MultiPolygon" drawStatus="drawOrEdit"/>, document.getElementById("container"));1296        const geomType = support.drawSource.getFeatures()[0].getGeometry().getType();1297        expect(geomType).toBe("MultiPolygon");1298    });1299    it('test createOLGeometry type Circle geodesic', () => {1300        const support = ReactDOM.render(<DrawSupport options={{geodesic: true}}/>, document.getElementById("container"));1301        const type = 'Circle';1302        const coordinates = [];1303        const radius = 50;1304        const center = {1305            x: 0,1306            y: 01307        };1308        const projection = 'EPSG:3857';1309        const geometry = support.createOLGeometry({type, coordinates, radius, center, projection, options: { geodesic: true }});1310        const geometryCoordinates = geometry.getCoordinates();1311        expect(geometryCoordinates[0].length).toBe(101);1312        const geometryProperties = geometry.getProperties();1313        const geodesicCenter = geometryProperties.geodesicCenter;1314        expect(geodesicCenter).toEqual([0, 0]);1315    });1316    it('test createOLGeometry type Circle missing param', () => {1317        const support = ReactDOM.render(<DrawSupport options={{geodesic: true}}/>, document.getElementById("container"));1318        const type = 'Circle';1319        const radius = 50;1320        const projection = 'EPSG:3857';1321        const center = {1322            x: 0,1323            y: 01324        };1325        const geometryMissingCenter = support.createOLGeometry({type, radius, projection, options: { geodesic: true }});1326        let geometryCoordinates = geometryMissingCenter.getCoordinates();1327        expect(geometryCoordinates.length).toBe(0);1328        let geometryProperties = geometryMissingCenter.getProperties();1329        let geodesicCenter = geometryProperties.geodesicCenter;1330        expect(geodesicCenter).toBe(undefined);1331        const geometryMissingProjection = support.createOLGeometry({type, radius, center, options: { geodesic: true }});1332        geometryCoordinates = geometryMissingProjection.getCoordinates();1333        expect(geometryCoordinates.length).toBe(0);1334        geometryProperties = geometryMissingProjection.getProperties();1335        geodesicCenter = geometryProperties.geodesicCenter;1336        expect(geodesicCenter).toBe(undefined);1337        const geometryMissingRadius = support.createOLGeometry({type, projection, center, options: { geodesic: true }});1338        geometryCoordinates = geometryMissingRadius.getCoordinates();1339        expect(geometryCoordinates.length).toBe(0);1340        geometryProperties = geometryMissingRadius.getProperties();1341        geodesicCenter = geometryProperties.geodesicCenter;1342        expect(geodesicCenter).toBe(undefined);1343    });1344    it('test createOLGeometry type Circle wrong center', () => {1345        const support = ReactDOM.render(<DrawSupport options={{geodesic: true}}/>, document.getElementById("container"));1346        const type = 'Circle';1347        const radius = 50;1348        const center = {1349            x: 'AAAA',1350            y: 01351        };1352        const projection = 'EPSG:3857';1353        const geometry = support.createOLGeometry({type, radius, center, projection, options: { geodesic: true }});1354        const geometryCoordinates = geometry.getCoordinates();1355        expect(geometryCoordinates.length).toBe(0);1356        const geometryProperties = geometry.getProperties();1357        const geodesicCenter = geometryProperties.geodesicCenter;1358        expect(geodesicCenter).toEqual(undefined);1359    });1360    it('test fromOLFeature verify radius', () => {1361        const fakeMap = {1362            addLayer: () => {},1363            removeLayer: () => {},1364            disableEventListener: () => {},1365            enableEventListener: () => {},1366            addInteraction: () => {},1367            removeInteraction: () => {},1368            getInteractions: () => ({1369                getLength: () => 01370            }),1371            getView: () => ({1372                getProjection: () => ({1373                    getCode: () => 'EPSG:3857'1374                })1375            })1376        };1377        const simplifiedCircle = new Feature({1378            geometry: new Polygon([[1379                [1260844.6064174946, 5858067.29727681],1380                [1260960.7874218025, 5857951.114737838],1381                [1260844.6064174946, 5857834.9352681665],1382                [1260728.4254131867, 5857951.114737838],1383                [1260844.6064174946, 5858067.29727681]1384            ]])1385        });1386        const support = ReactDOM.render(<DrawSupport drawMethod="Circle" map={fakeMap} options={{geodesic: true}}/>, document.getElementById("container"));1387        const featureData = support.fromOLFeature(simplifiedCircle);1388        expect(Math.round(featureData.radius)).toBe(80);1389    });1390    it('test endDrawing action', () => {1391        const fakeMap = {1392            addLayer: () => {},1393            removeLayer: () => {},1394            disableEventListener: () => {},1395            enableEventListener: () => {},1396            addInteraction: () => {},1397            removeInteraction: () => {},1398            getInteractions: () => ({1399                getLength: () => 01400            }),1401            getView: () => ({1402                getProjection: () => ({1403                    getCode: () => 'EPSG:3857'1404                })1405            })1406        };1407        const actions = {1408            onEndDrawing: () => {}1409        };1410        const spyonEndDrawing = expect.spyOn(actions, "onEndDrawing");1411        ReactDOM.render(<DrawSupport1412            drawMethod="Circle"1413            map={fakeMap}1414            features={[]}1415            onEndDrawing={actions.onEndDrawing}1416            options={{geodesic: true}}/>, document.getElementById("container"));1417        ReactDOM.render(<DrawSupport1418            drawMethod="Circle"1419            map={fakeMap}1420            features={[{1421                center: {x: -11271098, y: 7748880},1422                coordinates: [-11271098, 7748880],1423                projection: 'EPSG:3857',1424                radius: 2000000,1425                type: 'Polygon'1426            }]}1427            drawStatus="endDrawing"1428            onEndDrawing={actions.onEndDrawing}1429            options={{geodesic: true}}/>, document.getElementById("container"));1430        expect(spyonEndDrawing).toHaveBeenCalled();1431    });1432    it('test endDrawing action clear', () => {1433        const fakeMap = {1434            addLayer: () => {},1435            removeLayer: () => {},1436            disableEventListener: () => {},1437            enableEventListener: () => {},1438            addInteraction: () => {},1439            removeInteraction: () => {},1440            getInteractions: () => ({1441                getLength: () => 01442            }),1443            getView: () => ({1444                getProjection: () => ({1445                    getCode: () => 'EPSG:3857'1446                })1447            })1448        };1449        const radius = 2000000;1450        let properties = {1451            drawMethod: "Circle",1452            map: fakeMap,1453            features: [],1454            onEndDrawing: (feature, owner) => {1455                expect(feature).toExist();1456                expect(owner).toNotExist();1457                expect(feature.radius).toBe(radius);1458            },1459            options: {geodesic: true}1460        };1461        ReactDOM.render(<DrawSupport {...properties}/>, document.getElementById("container"));1462        let newProps = assign({}, properties, {1463            features: [{1464                center: {x: -11271098, y: 7748880},1465                coordinates: [-11271098, 7748880],1466                projection: 'EPSG:3857',1467                radius,1468                type: 'Polygon'1469            }],1470            drawStatus: "endDrawing"1471        });1472        ReactDOM.render(<DrawSupport {...newProps}/>, document.getElementById("container"));1473    });1474    it('test endDrawing action without features', () => {1475        const fakeMap = {1476            addLayer: () => {},1477            removeLayer: () => {},1478            disableEventListener: () => {},1479            enableEventListener: () => {},1480            addInteraction: () => {},1481            removeInteraction: () => {},1482            getInteractions: () => ({1483                getLength: () => 01484            }),1485            getView: () => ({1486                getProjection: () => ({1487                    getCode: () => 'EPSG:3857'1488                })1489            })1490        };1491        const actions = {1492            onEndDrawing: () => {}1493        };1494        const spyonEndDrawing = expect.spyOn(actions, "onEndDrawing");1495        ReactDOM.render(<DrawSupport1496            drawMethod="Circle"1497            map={fakeMap}1498            features={[]}1499            onEndDrawing={actions.onEndDrawing}1500            options={{geodesic: true}}/>, document.getElementById("container"));1501        ReactDOM.render(<DrawSupport1502            drawMethod="Circle"1503            map={fakeMap}1504            features={[]}1505            drawStatus="endDrawing"1506            onEndDrawing={actions.onEndDrawing}1507            options={{geodesic: true}}/>, document.getElementById("container"));1508        expect(spyonEndDrawing).toNotHaveBeenCalled();1509    });1510    it('edit a feature, then update its style', (done) => {1511        const fakeMap = {1512            addLayer: () => {},1513            removeLayer: () => {},1514            disableEventListener: () => {},1515            enableEventListener: () => {},1516            addInteraction: () => {},1517            updateOnlyFeatureStyles: () => {},1518            on: () => {},1519            removeInteraction: () => {},1520            getInteractions: () => ({1521                getLength: () => 01522            }),1523            getView: () => ({1524                getProjection: () => ({1525                    getCode: () => 'EPSG:4326'1526                })1527            })1528        };1529        const feature = {1530            type: 'Feature',1531            geometry: {1532                type: 'Polygon',1533                coordinates: [[1534                    [13, 43],1535                    [15, 43],1536                    [15, 44],1537                    [13, 44]1538                ]]1539            },1540            properties: {1541                name: "some name",1542                id: "a-unique-id"1543            },1544            style: [{1545                id: "style-id",1546                color: "#FF0000",1547                opacity: 1,1548                fillColor: "#0000FF",1549                fillOpacity: 11550            }]1551        };1552        const support = ReactDOM.render(1553            <DrawSupport features={[]} map={fakeMap}/>, document.getElementById("container"));1554        expect(support).toExist();1555        ReactDOM.render(1556            <DrawSupport1557                features={[feature]}1558                map={fakeMap}1559                drawStatus="drawOrEdit"1560                drawMethod="Polygon"1561                options={{1562                    drawEnabled: false,1563                    editEnabled: true1564                }}1565            />, document.getElementById("container"));1566        ReactDOM.render(1567            <DrawSupport1568                features={[{1569                    ...feature,1570                    style: [{1571                        id: "style-id",1572                        color: "#FFFFFF",1573                        opacity: 0.5,1574                        fillColor: "#FFFFFF",1575                        fillOpacity: 0.51576                    }]}]}1577                map={fakeMap}1578                drawStatus="updateStyle"1579                drawMethod="Polygon"1580                options={{1581                    drawEnabled: false,1582                    editEnabled: true1583                }}1584            />, document.getElementById("container"));1585        setTimeout( () => {1586            const drawnFt = support.drawLayer.getSource().getFeatures()[0];1587            expect(drawnFt.getStyle()).toExist();1588            expect(drawnFt.getStyle()()).toExist();1589            expect(drawnFt.getStyle()()[0].getStroke().getColor()).toEqual("rgba(255, 255, 255, 0.5)");1590            expect(drawnFt.getStyle()()[0].getFill().getColor()).toEqual("rgba(255, 255, 255, 0.5)");1591            done();1592        }, 100);1593    });1594    it('test draw callbacks in edit mode with Polygons feature', (done) => {1595        const feature = {1596            type: 'Feature',1597            geometry: {1598                type: 'Polygon',1599                coordinates: [[1600                    [13, 43],1601                    [15, 43],1602                    [15, 44],1603                    [13, 43]1604                ]]1605            },1606            properties: {1607                name: "some name",1608                id: "a-unique-id",1609                canEdit: true1610            },1611            style: [{1612                id: "style-id",1613                color: "#FF0000",1614                opacity: 1,1615                fillColor: "#0000FF",1616                fillOpacity: 11617            }]1618        };1619        const spyOnDrawingFeatures = expect.spyOn(testHandlers, "onDrawingFeatures");1620        let support = renderAndClick({1621            feature,1622            drawMethod: feature.geometry.type1623        });1624        expect(support).toExist();1625        expect(spyOnDrawingFeatures).toHaveBeenCalled();1626        const ft = spyOnDrawingFeatures.calls[0].arguments[0][0];1627        expect(ft.type).toBe("Feature");1628        expect(ft.geometry.type).toBe("Polygon");1629        expect(ft.properties).toEqual({1630            "name": "some name",1631            "id": "a-unique-id",1632            "canEdit": true1633        });1634        done();1635    });1636    it('test draw callbacks in edit mode with LineString feature', (done) => {1637        const feature = {1638            type: 'Feature',1639            geometry: {1640                type: 'LineString',1641                coordinates: [1642                    [13, 43],1643                    [15, 43],1644                    [15, 44],1645                    [13, 43]1646                ]1647            },1648            properties: {1649                name: "some name",1650                id: "a-unique-id",1651                canEdit: true1652            },1653            style: [{1654                id: "style-id",1655                color: "#FF0000",1656                opacity: 11657            }]1658        };1659        const spyOnDrawingFeatures = expect.spyOn(testHandlers, "onDrawingFeatures");1660        let support = renderAndClick({1661            feature,1662            drawMethod: feature.geometry.type1663        });1664        expect(support).toExist();1665        expect(spyOnDrawingFeatures).toHaveBeenCalled();1666        done();1667    });1668    it('test draw callbacks in edit mode with Text feature', (done) => {1669        const feature = {1670            type: 'Feature',1671            geometry: {1672                type: 'Point',1673                coordinates: [13, 43]1674            },1675            properties: {1676                name: "some name",1677                id: "a-unique-id",1678                valueText: "a text",1679                canEdit: true,1680                isText: true1681            },1682            style: [{1683                id: "style-id",1684                color: "#FF0000",1685                label: "a text",1686                opacity: 11687            }]1688        };1689        const spyOnDrawingFeatures = expect.spyOn(testHandlers, "onDrawingFeatures");1690        let support = renderAndClick({1691            feature,1692            drawMethod: "Text"1693        });1694        expect(support).toExist();1695        expect(spyOnDrawingFeatures).toHaveBeenCalled();1696        done();1697    });1698    it('test draw callbacks in edit mode with Circle feature', (done) => {1699        const feature = {1700            type: 'Feature',1701            geometry: {1702                type: 'Point',1703                coordinates: [13, 43]1704            },1705            properties: {1706                name: "some name",1707                id: "a-unique-id",1708                valueText: "a text",1709                canEdit: true,1710                radius: 1111,1711                isCircle: true1712            },1713            style: [{1714                id: "style-id",1715                color: "#FF0000",1716                opacity: 11717            }]1718        };1719        const spyOnDrawingFeatures = expect.spyOn(testHandlers, "onDrawingFeatures");1720        let support = renderAndClick({1721            feature,1722            drawMethod: "Circle"1723        });1724        expect(support).toExist();1725        expect(spyOnDrawingFeatures).toHaveBeenCalled();1726        done();1727    });1728    it('test drawend callbacks with Circle, transformed int feature collection', (done) => {1729        const spyOnDrawingFeatures = expect.spyOn(testHandlers, "onDrawingFeatures");1730        const spyOnGeometryChanged = expect.spyOn(testHandlers, "onGeometryChanged");1731        const spyOnEndDrawing = expect.spyOn(testHandlers, "onEndDrawing");1732        let support = renderDrawSupport();1733        support = renderDrawSupport({1734            features: [null],1735            drawMethod: "Circle",1736            drawStatus: "drawOrEdit",1737            options: {1738                transformToFeatureCollection: true,1739                drawEnabled: true1740            }1741        });1742        expect(support).toExist();1743        const center = [1300, 4300];1744        const radius = 1000;1745        support.drawInteraction.dispatchEvent({1746            type: 'drawend',1747            feature: new Feature({1748                geometry: new Circle(center, radius)1749            })1750        });1751        const drawOwner = null;1752        expect(spyOnDrawingFeatures).toHaveBeenCalled();1753        expect(spyOnGeometryChanged).toHaveBeenCalled();1754        expect(spyOnGeometryChanged.calls.length).toBe(1);1755        const ArgsGeometryChanged = spyOnGeometryChanged.calls[0].arguments;1756        expect(ArgsGeometryChanged.length).toBe(5);1757        expect(ArgsGeometryChanged[1]).toBe(drawOwner);1758        expect(ArgsGeometryChanged[2]).toEqual("");1759        expect(ArgsGeometryChanged[3]).toEqual(false);1760        expect(ArgsGeometryChanged[4]).toEqual(true);1761        expect(spyOnEndDrawing).toHaveBeenCalled();1762        expect(spyOnEndDrawing.calls.length).toBe(1);1763        const ArgsEndDrawing = spyOnEndDrawing.calls[0].arguments;1764        expect(ArgsEndDrawing.length).toBe(2);1765        expect(ArgsEndDrawing[1]).toBe(drawOwner);1766        expect(ArgsGeometryChanged[0][0]).toEqual(ArgsEndDrawing[0]);1767        done();1768    });1769    it('test drawend callbacks with Text, transformed int feature collection', (done) => {1770        const spyOnDrawingFeatures = expect.spyOn(testHandlers, "onDrawingFeatures");1771        const spyOnGeometryChanged = expect.spyOn(testHandlers, "onGeometryChanged");1772        const spyOnEndDrawing = expect.spyOn(testHandlers, "onEndDrawing");1773        let support = renderDrawSupport();1774        support = renderDrawSupport({1775            features: [null],1776            drawMethod: "Text",1777            drawStatus: "drawOrEdit",1778            options: {1779                transformToFeatureCollection: true,1780                stopAfterDrawing: true,1781                drawEnabled: true1782            }1783        });1784        expect(support).toExist();1785        const coordinate = [1300, 4300];1786        support.drawInteraction.dispatchEvent({1787            type: 'drawend',1788            feature: new Feature({1789                geometry: new Point(coordinate)1790            })1791        });1792        const drawOwner = null;1793        expect(spyOnDrawingFeatures).toHaveBeenCalled();1794        expect(spyOnGeometryChanged).toHaveBeenCalled();1795        expect(spyOnGeometryChanged.calls.length).toBe(1);1796        const ArgsGeometryChanged = spyOnGeometryChanged.calls[0].arguments;1797        expect(ArgsGeometryChanged.length).toBe(5);1798        expect(ArgsGeometryChanged[1]).toBe(drawOwner);1799        expect(ArgsGeometryChanged[2]).toEqual("enterEditMode");1800        expect(ArgsGeometryChanged[3]).toEqual(true);1801        expect(ArgsGeometryChanged[4]).toEqual(false);1802        expect(spyOnEndDrawing).toHaveBeenCalled();1803        expect(spyOnEndDrawing.calls.length).toBe(1);1804        const ArgsEndDrawing = spyOnEndDrawing.calls[0].arguments;1805        expect(ArgsEndDrawing.length).toBe(2);1806        expect(ArgsEndDrawing[1]).toBe(drawOwner);1807        expect(ArgsGeometryChanged[0][0]).toEqual(ArgsEndDrawing[0]);1808        expect(ArgsEndDrawing[0].features[0].properties.isText).toBe(true);1809        expect(ArgsEndDrawing[0].features[0].properties.valueText).toBe(".");1810        done();1811    });1812    it('test drawend callbacks with Polygon, transformed int feature collection', (done) => {1813        const spyOnDrawingFeatures = expect.spyOn(testHandlers, "onDrawingFeatures");1814        const spyOnGeometryChanged = expect.spyOn(testHandlers, "onGeometryChanged");1815        const spyOnEndDrawing = expect.spyOn(testHandlers, "onEndDrawing");1816        let support = renderDrawSupport();1817        support = renderDrawSupport({1818            features: [null],1819            drawMethod: "Polygon",1820            drawStatus: "drawOrEdit",1821            options: {1822                transformToFeatureCollection: true,1823                stopAfterDrawing: true,1824                drawEnabled: true1825            }1826        });1827        expect(support).toExist();1828        support.drawInteraction.dispatchEvent({1829            type: 'drawend',1830            feature: new Feature({1831                geometry: new Polygon([[[1300, 4300], [8, 9], [8, 59]]])1832            })1833        });1834        const drawOwner = null;1835        expect(spyOnDrawingFeatures).toHaveBeenCalled();1836        expect(spyOnGeometryChanged).toHaveBeenCalled();1837        expect(spyOnGeometryChanged.calls.length).toBe(1);1838        const ArgsGeometryChanged = spyOnGeometryChanged.calls[0].arguments;1839        expect(ArgsGeometryChanged.length).toBe(5);1840        expect(ArgsGeometryChanged[1]).toBe(drawOwner);1841        expect(ArgsGeometryChanged[2]).toEqual("enterEditMode");1842        expect(ArgsGeometryChanged[3]).toEqual(false);1843        expect(ArgsGeometryChanged[4]).toEqual(false);1844        expect(spyOnEndDrawing).toHaveBeenCalled();1845        expect(spyOnEndDrawing.calls.length).toBe(1);1846        const ArgsEndDrawing = spyOnEndDrawing.calls[0].arguments;1847        expect(ArgsEndDrawing.length).toBe(2);1848        expect(ArgsEndDrawing[1]).toBe(drawOwner);1849        expect(ArgsGeometryChanged[0][0]).toEqual(ArgsEndDrawing[0]);1850        expect(ArgsEndDrawing[0].features[0].geometry.coordinates[0].length).toBe(4);1851        done();1852    });1853    it('test drawend callbacks with LineString, transformed int feature collection', (done) => {1854        const spyOnDrawingFeatures = expect.spyOn(testHandlers, "onDrawingFeatures");1855        const spyOnGeometryChanged = expect.spyOn(testHandlers, "onGeometryChanged");1856        const spyOnEndDrawing = expect.spyOn(testHandlers, "onEndDrawing");1857        let support = renderDrawSupport();1858        support = renderDrawSupport({1859            features: [null],1860            drawMethod: "LineString",1861            drawStatus: "drawOrEdit",1862            options: {1863                transformToFeatureCollection: true,1864                drawEnabled: true1865            }1866        });1867        expect(support).toExist();1868        support.drawInteraction.dispatchEvent({1869            type: 'drawend',1870            feature: new Feature({1871                geometry: new LineString([[1300, 4300], [8, 9], [8, 59]])1872            })1873        });1874        const drawOwner = null;1875        expect(spyOnDrawingFeatures).toHaveBeenCalled();1876        expect(spyOnGeometryChanged).toHaveBeenCalled();1877        expect(spyOnGeometryChanged.calls.length).toBe(1);1878        const ArgsGeometryChanged = spyOnGeometryChanged.calls[0].arguments;1879        expect(ArgsGeometryChanged.length).toBe(5);1880        expect(ArgsGeometryChanged[3]).toEqual(false);1881        expect(ArgsGeometryChanged[4]).toEqual(false);1882        expect(spyOnEndDrawing).toHaveBeenCalled();1883        expect(spyOnEndDrawing.calls.length).toBe(1);1884        const ArgsEndDrawing = spyOnEndDrawing.calls[0].arguments;1885        expect(ArgsEndDrawing.length).toBe(2);1886        expect(ArgsEndDrawing[1]).toBe(drawOwner);1887        expect(ArgsGeometryChanged[0][0]).toEqual(ArgsEndDrawing[0]);1888        expect(ArgsEndDrawing[0].features[0].geometry.coordinates.length).toBe(3);1889        done();1890    });1891    it('test drawend callbacks with Circle, exported as geomColl', (done) => {1892        const spyOnGeometryChanged = expect.spyOn(testHandlers, "onGeometryChanged");1893        const spyOnEndDrawing = expect.spyOn(testHandlers, "onEndDrawing");1894        let support = renderDrawSupport();1895        support = renderDrawSupport({1896            drawMethod: "Circle",1897            drawStatus: "drawOrEdit",1898            features: [geomCollFeature],1899            options: {1900                transformToFeatureCollection: false,1901                drawEnabled: true1902            }1903        });1904        expect(support).toExist();1905        const center = [1300, 4300];1906        const radius = 1000;1907        support.drawInteraction.dispatchEvent({1908            type: 'drawend',1909            feature: new Feature({1910                geometry: new Circle(center, radius)1911            })1912        });1913        expect(spyOnGeometryChanged).toHaveBeenCalled();1914        expect(spyOnGeometryChanged.calls.length).toBe(1);1915        const ArgsGeometryChanged = spyOnGeometryChanged.calls[0].arguments;1916        expect(ArgsGeometryChanged.length).toBe(5);1917        expect(spyOnEndDrawing).toHaveBeenCalled();1918        expect(spyOnEndDrawing.calls.length).toBe(1);1919        const ArgsEndDrawing = spyOnEndDrawing.calls[0].arguments;1920        expect(ArgsEndDrawing.length).toBe(2);1921        expect(ArgsEndDrawing[1]).toBe(null);1922        expect(ArgsEndDrawing[0].geometry.type).toBe("GeometryCollection");1923        expect(ArgsEndDrawing[0].geometry.geometries.length).toBe(2);1924        done();1925    });1926    it('test drawend callbacks with MultiLineString, exported as geomColl', (done) => {1927        const spyOnGeometryChanged = expect.spyOn(testHandlers, "onGeometryChanged");1928        const spyOnEndDrawing = expect.spyOn(testHandlers, "onEndDrawing");1929        let support = renderDrawSupport();1930        support = renderDrawSupport({1931            drawMethod: "MultiLineString",1932            drawStatus: "drawOrEdit",1933            features: [geomCollFeature],1934            options: {1935                transformToFeatureCollection: false,1936                drawEnabled: true1937            }1938        });1939        expect(support).toExist();1940        support.drawInteraction.dispatchEvent({1941            type: 'drawend',1942            feature: new Feature({1943                geometry: new MultiLineString([[[1300, 4300], [8, 9], [8, 59]]])1944            })1945        });1946        expect(spyOnGeometryChanged).toHaveBeenCalled();1947        expect(spyOnGeometryChanged.calls.length).toBe(1);1948        const ArgsGeometryChanged = spyOnGeometryChanged.calls[0].arguments;1949        expect(ArgsGeometryChanged.length).toBe(5);1950        expect(spyOnEndDrawing).toHaveBeenCalled();1951        expect(spyOnEndDrawing.calls.length).toBe(1);1952        const ArgsEndDrawing = spyOnEndDrawing.calls[0].arguments;1953        expect(ArgsEndDrawing.length).toBe(2);1954        expect(ArgsEndDrawing[0].geometry.type).toBe("GeometryCollection");1955        expect(ArgsEndDrawing[0].geometry.geometries.length).toBe(2);1956        done();1957    });1958    it('test drawend callbacks with MultiPolygon, exported as geomColl', (done) => {1959        const spyOnGeometryChanged = expect.spyOn(testHandlers, "onGeometryChanged");1960        const spyOnEndDrawing = expect.spyOn(testHandlers, "onEndDrawing");1961        let support = renderDrawSupport();1962        support = renderDrawSupport({1963            drawMethod: "MultiPolygon",1964            drawStatus: "drawOrEdit",1965            features: [geomCollFeature],1966            options: {1967                transformToFeatureCollection: false,1968                drawEnabled: true1969            }1970        });1971        expect(support).toExist();1972        support.drawInteraction.dispatchEvent({1973            type: 'drawend',1974            feature: new Feature({1975                geometry: new MultiPolygon([[[[1300, 4300], [1300, 5300], [1380, 4380], [1300, 4300]]]])1976            })1977        });1978        expect(spyOnGeometryChanged).toHaveBeenCalled();1979        expect(spyOnGeometryChanged.calls.length).toBe(1);1980        const ArgsGeometryChanged = spyOnGeometryChanged.calls[0].arguments;1981        expect(ArgsGeometryChanged.length).toBe(5);1982        expect(spyOnEndDrawing).toHaveBeenCalled();1983        expect(spyOnEndDrawing.calls.length).toBe(1);1984        const ArgsEndDrawing = spyOnEndDrawing.calls[0].arguments;1985        expect(ArgsEndDrawing.length).toBe(2);1986        expect(ArgsEndDrawing[0].geometry.type).toBe("GeometryCollection");1987        expect(ArgsEndDrawing[0].geometry.geometries.length).toBe(2);1988        done();1989    });1990    it('test drawend callbacks with MultiPoint, exported as geomColl', (done) => {1991        const spyOnGeometryChanged = expect.spyOn(testHandlers, "onGeometryChanged");1992        const spyOnEndDrawing = expect.spyOn(testHandlers, "onEndDrawing");1993        let support = renderDrawSupport();1994        support = renderDrawSupport({1995            drawMethod: "MultiPoint",1996            drawStatus: "drawOrEdit",1997            features: [geomCollFeature],1998            options: {1999                transformToFeatureCollection: false,2000                drawEnabled: true2001            }2002        });2003        expect(support).toExist();2004        support.drawInteraction.dispatchEvent({2005            type: 'drawend',2006            feature: new Feature({2007                geometry: new MultiPoint([[1300, 4300]])2008            })2009        });2010        expect(spyOnGeometryChanged).toHaveBeenCalled();2011        expect(spyOnGeometryChanged.calls.length).toBe(1);2012        const ArgsGeometryChanged = spyOnGeometryChanged.calls[0].arguments;2013        expect(ArgsGeometryChanged.length).toBe(5);2014        expect(spyOnEndDrawing).toHaveBeenCalled();2015        expect(spyOnEndDrawing.calls.length).toBe(1);2016        const ArgsEndDrawing = spyOnEndDrawing.calls[0].arguments;2017        expect(ArgsEndDrawing.length).toBe(2);2018        expect(ArgsEndDrawing[0].geometry.type).toBe("GeometryCollection");2019        expect(ArgsEndDrawing[0].geometry.geometries.length).toBe(2);2020        done();2021    });2022    it('test select interaction, retrieving a drawn feature', (done) => {2023        const spyOnSelectFeatures = expect.spyOn(testHandlers, "onSelectFeatures");2024        let support = renderDrawSupport();2025        support = renderDrawSupport({2026            drawMethod: "LineString",2027            drawStatus: "drawOrEdit",2028            features: [geomCollFeature],2029            options: {2030                selected: geomCollFeature,2031                transformToFeatureCollection: false,2032                selectEnabled: true2033            }2034        });2035        expect(support).toExist();2036        const feature = new Feature({2037            geometry: new Point(13.0, 43.0),2038            name: 'My Point'2039        });2040        support.selectInteraction.dispatchEvent({2041            type: 'select',2042            feature: feature2043        });2044        expect(spyOnSelectFeatures).toHaveBeenCalled();2045        done();2046    });2047    it('test modifyend event for modifyInteraction with Circle, exported FeatureCollection', (done) => {2048        const spyOnGeometryChanged = expect.spyOn(testHandlers, "onGeometryChanged");2049        const spyOnDrawingFeatures = expect.spyOn(testHandlers, "onDrawingFeatures");2050        let support = renderDrawSupport();2051        support = renderDrawSupport({2052            drawMethod: "Circle",2053            drawStatus: "drawOrEdit",2054            features: [geomCollFeature],2055            options: {2056                transformToFeatureCollection: true,2057                editEnabled: true2058            }2059        });2060        expect(support).toExist();2061        const center = [1300, 4300];2062        const radius = 1000;2063        support.modifyInteraction.dispatchEvent({2064            type: 'modifyend',2065            features: new Collection(2066                [new Feature({2067                    geometry: new Circle(center, radius)2068                })]2069            )2070        });2071        expect(spyOnGeometryChanged).toNotHaveBeenCalled();2072        expect(spyOnDrawingFeatures).toHaveBeenCalled();2073        expect(spyOnDrawingFeatures.calls.length).toBe(1);2074        const ArgsEndDrawing = spyOnDrawingFeatures.calls[0].arguments;2075        expect(ArgsEndDrawing.length).toBe(1);2076        done();2077    });2078    it('test modifyend event for modifyInteraction with Circle, exported FeatureCollection', (done) => {2079        const spyOnGeometryChanged = expect.spyOn(testHandlers, "onGeometryChanged");2080        const spyOnDrawingFeatures = expect.spyOn(testHandlers, "onDrawingFeatures");2081        let support = renderDrawSupport();2082        support = renderDrawSupport({2083            drawMethod: "Circle",2084            drawStatus: "drawOrEdit",2085            features: [geomCollFeature],2086            options: {2087                transformToFeatureCollection: false,2088                editEnabled: true2089            }2090        });2091        expect(support).toExist();2092        const center = [1300, 4300];2093        const radius = 1000;2094        support.modifyInteraction.dispatchEvent({2095            type: 'modifyend',2096            features: new Collection(2097                [new Feature({2098                    geometry: new Circle(center, radius)2099                })]2100            )2101        });2102        expect(spyOnGeometryChanged).toHaveBeenCalled();2103        expect(spyOnDrawingFeatures).toNotHaveBeenCalled();2104        done();2105    });2106    it('test drawPropertiesForGeometryType for BBOX', (done) => {2107        let support = renderDrawSupport();2108        support = renderDrawSupport({2109            drawMethod: "BBOX",2110            drawStatus: "start",2111            features: [],2112            options: {2113                transformToFeatureCollection: false,2114                editEnabled: true2115            }2116        });2117        expect(support).toExist();2118        const geometryType = "BBOX";2119        const maxPoints = null;2120        const source = support.drawSource;2121        const newProps = {};2122        const drawProps = support.drawPropertiesForGeometryType(geometryType, maxPoints, source, newProps);2123        expect(drawProps).toExist();2124        expect(drawProps.maxPoints).toBe(2);2125        const olGeom = drawProps.geometryFunction([1, 3], null);2126        expect(olGeom).toExist();2127        done();2128    });2129    it('test drawPropertiesForGeometryType for Circle', (done) => {2130        let support = renderDrawSupport();2131        support = renderDrawSupport({2132            drawMethod: "Circle",2133            drawStatus: "start",2134            features: [],2135            options: {2136                transformToFeatureCollection: false,2137                editEnabled: true,2138                geodesic: true2139            }2140        });2141        expect(support).toExist();2142        const geometryType = "Circle";2143        const maxPoints = null;2144        const source = support.drawSource;2145        const drawProps = support.drawPropertiesForGeometryType(geometryType, maxPoints, source, {options: {2146            geodesic: true2147        }});2148        expect(drawProps).toExist();2149        expect(drawProps.maxPoints).toBe(100);2150        const olGeom = drawProps.geometryFunction([[[1, 3], [1, 3]]], null);2151        expect(olGeom).toExist();2152        done();2153    });2154    it('test drawend callbacks with Point', (done) => {2155        const spyOnGeometryChanged = expect.spyOn(testHandlers, "onGeometryChanged");2156        const spyOnChangeDrawingStatus = expect.spyOn(testHandlers, "onChangeDrawingStatus");2157        const spyOnEndDrawing = expect.spyOn(testHandlers, "onEndDrawing");2158        let support = renderDrawSupport();2159        support = renderDrawSupport({2160            drawMethod: "Point",2161            drawStatus: "drawOrEdit",2162            owner: 'featureGrid',2163            features: [{2164                type: 'Feature',2165                geometry: {2166                    type: 'Point',2167                    coordinates: [2168                        -50.05371093750001,2169                        36.6860412765819252170                    ]2171                },2172                properties: {2173                    id: '4b79a3a0-0c63-11ea-a9c6-03246c187986'2174                },2175                id: '48f4a670-0c63-11ea-a9c6-03246c187986',2176                _new: true2177            }],2178            options: {2179                featureProjection: 'EPSG:4326',2180                stopAfterDrawing: true,2181                editEnabled: false,2182                drawEnabled: true2183            }2184        });2185        expect(support).toExist();2186        const center = [1300, 4300];2187        support.drawInteraction.dispatchEvent({2188            type: 'drawend',2189            feature: new Feature({2190                geometry: new Point(center)2191            })2192        });2193        expect(spyOnGeometryChanged).toHaveBeenCalled();2194        expect(spyOnGeometryChanged.calls.length).toBe(1);2195        const ArgsGeometryChanged = spyOnGeometryChanged.calls[0].arguments;2196        expect(ArgsGeometryChanged.length).toBe(5);2197        expect(spyOnEndDrawing).toHaveBeenCalled();2198        expect(spyOnEndDrawing.calls.length).toBe(1);2199        const ArgsEndDrawing = spyOnEndDrawing.calls[0].arguments;2200        expect(ArgsEndDrawing.length).toBe(2);2201        expect(ArgsEndDrawing[1]).toBe(null);2202        expect(ArgsEndDrawing[0].type).toBe("Point");2203        expect(spyOnChangeDrawingStatus).toHaveBeenCalled();2204        expect(spyOnChangeDrawingStatus.calls.length).toBe(1);2205        const ArgsChangeDrawingStatus = spyOnChangeDrawingStatus.calls[0].arguments;2206        expect(ArgsChangeDrawingStatus.length).toBe(4);2207        const features = ArgsChangeDrawingStatus[3];2208        expect(features.length).toBe(2);2209        features.forEach(({type}) => {2210            expect(type).toBe("Feature");2211        });2212        done();2213    });...

ContextModule.js

Source:ContextModule.js

...274				map[dep.userRequest] = dep.module.id;275				return map;276			}, Object.create(null));277	}278	getFakeMap(dependencies) {279		if (!this.options.namespaceObject) {280			return 9;281		}282		// if we filter first we get a new array283		// therefor we dont need to create a clone of dependencies explicitly284		// therefore the order of this is !important!285		let hasNonHarmony = false;286		let hasNamespace = false;287		let hasNamed = false;288		const fakeMap = dependencies289			.filter(dependency => dependency.module)290			.sort((a, b) => {291				return b.module.id - a.module.id;292			})293			.reduce((map, dep) => {294				const exportsType =295					dep.module.buildMeta && dep.module.buildMeta.exportsType;296				const id = dep.module.id;297				if (!exportsType) {298					map[id] = this.options.namespaceObject === "strict" ? 1 : 7;299					hasNonHarmony = true;300				} else if (exportsType === "namespace") {301					map[id] = 9;302					hasNamespace = true;303				} else if (exportsType === "named") {304					map[id] = 3;305					hasNamed = true;306				}307				return map;308			}, Object.create(null));309		if (!hasNamespace && hasNonHarmony && !hasNamed) {310			return this.options.namespaceObject === "strict" ? 1 : 7;311		}312		if (hasNamespace && !hasNonHarmony && !hasNamed) {313			return 9;314		}315		if (!hasNamespace && !hasNonHarmony && hasNamed) {316			return 3;317		}318		if (!hasNamespace && !hasNonHarmony && !hasNamed) {319			return 9;320		}321		return fakeMap;322	}323	getFakeMapInitStatement(fakeMap) {324		return typeof fakeMap === "object"325			? `var fakeMap = ${JSON.stringify(fakeMap, null, "\t")};`326			: "";327	}328	getReturn(type) {329		if (type === 9) {330			return "__webpack_require__(id)";331		}332		return `__webpack_require__.t(id, ${type})`;333	}334	getReturnModuleObjectSource(fakeMap, fakeMapDataExpression = "fakeMap[id]") {335		if (typeof fakeMap === "number") {336			return `return ${this.getReturn(fakeMap)};`;337		}338		return `return __webpack_require__.t(id, ${fakeMapDataExpression})`;339	}340	getSyncSource(dependencies, id) {341		const map = this.getUserRequestMap(dependencies);342		const fakeMap = this.getFakeMap(dependencies);343		const returnModuleObject = this.getReturnModuleObjectSource(fakeMap);344		return `var map = ${JSON.stringify(map, null, "\t")};345${this.getFakeMapInitStatement(fakeMap)}346function webpackContext(req) {347	var id = webpackContextResolve(req);348	${returnModuleObject}349}350function webpackContextResolve(req) {351	if(!__webpack_require__.o(map, req)) {352		var e = new Error("Cannot find module '" + req + "'");353		e.code = 'MODULE_NOT_FOUND';354		throw e;355	}356	return map[req];357}358webpackContext.keys = function webpackContextKeys() {359	return Object.keys(map);360};361webpackContext.resolve = webpackContextResolve;362module.exports = webpackContext;363webpackContext.id = ${JSON.stringify(id)};`;364	}365	getWeakSyncSource(dependencies, id) {366		const map = this.getUserRequestMap(dependencies);367		const fakeMap = this.getFakeMap(dependencies);368		const returnModuleObject = this.getReturnModuleObjectSource(fakeMap);369		return `var map = ${JSON.stringify(map, null, "\t")};370${this.getFakeMapInitStatement(fakeMap)}371function webpackContext(req) {372	var id = webpackContextResolve(req);373	if(!__webpack_require__.m[id]) {374		var e = new Error("Module '" + req + "' ('" + id + "') is not available (weak dependency)");375		e.code = 'MODULE_NOT_FOUND';376		throw e;377	}378	${returnModuleObject}379}380function webpackContextResolve(req) {381	if(!__webpack_require__.o(map, req)) {382		var e = new Error("Cannot find module '" + req + "'");383		e.code = 'MODULE_NOT_FOUND';384		throw e;385	}386	return map[req];387}388webpackContext.keys = function webpackContextKeys() {389	return Object.keys(map);390};391webpackContext.resolve = webpackContextResolve;392webpackContext.id = ${JSON.stringify(id)};393module.exports = webpackContext;`;394	}395	getAsyncWeakSource(dependencies, id) {396		const map = this.getUserRequestMap(dependencies);397		const fakeMap = this.getFakeMap(dependencies);398		const returnModuleObject = this.getReturnModuleObjectSource(fakeMap);399		return `var map = ${JSON.stringify(map, null, "\t")};400${this.getFakeMapInitStatement(fakeMap)}401function webpackAsyncContext(req) {402	return webpackAsyncContextResolve(req).then(function(id) {403		if(!__webpack_require__.m[id]) {404			var e = new Error("Module '" + req + "' ('" + id + "') is not available (weak dependency)");405			e.code = 'MODULE_NOT_FOUND';406			throw e;407		}408		${returnModuleObject}409	});410}411function webpackAsyncContextResolve(req) {412	// Here Promise.resolve().then() is used instead of new Promise() to prevent413	// uncaught exception popping up in devtools414	return Promise.resolve().then(function() {415		if(!__webpack_require__.o(map, req)) {416			var e = new Error("Cannot find module '" + req + "'");417			e.code = 'MODULE_NOT_FOUND';418			throw e;419		}420		return map[req];421	});422}423webpackAsyncContext.keys = function webpackAsyncContextKeys() {424	return Object.keys(map);425};426webpackAsyncContext.resolve = webpackAsyncContextResolve;427webpackAsyncContext.id = ${JSON.stringify(id)};428module.exports = webpackAsyncContext;`;429	}430	getEagerSource(dependencies, id) {431		const map = this.getUserRequestMap(dependencies);432		const fakeMap = this.getFakeMap(dependencies);433		const thenFunction =434			fakeMap !== 9435				? `function(id) {436		${this.getReturnModuleObjectSource(fakeMap)}437	}`438				: "__webpack_require__";439		return `var map = ${JSON.stringify(map, null, "\t")};440${this.getFakeMapInitStatement(fakeMap)}441function webpackAsyncContext(req) {442	return webpackAsyncContextResolve(req).then(${thenFunction});443}444function webpackAsyncContextResolve(req) {445	// Here Promise.resolve().then() is used instead of new Promise() to prevent446	// uncaught exception popping up in devtools447	return Promise.resolve().then(function() {448		if(!__webpack_require__.o(map, req)) {449			var e = new Error("Cannot find module '" + req + "'");450			e.code = 'MODULE_NOT_FOUND';451			throw e;452		}453		return map[req];454	});455}456webpackAsyncContext.keys = function webpackAsyncContextKeys() {457	return Object.keys(map);458};459webpackAsyncContext.resolve = webpackAsyncContextResolve;460webpackAsyncContext.id = ${JSON.stringify(id)};461module.exports = webpackAsyncContext;`;462	}463	getLazyOnceSource(block, dependencies, id, runtimeTemplate) {464		const promise = runtimeTemplate.blockPromise({465			block,466			message: "lazy-once context"467		});468		const map = this.getUserRequestMap(dependencies);469		const fakeMap = this.getFakeMap(dependencies);470		const thenFunction =471			fakeMap !== 9472				? `function(id) {473		${this.getReturnModuleObjectSource(fakeMap)};474	}`475				: "__webpack_require__";476		return `var map = ${JSON.stringify(map, null, "\t")};477${this.getFakeMapInitStatement(fakeMap)}478function webpackAsyncContext(req) {479	return webpackAsyncContextResolve(req).then(${thenFunction});480}481function webpackAsyncContextResolve(req) {482	return ${promise}.then(function() {483		if(!__webpack_require__.o(map, req)) {484			var e = new Error("Cannot find module '" + req + "'");485			e.code = 'MODULE_NOT_FOUND';486			throw e;487		}488		return map[req];489	});490}491webpackAsyncContext.keys = function webpackAsyncContextKeys() {492	return Object.keys(map);493};494webpackAsyncContext.resolve = webpackAsyncContextResolve;495webpackAsyncContext.id = ${JSON.stringify(id)};496module.exports = webpackAsyncContext;`;497	}498	getLazySource(blocks, id) {499		let hasMultipleOrNoChunks = false;500		let hasNoChunk = true;501		const fakeMap = this.getFakeMap(blocks.map(b => b.dependencies[0]));502		const hasFakeMap = typeof fakeMap === "object";503		const map = blocks504			.filter(block => block.dependencies[0].module)505			.map(block => {506				const chunks = block.chunkGroup ? block.chunkGroup.chunks : [];507				if (chunks.length > 0) {508					hasNoChunk = false;509				}510				if (chunks.length !== 1) {511					hasMultipleOrNoChunks = true;512				}513				return {514					dependency: block.dependencies[0],515					block: block,...

Using AI Code Generation

1const chai = require('chai');2const chaiAsPromised = require('chai-as-promised');3chai.use(chaiAsPromised);4const expect = chai.expect;5const sinon = require('sinon');6const sinonChai = require('sinon-chai');7chai.use(sinonChai);8const {FakeMap} = require('sinon');9const {myMethod} = require('./myMethod');10describe('myMethod', () => {11  it('should do something', async () => {12    const fakeMap = new FakeMap();13    const fakeMapStub = sinon.stub().returns(fakeMap);14    const myMethodSpy = sinon.spy(myMethod);15    const myMethodStub = sinon.stub(myMethod, 'myMethod').callsFake(fakeMapStub);16    const result = await myMethod.myMethod();17    expect(result).to.be.equal(fakeMap);18    expect(myMethodSpy).to.have.been.calledOnce;19    expect(myMethodStub).to.have.been.calledOnce;20    expect(fakeMapStub).to.have.been.calledOnce;21  });22});

Using AI Code Generation

1var chai = require('chai');2chai.use(require('chai-fakemap'));3var expect = chai.expect;4var sinon = require('sinon');5var sinonChai = require('sinon-chai');6chai.use(sinonChai);7var chaiAsPromised = require('chai-as-promised');8chai.use(chaiAsPromised);9var chaiHttp = require('chai-http');10chai.use(chaiHttp);11var chaiThings = require('chai-things');12chai.use(chaiThings);13var chaiSpies = require('chai-spies');14chai.use(chaiSpies);15var chaiArrays = require('chai-arrays');16chai.use(chaiArrays);17var chaiDateTime = require('chai-datetime');18chai.use(chaiDateTime);19var chaiFs = require('chai-fs');20chai.use(chaiFs);21var chaiXml = require('chai-xml');22chai.use(chaiXml);23var chaiJquery = require('chai-jquery');24chai.use(chaiJquery);25var chaiString = require('chai-string');26chai.use(chaiString);27var chaiImmutable = require('chai-immutable');28chai.use(chaiImmutable);29var chaiSubset = require('chai-subset');30chai.use(chaiSubset);31var chaiEnzyme = require('chai-enzyme');32chai.use(chaiEnzyme);33var chaiJsonSchema = require('chai-json-schema');34chai.use(chaiJsonSchema);35var chaiLike = require('chai-like');36chai.use(chaiLike);37var chaiShallowDeepEqual = require('chai-shallow-deep-equal');38chai.use(chaiShallowDeepEqual);39var chaiAsPromised = require('chai-as-promised');40chai.use(chaiAs

Using AI Code Generation

1const chai = require('chai');2const chaiAsPromised = require('chai-as-promised');3chai.use(chaiAsPromised);4const expect = chai.expect;5const myCode = require('../myCode.js');6describe('myCode', function() {7  it('should return true', function() {8    return expect(myCode()).to.be.true;9  });10});11module.exports = function() {12  return true;13};14const chai = require('chai');15const chaiAsPromised = require('chai-as-promised');16chai.use(chaiAsPromised);17const expect = chai.expect;18const myCode = require('../myCode.js');19describe('myCode', function() {20  it('should return true', function(done) {21    myCode().then(function(result) {22      expect(result).to.be.true;23      done();24    });25  });26});27module.exports = function() {28  return new Promise(function(resolve, reject) {29    resolve(true);30  });31};

Using AI Code Generation

1var FakeMap = require('fakemap');2var map = new FakeMap();3  .set('foo', 'bar')4  .set('baz', 'qux')5  .set('quux', 'quuz')6  .set('corge', 'grault')7  .set('garply', 'waldo')8  .set('fred', 'plugh')9  .set('xyzzy', 'thud')10  .set('foo', 'bar')11  .set('baz', 'qux')12  .set('quux', 'quuz')13  .set('corge', 'grault')14  .set('garply', 'waldo')15  .set('fred', 'plugh')16  .set('xyzzy', 'thud')17  .set('foo', 'bar')18  .set('baz', 'qux')19  .set('quux', 'quuz')20  .set('corge', 'grault')21  .set('garply', 'waldo')22  .set('fred', 'plugh')23  .set('xyzzy', 'thud')24  .set('foo', 'bar')25  .set('baz', 'qux')26  .set('quux', 'quuz')27  .set('corge', 'grault')28  .set('garply', 'waldo')29  .set('fred', 'plugh')30  .set('xyzzy', 'thud')31  .set('foo', 'bar')32  .set('baz', 'qux')33  .set('quux', 'quuz')34  .set('corge', 'grault')35  .set('garply', 'waldo')36  .set('fred', 'plugh')37  .set('xyzzy', 'thud')38  .set('foo', 'bar')39  .set('baz', 'qux')40  .set('quux', 'quuz')41  .set('corge', 'grault')42  .set('garply', 'waldo')43  .set('fred', 'plugh')44  .set('xyzzy', 'thud')45  .set('foo', 'bar')46  .set('baz', 'qux')47  .set('quux', 'quuz')48  .set('corge', 'grault')

Using AI Code Generation

1let map = new FakeMap()2map.set('a', 1).set('b', 2).set('c', 3).set('d', 4)3let map = new Map()4map.set('a', 1).set('b', 2).set('c', 3).set('d', 4)5let map = new FakeMap()6let map1 = map.set('a', 1)7let map2 = map1.set('b', 2)8let map3 = map2.set('c', 3)9let map4 = map3.set('d', 4)10let map = new Map()11let map1 = map.set('a', 1)12let map2 = map1.set('b', 2)13let map3 = map2.set('c', 3)14let map4 = map3.set('d', 4)15let map = new FakeMap()16let map1 = map.set('a', 1).set('b', 2)17let map2 = map1.set('c', 3).set('d', 4)18let map = new Map()19let map1 = map.set('a', 1).set('b', 2)20let map2 = map1.set('c', 3).set('d', 4)21let map = new FakeMap()22let map1 = map.set('a', 1).set('b', 2)23let map2 = map1.set('c', 3)24let map3 = map2.set('d', 4)25let map = new Map()26let map1 = map.set('a', 1).set('b', 2)27let map2 = map1.set('c', 3)28let map3 = map2.set('d', 4)29let map = new FakeMap()30let map1 = map.set('a', 1).set('b', 2).set('c', 3)31let map2 = map1.set('d

Using AI Code Generation

1var FakeMap = require('chai').FakeMap;2var chai = require('chai');3chai.use(FakeMap);4var Map = require('Map');5var myMap = new Map();6myMap.set('a', '1');7myMap.set('b', '2');8myMap.set('c', '3');9myMap.set('d', '4');10myMap.set('e', '5');11var expect = chai.expect;12expect(myMap).to.have.fakeMap([13]);14var FakeMap = require('chai').FakeMap;15var chai = require('chai');16chai.use(FakeMap);17var Map = require('Map');18var myMap = new Map();19myMap.set('a', '1');20myMap.set('b', '2');21myMap.set('c', '3');22myMap.set('d', '4');23myMap.set('e', '5');24var expect = chai.expect;25expect(myMap).to.have.fakeMap([26]);27The MIT License (MIT)

Automation Testing Tutorials

Learn to execute automation testing from scratch with LambdaTest Learning Hub. Right from setting up the prerequisites to run your first automation test, to following best practices and diving deeper into advanced test scenarios. LambdaTest Learning Hubs compile a list of step-by-step guides to help you be proficient with different test automation frameworks i.e. Selenium, Cypress, TestNG etc.