How to use FakeMap method in chai

Best JavaScript code snippet using chai

DrawSupport-test.jsx

Source:DrawSupport-test.jsx Github

copy

Full Screen

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 });...

Full Screen

Full Screen

ContextModule.js

Source:ContextModule.js Github

copy

Full Screen

...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,...

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

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});

Full Screen

Using AI Code Generation

copy

Full Screen

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

Full Screen

Using AI Code Generation

copy

Full Screen

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};

Full Screen

Using AI Code Generation

copy

Full Screen

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')

Full Screen

Using AI Code Generation

copy

Full Screen

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

Full Screen

Using AI Code Generation

copy

Full Screen

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)

Full Screen

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.

LambdaTest Learning Hubs:

YouTube

You could also refer to video tutorials over LambdaTest YouTube channel to get step by step demonstration from industry experts.

Run chai automation tests on LambdaTest cloud grid

Perform automation testing on 3000+ real desktop and mobile devices online.

Try LambdaTest Now !!

Get 100 minutes of automation test minutes FREE!!

Next-Gen App & Browser Testing Cloud

Was this article helpful?

Helpful

NotHelpful