@reltio/components 1.4.2070 → 1.4.2072

package/RelationTypeSelector/RelationTypeSelector.test.js

@@ -1,20 +1,102 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
+    return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
 import React from 'react';
-import { shallow } from 'enzyme';
+import { render, screen, within } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
 import { RelationTypeSelector } from './RelationTypeSelector';
-import { DropDownSelector } from '../DropDownSelector';
-import { RelationOption } from './components/RelationOption';
-describe('RelationTypeSelector tests', function () {
-    it('should render main parts', function () {
-        var value = { label: '1', value: '1' };
-        var options = [value];
-        var onChange = jest.fn();
-        var component = shallow(React.createElement(RelationTypeSelector, { value: value, options: options, onChange: onChange }));
-        var selector = component.find(DropDownSelector);
-        expect(selector).toHaveLength(1);
-        expect(selector.prop('label')).toBe('Select relationship type');
-        expect(selector.prop('components')).toEqual({ Option: RelationOption });
-        expect(selector.prop('value')).toBe(value);
-        expect(selector.prop('options')).toBe(options);
-        expect(selector.prop('onChange')).toBe(onChange);
-    });
+describe('Relation type selector tests', function () {
+    it('should render and work correctly', function () { return __awaiter(void 0, void 0, void 0, function () {
+        var user, firstValue, secondValue, options, onChange, items;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    user = userEvent.setup();
+                    firstValue = {
+                        label: 'Orange',
+                        value: 'orange',
+                        startObject: {
+                            objectTypeURI: '',
+                            uri: '',
+                            objectType: { uri: 'configuration/entityTypes/HCP', label: 'HCP' }
+                        },
+                        endObject: {
+                            objectTypeURI: '',
+                            uri: '',
+                            objectType: { uri: 'configuration/entityTypes/Company', label: 'Company' }
+                        }
+                    };
+                    secondValue = {
+                        label: 'Apple',
+                        value: 'apple',
+                        startObject: {
+                            objectTypeURI: '',
+                            uri: '',
+                            objectType: { uri: 'configuration/entityTypes/HCA', label: 'HCA' }
+                        },
+                        endObject: {
+                            objectTypeURI: '',
+                            uri: '',
+                            objectType: { uri: 'configuration/entityTypes/Individual', label: 'Individual' }
+                        }
+                    };
+                    options = [firstValue, secondValue];
+                    onChange = jest.fn();
+                    render(React.createElement(RelationTypeSelector, { value: firstValue, options: options, onChange: onChange }));
+                    screen.getByText('Select relationship type');
+                    screen.getByText('Orange');
+                    return [4 /*yield*/, user.click(screen.getByRole('combobox'))];
+                case 1:
+                    _a.sent();
+                    items = screen.getAllByRole('option');
+                    expect(items).toHaveLength(2);
+                    within(items[0]).getByText('H');
+                    within(items[0]).getByText('C');
+                    within(items[0]).getByText('Orange');
+                    within(items[0]).getByText('HCP ↔ Company');
+                    within(items[1]).getByText('H');
+                    within(items[1]).getByText('I');
+                    within(items[1]).getByText('Apple');
+                    within(items[1]).getByText('HCA ↔ Individual');
+                    return [4 /*yield*/, user.click(items[1])];
+                case 2:
+                    _a.sent();
+                    expect(onChange).toHaveBeenCalledWith(secondValue, { action: 'select-option' });
+                    return [2 /*return*/];
+            }
+        });
+    }); });
 });

package/RelationTypesSelector/RelationTypesSelector.test.js

@@ -1,26 +1,77 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
+    return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
 import React from 'react';
-import { shallow } from 'enzyme';
-import { MetadataTypesSelector } from '../MetadataTypesSelector';
+import { render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
 import { RelationTypesSelector } from './RelationTypesSelector';
-describe('RelationTypesSelector tests', function () {
-    it('should filter items correctly', function () {
-        var relationTypes = [
-            {
-                access: ['READ'],
-                uri: 'configuration/relationTypes/PharmacyProvider',
-                label: 'PharmacyProvider',
-                attributes: []
-            },
-            {
-                access: [],
-                uri: 'configuration/relationTypes/Parent',
-                abstract: true,
-                attributes: [],
-                label: 'Parent'
+describe('Relation types selector tests', function () {
+    it('should filter items correctly', function () { return __awaiter(void 0, void 0, void 0, function () {
+        var user, relationTypes, onChange, items;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    user = userEvent.setup();
+                    relationTypes = [
+                        {
+                            access: ['READ'],
+                            uri: 'configuration/relationTypes/PharmacyProvider',
+                            label: 'Pharmacy Provider',
+                            attributes: []
+                        },
+                        {
+                            access: [],
+                            uri: 'configuration/relationTypes/Parent',
+                            abstract: true,
+                            attributes: [],
+                            label: 'Parent'
+                        }
+                    ];
+                    onChange = jest.fn();
+                    render(React.createElement(RelationTypesSelector, { relationTypes: relationTypes, selectedRelationTypes: [], onChange: onChange }));
+                    screen.getByText('Relation type');
+                    return [4 /*yield*/, user.click(screen.getByRole('textbox'))];
+                case 1:
+                    _a.sent();
+                    screen.getByText('Select relation types');
+                    items = screen.getAllByRole('menuitem');
+                    expect(items).toHaveLength(1);
+                    expect(items[0]).toHaveTextContent('Pharmacy Provider');
+                    return [2 /*return*/];
             }
-        ];
-        var onChange = jest.fn();
-        var component = shallow(React.createElement(RelationTypesSelector, { relationTypes: relationTypes, selectedRelationTypes: [], onChange: onChange }));
-        expect(component.find(MetadataTypesSelector).prop('items')).toEqual([relationTypes[0]]);
-    });
+        });
+    }); });
 });

package/ReltioMap/ReltioMap.spec.js

@@ -76,7 +76,7 @@ describe('ReltioMap tests', function () {
         mapKey: 'mapKey',
         loadingElement: React.createElement("div", null, "loading element")
     };
-    var setUpRTL = function (props) {
+    var setUp = function (props) {
         if (props === void 0) { props = defaultProps; }
         var user = userEvent.setup();
         return __assign(__assign({}, render(React.createElement(ReltioMap, __assign({}, props)))), { user: user });
@@ -148,7 +148,7 @@ describe('ReltioMap tests', function () {
             return __generator(this, function (_b) {
                 switch (_b.label) {
                     case 0:
-                        setUpRTL(__assign(__assign({}, defaultProps), { drawingModes: [MAP_DRAWING_MODES.POLYGON] }));
+                        setUp(__assign(__assign({}, defaultProps), { drawingModes: [MAP_DRAWING_MODES.POLYGON] }));
                         _a = expect;
                         return [4 /*yield*/, screen.findByLabelText('Draw area')];
                     case 1:
@@ -164,7 +164,7 @@ describe('ReltioMap tests', function () {
                 switch (_a.label) {
                     case 0:
                         mapOptions = { mapTypeControl: true };
-                        setUpRTL(__assign(__assign({}, defaultProps), { drawingModes: [MAP_DRAWING_MODES.POLYGON], mapOptions: mapOptions }));
+                        setUp(__assign(__assign({}, defaultProps), { drawingModes: [MAP_DRAWING_MODES.POLYGON], mapOptions: mapOptions }));
                         return [4 /*yield*/, waitFor(function () {
                                 expect(google.maps.Map).toHaveBeenCalledWith(expect.any(HTMLElement), expect.objectContaining({
                                     fullscreenControl: false,
@@ -182,7 +182,7 @@ describe('ReltioMap tests', function () {
             return __generator(this, function (_a) {
                 switch (_a.label) {
                     case 0:
-                        setUpRTL(__assign(__assign({}, defaultProps), { drawingModes: [MAP_DRAWING_MODES.POLYGON], isSearchEnabled: false }));
+                        setUp(__assign(__assign({}, defaultProps), { drawingModes: [MAP_DRAWING_MODES.POLYGON], isSearchEnabled: false }));
                         return [4 /*yield*/, waitFor(function () {
                                 expect(screen.queryByLabelText('Draw area')).not.toBeInTheDocument();
                             })];
@@ -208,7 +208,7 @@ describe('ReltioMap tests', function () {
                             }
                         ];
                         onMarkerClick = jest.fn();
-                        setUpRTL(__assign(__assign({}, defaultProps), { drawingModes: [MAP_DRAWING_MODES.POLYGON], onMarkerClicked: onMarkerClick, markers: markers }));
+                        setUp(__assign(__assign({}, defaultProps), { drawingModes: [MAP_DRAWING_MODES.POLYGON], onMarkerClicked: onMarkerClick, markers: markers }));
                         return [4 /*yield*/, waitFor(function () {
                                 markerMock = getLastInstance(AdvancedMarkerElement);
                                 expect(markerMock).toBeDefined();
@@ -226,7 +226,7 @@ describe('ReltioMap tests', function () {
         it('should fit map bounds correctly if markers loaded later than map', function () {
             var fitMapBoundsForMarkers = jest.spyOn(helpers, 'fitMapBoundsForMarkers');
             var fitMapBoundsForOverlay = jest.spyOn(helpers, 'fitMapBoundsForOverlay');
-            var rerender = setUpRTL(__assign(__assign({}, defaultProps), { markers: [] })).rerender;
+            var rerender = setUp(__assign(__assign({}, defaultProps), { markers: [] })).rerender;
             expect(fitMapBoundsForMarkers).not.toHaveBeenCalled();
             expect(fitMapBoundsForOverlay).not.toHaveBeenCalled();
             var newProps = __assign(__assign({}, defaultProps), { markers: [
@@ -260,7 +260,7 @@ describe('ReltioMap tests', function () {
             };
             var fitMapBoundsForMarkers = jest.spyOn(helpers, 'fitMapBoundsForMarkers');
             var fitMapBoundsForOverlay = jest.spyOn(helpers, 'fitMapBoundsForOverlay');
-            var rerender = setUpRTL(__assign(__assign({}, defaultProps), { markers: [], activeOverlay: activeOverlay })).rerender;
+            var rerender = setUp(__assign(__assign({}, defaultProps), { markers: [], activeOverlay: activeOverlay })).rerender;
             expect(fitMapBoundsForMarkers).not.toHaveBeenCalled();
             expect(fitMapBoundsForOverlay).not.toHaveBeenCalledWith(activeOverlay);
             var newProps = __assign(__assign({}, defaultProps), { activeOverlay: activeOverlay, markers: [
@@ -287,7 +287,7 @@ describe('ReltioMap tests', function () {
         it('should not fit map bounds when markers changed and "Search when I move the map" mode is on', function () {
             var fitMapBoundsForMarkers = jest.spyOn(helpers, 'fitMapBoundsForMarkers');
             var fitMapBoundsForOverlay = jest.spyOn(helpers, 'fitMapBoundsForOverlay');
-            var rerender = setUpRTL(__assign(__assign({}, defaultProps), { isSearchOnMapMove: false, markers: [] })).rerender;
+            var rerender = setUp(__assign(__assign({}, defaultProps), { isSearchOnMapMove: false, markers: [] })).rerender;
             var newProps = __assign(__assign({}, defaultProps), { isSearchOnMapMove: true, markers: [
                     {
                         point: { lat: 1, lng: 1 },
@@ -311,7 +311,7 @@ describe('ReltioMap tests', function () {
         it('should fit map bounds when activeOverlay changed', function () {
             var fitMapBoundsForMarkers = jest.spyOn(helpers, 'fitMapBoundsForMarkers');
             var fitMapBoundsForOverlay = jest.spyOn(helpers, 'fitMapBoundsForOverlay');
-            var rerender = setUpRTL(__assign(__assign({}, defaultProps), { activeOverlay: null })).rerender;
+            var rerender = setUp(__assign(__assign({}, defaultProps), { activeOverlay: null })).rerender;
             var newProps = __assign(__assign({}, defaultProps), { activeOverlay: {
                     type: MAP_DRAWING_MODES.POLYGON,
                     path: [
@@ -328,7 +328,7 @@ describe('ReltioMap tests', function () {
         it('should run fit map bounds only once when activeOverlay and markers are changed simultaneously', function () {
             var fitMapBoundsForMarkers = jest.spyOn(helpers, 'fitMapBoundsForMarkers');
             var fitMapBoundsForOverlay = jest.spyOn(helpers, 'fitMapBoundsForOverlay');
-            var rerender = setUpRTL(__assign(__assign({}, defaultProps), { activeOverlay: null })).rerender;
+            var rerender = setUp(__assign(__assign({}, defaultProps), { activeOverlay: null })).rerender;
             var newProps = __assign(__assign({}, defaultProps), { activeOverlay: {
                     type: MAP_DRAWING_MODES.POLYGON,
                     path: [
@@ -358,7 +358,7 @@ describe('ReltioMap tests', function () {
             expect(fitMapBoundsForMarkers).toHaveBeenCalledWith(newProps.markers, mapMock, newProps.activeOverlay);
         });
         it('should align zoom level when fit map bounds for single marker', function () {
-            var rerender = setUpRTL(__assign(__assign({}, defaultProps), { activeOverlay: null })).rerender;
+            var rerender = setUp(__assign(__assign({}, defaultProps), { activeOverlay: null })).rerender;
             var newProps = __assign(__assign({}, defaultProps), { markers: [
                     {
                         point: { lat: 1, lng: 1 },
@@ -387,7 +387,7 @@ describe('ReltioMap tests', function () {
                                 { lat: 2, lng: 2 }
                             ]
                         };
-                        _a = setUpRTL(__assign(__assign({}, defaultProps), { drawingModes: [MAP_DRAWING_MODES.POLYGON], activeOverlay: activeOverlay })), user = _a.user, rerender = _a.rerender;
+                        _a = setUp(__assign(__assign({}, defaultProps), { drawingModes: [MAP_DRAWING_MODES.POLYGON], activeOverlay: activeOverlay })), user = _a.user, rerender = _a.rerender;
                         polygon = getLastInstance(Polygon);
                         expect(polygon.setOptions).toHaveBeenCalledWith(expect.objectContaining({ paths: activeOverlay.path }));
                         newProps = __assign(__assign({}, defaultProps), { drawingModes: [MAP_DRAWING_MODES.POLYGON], activeOverlay: null });
@@ -409,7 +409,7 @@ describe('ReltioMap tests', function () {
                             type: MAP_DRAWING_MODES.CIRCLE,
                             path: [{ lat: 1, lng: 1 }]
                         };
-                        setUpRTL(__assign(__assign({}, defaultProps), { drawingModes: [MAP_DRAWING_MODES.POLYGON], activeOverlay: activeOverlay }));
+                        setUp(__assign(__assign({}, defaultProps), { drawingModes: [MAP_DRAWING_MODES.POLYGON], activeOverlay: activeOverlay }));
                         return [4 /*yield*/, waitFor(function () {
                                 expect(mockInstances.get(Polygon)).toHaveLength(0);
                             })];
@@ -432,7 +432,7 @@ describe('ReltioMap tests', function () {
                             ]
                         };
                         onOverlayUpdated = jest.fn();
-                        setUpRTL(__assign(__assign({}, defaultProps), { drawingModes: [MAP_DRAWING_MODES.POLYGON], activeOverlay: activeOverlay, onOverlayUpdated: onOverlayUpdated }));
+                        setUp(__assign(__assign({}, defaultProps), { drawingModes: [MAP_DRAWING_MODES.POLYGON], activeOverlay: activeOverlay, onOverlayUpdated: onOverlayUpdated }));
                         polygon = getLastInstance(Polygon);
                         getEventHandler(polygon, 'mouseup')();
                         return [4 /*yield*/, waitFor(function () {
@@ -461,7 +461,7 @@ describe('ReltioMap tests', function () {
                             ]
                         };
                         onOverlayUpdated = jest.fn();
-                        setUpRTL(__assign(__assign({}, defaultProps), { drawingModes: [MAP_DRAWING_MODES.POLYGON], activeOverlay: activeOverlay, onOverlayUpdated: onOverlayUpdated }));
+                        setUp(__assign(__assign({}, defaultProps), { drawingModes: [MAP_DRAWING_MODES.POLYGON], activeOverlay: activeOverlay, onOverlayUpdated: onOverlayUpdated }));
                         polygon = getLastInstance(Polygon);
                         getEventHandler(polygon, 'dragend')();
                         return [4 /*yield*/, waitFor(function () {
@@ -483,7 +483,7 @@ describe('ReltioMap tests', function () {
             return __generator(this, function (_a) {
                 switch (_a.label) {
                     case 0:
-                        setUpRTL(__assign(__assign({}, defaultProps), { drawingModes: [MAP_DRAWING_MODES.CIRCLE] }));
+                        setUp(__assign(__assign({}, defaultProps), { drawingModes: [MAP_DRAWING_MODES.CIRCLE] }));
                         return [4 /*yield*/, waitFor(function () {
                                 expect(drawingManagerInstance).not.toBe(null);
                             })];
@@ -499,11 +499,15 @@ describe('ReltioMap tests', function () {
             return __generator(this, function (_a) {
                 switch (_a.label) {
                     case 0:
-                        user = setUpRTL(__assign(__assign({}, defaultProps), { drawingModes: [MAP_DRAWING_MODES.CIRCLE] })).user;
+                        user = setUp(__assign(__assign({}, defaultProps), { drawingModes: [MAP_DRAWING_MODES.CIRCLE] })).user;
                         return [4 /*yield*/, user.click(screen.getByLabelText('Draw area'))];
                     case 1:
                         _a.sent();
                         expect(drawingManagerConstructorSpy).toHaveBeenCalledWith(expect.objectContaining({ drawingMode: MAP_DRAWING_MODES.CIRCLE }));
+                        return [4 /*yield*/, user.click(screen.getByLabelText('Clear area'))];
+                    case 2:
+                        _a.sent();
+                        expect(drawingManagerConstructorSpy).toHaveBeenCalledWith(expect.objectContaining({ drawingMode: null }));
                         return [2 /*return*/];
                 }
             });
@@ -512,7 +516,7 @@ describe('ReltioMap tests', function () {
             return __generator(this, function (_a) {
                 switch (_a.label) {
                     case 0:
-                        setUpRTL(__assign({}, defaultProps));
+                        setUp(__assign({}, defaultProps));
                         return [4 /*yield*/, waitFor(function () {
                                 expect(drawingManagerInstance).toBe(null);
                             })];
@@ -526,7 +530,7 @@ describe('ReltioMap tests', function () {
             return __generator(this, function (_a) {
                 switch (_a.label) {
                     case 0:
-                        setUpRTL(__assign({}, defaultProps));
+                        setUp(__assign({}, defaultProps));
                         return [4 /*yield*/, waitFor(function () {
                                 expect(screen.queryByLabelText('Draw area')).not.toBeInTheDocument();
                             })];
@@ -543,7 +547,7 @@ describe('ReltioMap tests', function () {
                 switch (_a.label) {
                     case 0:
                         onOverlayUpdated = jest.fn();
-                        user = setUpRTL(__assign(__assign({}, defaultProps), { onOverlayUpdated: onOverlayUpdated, drawingModes: [MAP_DRAWING_MODES.POLYGON] })).user;
+                        user = setUp(__assign(__assign({}, defaultProps), { onOverlayUpdated: onOverlayUpdated, drawingModes: [MAP_DRAWING_MODES.POLYGON] })).user;
                         return [4 /*yield*/, user.click(screen.getByLabelText('Draw area'))];
                     case 1:
                         _a.sent();
@@ -573,6 +577,28 @@ describe('ReltioMap tests', function () {
                 }
             });
         }); });
+        it('should call props.onOverlayUpdated on "Clear area" button correctly', function () { return __awaiter(void 0, void 0, void 0, function () {
+            var onOverlayUpdated, activeOverlay, user;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        onOverlayUpdated = jest.fn();
+                        activeOverlay = {
+                            type: MAP_DRAWING_MODES.POLYGON,
+                            path: [
+                                { lat: 1, lng: 1 },
+                                { lat: 2, lng: 2 }
+                            ]
+                        };
+                        user = setUp(__assign(__assign({}, defaultProps), { drawingModes: [MAP_DRAWING_MODES.CIRCLE], activeOverlay: activeOverlay, onOverlayUpdated: onOverlayUpdated })).user;
+                        return [4 /*yield*/, user.click(screen.getByLabelText('Clear area'))];
+                    case 1:
+                        _a.sent();
+                        expect(onOverlayUpdated).toHaveBeenCalledWith(null);
+                        return [2 /*return*/];
+                }
+            });
+        }); });
     });
     describe('"Search when I move the map" behavior', function () {
         it('should call props.onMapBoundsChanged with current map bounds and reset drawingMode on change isSearchOnMapMove(true)', function () { return __awaiter(void 0, void 0, void 0, function () {
@@ -585,7 +611,7 @@ describe('ReltioMap tests', function () {
                             [1, 2],
                             [3, 4]
                         ];
-                        user = setUpRTL(__assign(__assign({}, defaultProps), { onMapBoundsChanged: onMapBoundsChanged, drawingModes: [MAP_DRAWING_MODES.POLYGON] })).user;
+                        user = setUp(__assign(__assign({}, defaultProps), { onMapBoundsChanged: onMapBoundsChanged, drawingModes: [MAP_DRAWING_MODES.POLYGON] })).user;
                         jest.spyOn(helpers, 'getMapBoundsPolygon').mockImplementation(function () { return mapBoundsPolygon; });
                         return [4 /*yield*/, user.click(screen.getByLabelText('Draw area'))];
                     case 1:
@@ -606,7 +632,7 @@ describe('ReltioMap tests', function () {
                 switch (_a.label) {
                     case 0:
                         onMapBoundsChanged = jest.fn();
-                        user = setUpRTL(__assign(__assign({}, defaultProps), { onMapBoundsChanged: onMapBoundsChanged, drawingModes: [MAP_DRAWING_MODES.POLYGON] })).user;
+                        user = setUp(__assign(__assign({}, defaultProps), { onMapBoundsChanged: onMapBoundsChanged, drawingModes: [MAP_DRAWING_MODES.POLYGON] })).user;
                         return [4 /*yield*/, user.click(screen.getByLabelText('Draw area'))];
                     case 1:
                         _a.sent();
@@ -630,7 +656,7 @@ describe('ReltioMap tests', function () {
                 [1, 2],
                 [3, 4]
             ];
-            setUpRTL(__assign(__assign({}, defaultProps), { onMapBoundsChanged: onMapBoundsChanged, drawingModes: [MAP_DRAWING_MODES.POLYGON], isSearchOnMapMove: true }));
+            setUp(__assign(__assign({}, defaultProps), { onMapBoundsChanged: onMapBoundsChanged, drawingModes: [MAP_DRAWING_MODES.POLYGON], isSearchOnMapMove: true }));
             jest.spyOn(helpers, 'getMapBoundsPolygon').mockImplementation(function () { return mapBoundsPolygon; });
             expect(screen.getByLabelText('Search as I move the map').checked).toBe(true);
             expect(onMapBoundsChanged).not.toHaveBeenCalled();
@@ -647,7 +673,7 @@ describe('ReltioMap tests', function () {
                 [1, 2],
                 [3, 4]
             ];
-            setUpRTL(__assign(__assign({}, defaultProps), { onMapBoundsChanged: onMapBoundsChanged, drawingModes: [MAP_DRAWING_MODES.POLYGON], isSearchOnMapMove: true }));
+            setUp(__assign(__assign({}, defaultProps), { onMapBoundsChanged: onMapBoundsChanged, drawingModes: [MAP_DRAWING_MODES.POLYGON], isSearchOnMapMove: true }));
             jest.spyOn(helpers, 'getMapBoundsPolygon').mockImplementation(function () { return mapBoundsPolygon; });
             expect(screen.getByLabelText('Search as I move the map').checked).toBe(true);
             var mapMock = getLastInstance(Map);
@@ -665,7 +691,7 @@ describe('ReltioMap tests', function () {
         it('should not call props.onMapBoundsChanged on google map idle if "Search when I move the map" mode is off', function () {
             jest.useFakeTimers();
             var onMapBoundsChanged = jest.fn();
-            setUpRTL(__assign(__assign({}, defaultProps), { onMapBoundsChanged: onMapBoundsChanged, drawingModes: [MAP_DRAWING_MODES.POLYGON], isSearchOnMapMove: false }));
+            setUp(__assign(__assign({}, defaultProps), { onMapBoundsChanged: onMapBoundsChanged, drawingModes: [MAP_DRAWING_MODES.POLYGON], isSearchOnMapMove: false }));
             expect(screen.getByLabelText('Search as I move the map').checked).toBe(false);
             getEventHandler(getLastInstance(Map), 'idle')();
             jest.runOnlyPendingTimers();

package/Roles/Roles.test.js

@@ -1,15 +1,59 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
 import React from 'react';
-import { shallow } from 'enzyme';
+import { render, screen } from '@testing-library/react';
+import { MdmModuleProvider } from '../contexts/MdmModuleContext';
+import { HistoryDiffContext } from '../contexts/HistoryAppearanceContext';
 import { Roles } from './Roles';
-import { Role } from './components/Role';
-import { SpecialAttributesArray } from '../SpecialAttributesArray';
+var mdmValues = {
+    metadata: {
+        roles: [
+            { uri: 'role1', label: 'Role label 1' },
+            { uri: 'role2', label: 'Role label 2' }
+        ]
+    }
+};
+var defaultProps = {
+    values: ['role1', 'role2'],
+    className: 'class1'
+};
+var setUp = function (_a) {
+    var _b = _a === void 0 ? {} : _a, _c = _b.props, props = _c === void 0 ? defaultProps : _c, _d = _b.CustomProviders, CustomProviders = _d === void 0 ? React.Fragment : _d;
+    var Providers = function (_a) {
+        var children = _a.children;
+        return (React.createElement(CustomProviders, null,
+            React.createElement(MdmModuleProvider, { values: mdmValues }, children)));
+    };
+    return render(React.createElement(Roles, __assign({}, props)), { wrapper: Providers });
+};
 describe('Roles tests', function () {
-    var values = ['role1'];
-    var className = 'class1';
-    it('should render SpecialAttributesArray with correct props', function () {
-        var component = shallow(React.createElement(Roles, { values: values, className: className }));
-        expect(component.find(SpecialAttributesArray).prop('className')).toBe(className);
-        expect(component.find(SpecialAttributesArray).prop('values')).toBe(values);
-        expect(component.find(SpecialAttributesArray).prop('Component')).toBe(Role);
+    it('should render correctly', function () {
+        setUp();
+        var attributeValue = screen.getByTestId('reltio-attribute-value');
+        expect(attributeValue).toHaveTextContent('Role label 1, Role label 2');
+        expect(attributeValue).toHaveClass('class1');
+    });
+    it('should provide history className', function () {
+        var historyDiff = {
+            appearance: { roles: { otherValue: 'DELETE_ATTRIBUTE', role1: 'INSERT_ATTRIBUTE' } },
+            attributes: {},
+            roles: [],
+            tags: []
+        };
+        var CustomProviders = function (_a) {
+            var children = _a.children;
+            return (React.createElement(HistoryDiffContext.Provider, { value: historyDiff }, children));
+        };
+        setUp({ CustomProviders: CustomProviders });
+        expect(screen.getByText('Role label 1')).toHaveClass('insertAttribute');
     });
 });