@reltio/components 1.4.2270 → 1.4.2272

package/cjs/hooks/useSavedStateForEntityType/useSavedStateForEntityType.test.js

@@ -47,7 +47,7 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
     }
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-var react_hooks_1 = require("@testing-library/react-hooks");
+var react_1 = require("@testing-library/react");
 var useSavedStateForEntityType_1 = require("./useSavedStateForEntityType");
 describe('useSavedStateForEntityType test', function () {
     var _a;
@@ -78,8 +78,8 @@ describe('useSavedStateForEntityType test', function () {
         return __generator(this, function (_a) {
             switch (_a.label) {
                 case 0:
-                    result = (0, react_hooks_1.renderHook)(useSavedStateForEntityType_1.useSavedStateForEntityType, { initialProps: initialProps }).result;
-                    return [4 /*yield*/, (0, react_hooks_1.act)(function () { return __awaiter(void 0, void 0, void 0, function () {
+                    result = (0, react_1.renderHook)(useSavedStateForEntityType_1.useSavedStateForEntityType, { initialProps: initialProps }).result;
+                    return [4 /*yield*/, (0, react_1.act)(function () { return __awaiter(void 0, void 0, void 0, function () {
                             return __generator(this, function (_a) {
                                 switch (_a.label) {
                                     case 0: return [4 /*yield*/, resolveSavedState(savedState)];
@@ -104,10 +104,10 @@ describe('useSavedStateForEntityType test', function () {
         return __generator(this, function (_b) {
             switch (_b.label) {
                 case 0:
-                    _a = (0, react_hooks_1.renderHook)(useSavedStateForEntityType_1.useSavedStateForEntityType, {
+                    _a = (0, react_1.renderHook)(useSavedStateForEntityType_1.useSavedStateForEntityType, {
                         initialProps: __assign(__assign({}, initialProps), { entityTypeUri: undefined })
                     }), result = _a.result, rerender = _a.rerender;
-                    return [4 /*yield*/, (0, react_hooks_1.act)(function () { return __awaiter(void 0, void 0, void 0, function () {
+                    return [4 /*yield*/, (0, react_1.act)(function () { return __awaiter(void 0, void 0, void 0, function () {
                             return __generator(this, function (_a) {
                                 switch (_a.label) {
                                     case 0: return [4 /*yield*/, resolveSavedState(savedState)];
@@ -137,10 +137,10 @@ describe('useSavedStateForEntityType test', function () {
         return __generator(this, function (_a) {
             switch (_a.label) {
                 case 0:
-                    result = (0, react_hooks_1.renderHook)(useSavedStateForEntityType_1.useSavedStateForEntityType, {
+                    result = (0, react_1.renderHook)(useSavedStateForEntityType_1.useSavedStateForEntityType, {
                         initialProps: __assign(__assign({}, initialProps), { entityTypeUri: 'configuration/entityTypes/Empty' })
                     }).result;
-                    return [4 /*yield*/, (0, react_hooks_1.act)(function () { return __awaiter(void 0, void 0, void 0, function () {
+                    return [4 /*yield*/, (0, react_1.act)(function () { return __awaiter(void 0, void 0, void 0, function () {
                             return __generator(this, function (_a) {
                                 switch (_a.label) {
                                     case 0: return [4 /*yield*/, resolveSavedState(savedState)];
@@ -166,20 +166,22 @@ describe('useSavedStateForEntityType test', function () {
         return __generator(this, function (_b) {
             switch (_b.label) {
                 case 0:
-                    result = (0, react_hooks_1.renderHook)(useSavedStateForEntityType_1.useSavedStateForEntityType, { initialProps: initialProps }).result;
-                    return [4 /*yield*/, (0, react_hooks_1.act)(function () { return __awaiter(void 0, void 0, void 0, function () {
+                    result = (0, react_1.renderHook)(useSavedStateForEntityType_1.useSavedStateForEntityType, { initialProps: initialProps }).result;
+                    return [4 /*yield*/, (0, react_1.act)(function () { return __awaiter(void 0, void 0, void 0, function () {
                             return __generator(this, function (_a) {
                                 switch (_a.label) {
                                     case 0: return [4 /*yield*/, resolveSavedState(savedState)];
                                     case 1:
                                         _a.sent();
-                                        result.current.updateSavedState({ visibleColumns: ['new'] });
                                         return [2 /*return*/];
                                 }
                             });
                         }); })];
                 case 1:
                     _b.sent();
+                    (0, react_1.act)(function () {
+                        result.current.updateSavedState({ visibleColumns: ['new'] });
+                    });
                     expect(initialProps.saveState).toHaveBeenCalledWith((_a = {},
                         _a[entityTypeUri] = {
                             visibleColumns: ['new']
@@ -197,10 +199,10 @@ describe('useSavedStateForEntityType test', function () {
         return __generator(this, function (_a) {
             switch (_a.label) {
                 case 0:
-                    result = (0, react_hooks_1.renderHook)(useSavedStateForEntityType_1.useSavedStateForEntityType, {
+                    result = (0, react_1.renderHook)(useSavedStateForEntityType_1.useSavedStateForEntityType, {
                         initialProps: __assign(__assign({}, initialProps), { entityTypeUri: undefined })
                     }).result;
-                    return [4 /*yield*/, (0, react_hooks_1.act)(function () { return __awaiter(void 0, void 0, void 0, function () {
+                    return [4 /*yield*/, (0, react_1.act)(function () { return __awaiter(void 0, void 0, void 0, function () {
                             return __generator(this, function (_a) {
                                 result.current.updateSavedState({ visibleColumns: ['new'] });
                                 return [2 /*return*/];
@@ -219,20 +221,22 @@ describe('useSavedStateForEntityType test', function () {
         return __generator(this, function (_d) {
             switch (_d.label) {
                 case 0:
-                    _a = (0, react_hooks_1.renderHook)(useSavedStateForEntityType_1.useSavedStateForEntityType, { initialProps: initialProps }), result = _a.result, rerender = _a.rerender;
-                    return [4 /*yield*/, (0, react_hooks_1.act)(function () { return __awaiter(void 0, void 0, void 0, function () {
+                    _a = (0, react_1.renderHook)(useSavedStateForEntityType_1.useSavedStateForEntityType, { initialProps: initialProps }), result = _a.result, rerender = _a.rerender;
+                    return [4 /*yield*/, (0, react_1.act)(function () { return __awaiter(void 0, void 0, void 0, function () {
                             return __generator(this, function (_a) {
                                 switch (_a.label) {
                                     case 0: return [4 /*yield*/, resolveSavedState(savedState)];
                                     case 1:
                                         _a.sent();
-                                        result.current.updateSavedState({ visibleColumns: ['new'] });
                                         return [2 /*return*/];
                                 }
                             });
                         }); })];
                 case 1:
                     _d.sent();
+                    (0, react_1.act)(function () {
+                        result.current.updateSavedState({ visibleColumns: ['new'] });
+                    });
                     expect(initialProps.saveState).toHaveBeenCalledWith((_b = {},
                         _b[entityTypeUri] = {
                             visibleColumns: ['new']
@@ -242,7 +246,7 @@ describe('useSavedStateForEntityType test', function () {
                         },
                         _b));
                     rerender(__assign(__assign({}, initialProps), { entityTypeUri: 'configuration/entityTypes/HCA' }));
-                    return [4 /*yield*/, (0, react_hooks_1.act)(function () { return __awaiter(void 0, void 0, void 0, function () {
+                    return [4 /*yield*/, (0, react_1.act)(function () { return __awaiter(void 0, void 0, void 0, function () {
                             return __generator(this, function (_a) {
                                 result.current.updateSavedState({ visibleColumns: ['otherNew'] });
                                 return [2 /*return*/];

package/cjs/hooks/useScrollToAttributeError/useScrollToAttributeError.test.js

@@ -47,14 +47,14 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
     }
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-var react_hooks_1 = require("@testing-library/react-hooks");
+var react_1 = require("@testing-library/react");
 var useScrollToAttributeError_1 = require("./useScrollToAttributeError");
 var ScrollToElementContext_1 = require("../../contexts/ScrollToElementContext");
 var mdm_sdk_1 = require("@reltio/mdm-sdk");
 describe('useScrollToAttributeError behavior', function () {
     var setUp = function (_a) {
         var _b = _a === void 0 ? {} : _a, _c = _b.highlightedError, highlightedError = _c === void 0 ? null : _c, _d = _b.isSimple, isSimple = _d === void 0 ? false : _d;
-        return (0, react_hooks_1.renderHook)(useScrollToAttributeError_1.useScrollToAttributeError, { initialProps: { highlightedError: highlightedError, isSimple: isSimple } });
+        return (0, react_1.renderHook)(useScrollToAttributeError_1.useScrollToAttributeError, { initialProps: { highlightedError: highlightedError, isSimple: isSimple } });
     };
     var scrollIntoRefSpy = jest.fn();
     var fullError = {
@@ -69,7 +69,7 @@ describe('useScrollToAttributeError behavior', function () {
         var initialProps = {
             highlightedError: null
         };
-        var result = (0, react_hooks_1.renderHook)(useScrollToAttributeError_1.useScrollToAttributeError, { initialProps: initialProps }).result;
+        var result = (0, react_1.renderHook)(useScrollToAttributeError_1.useScrollToAttributeError, { initialProps: initialProps }).result;
         expect(result.current.ref).toBeTruthy();
         expect(result.current.errorClassName).toBe(undefined);
     });

package/cjs/hooks/useUsers/useUsers.test.js

@@ -51,7 +51,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 var react_1 = __importDefault(require("react"));
-var react_hooks_1 = require("@testing-library/react-hooks");
+var react_2 = require("@testing-library/react");
 var mdm_sdk_1 = require("@reltio/mdm-sdk");
 var MdmModuleContext_1 = require("../../contexts/MdmModuleContext");
 var useUsers_1 = require("./useUsers");
@@ -65,41 +65,40 @@ var setUp = function () {
         var children = _a.children;
         return react_1.default.createElement(MdmModuleContext_1.MdmModuleProvider, { values: mdmValues }, children);
     };
-    return (0, react_hooks_1.renderHook)(useUsers_1.useUsers, { wrapper: Providers });
+    return (0, react_2.renderHook)(useUsers_1.useUsers, { wrapper: Providers });
 };
 describe('useUsers behaviour', function () {
     afterEach(function () {
         jest.clearAllMocks();
     });
     it('should call getAllUsersForTenant and update users value', function () { return __awaiter(void 0, void 0, void 0, function () {
-        var response, _a, result, waitFor;
-        return __generator(this, function (_b) {
-            switch (_b.label) {
+        var response, result;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
                 case 0:
                     response = [{ username: 'username', email: 'email' }];
                     mdm_sdk_1.getAllUsersForTenant.mockResolvedValue(response);
-                    _a = setUp(), result = _a.result, waitFor = _a.waitFor;
+                    result = setUp().result;
                     expect(result.current).toEqual([]);
                     expect(mdm_sdk_1.getAllUsersForTenant).toHaveBeenCalledWith({ tenant: tenant.id, servicesPath: servicesPath });
-                    return [4 /*yield*/, waitFor(function () { return expect(result.current).toEqual(response); })];
+                    return [4 /*yield*/, (0, react_2.waitFor)(function () { return expect(result.current).toEqual(response); })];
                 case 1:
-                    _b.sent();
+                    _a.sent();
                     return [2 /*return*/];
             }
         });
     }); });
     it('should set users value as null in case of unsuccessful request', function () { return __awaiter(void 0, void 0, void 0, function () {
-        var _a, result, waitForValueToChange;
-        return __generator(this, function (_b) {
-            switch (_b.label) {
+        var result;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
                 case 0:
                     mdm_sdk_1.getAllUsersForTenant.mockRejectedValue('Error');
-                    _a = setUp(), result = _a.result, waitForValueToChange = _a.waitForValueToChange;
+                    result = setUp().result;
                     expect(mdm_sdk_1.getAllUsersForTenant).toHaveBeenCalled();
-                    return [4 /*yield*/, waitForValueToChange(function () { return result.current; })];
+                    return [4 /*yield*/, (0, react_2.waitFor)(function () { return expect(result.current).toEqual([]); })];
                 case 1:
-                    _b.sent();
-                    expect(result.current).toEqual([]);
+                    _a.sent();
                     return [2 /*return*/];
             }
         });

package/cjs/hooks/useWhyDidYouUpdate/useWhyDidYouUpdate.js

@@ -16,7 +16,7 @@ var react_1 = require("react");
 var useWhyDidYouUpdate = function (name, props) {
     // Get a mutable ref object where we can store props ...
     // ... for comparison next time this hook runs.
-    var previousProps = (0, react_1.useRef)();
+    var previousProps = (0, react_1.useRef)(null);
     (0, react_1.useEffect)(function () {
         if (previousProps.current) {
             // Get all keys from previous and current props

package/cjs/test-utils/dndKit/DndContextComponent.js

@@ -50,6 +50,9 @@ var DndContextComponent = function (_a) {
         });
     }, [dispatchMonitorEvent, onDragStart]);
     var handleDragOver = (0, react_1.useCallback)(function (nodeId) {
+        if (!dragActiveIdRef.current) {
+            return;
+        }
         dragOverIdRef.current = nodeId;
         var draggableNode = draggableNodesRef.current.get(dragActiveIdRef.current);
         var droppableNode = droppableNodesRef.current.get(nodeId);

package/cjs/test-utils/dndKit/index.d.ts

@@ -11,6 +11,7 @@ export declare const mockDndKit: {
             onMouseUp(): void;
         };
         setNodeRef: (element: HTMLElement | null) => void;
+        setActivatorNodeRef: (element: HTMLElement | null) => void;
     };
     useDroppable: (props: import("./type").MockUseDraggableArguments) => {
         setNodeRef: (element: HTMLElement | null) => void;

package/cjs/test-utils/dndKit/useDndMonitorProvider.d.ts

@@ -1 +1,4 @@
-export declare const useDndMonitorProvider: () => readonly [({ type, event }: any) => void, (listener: any) => () => boolean];
+export declare const useDndMonitorProvider: () => readonly [({ type, event }: {
+    type: any;
+    event: any;
+}) => void, (listener: any) => () => boolean];

package/cjs/test-utils/dndKit/useDraggable.d.ts

@@ -9,4 +9,5 @@ export declare const useDraggable: (props: MockUseDraggableArguments) => {
         onMouseUp(): void;
     };
     setNodeRef: (element: HTMLElement | null) => void;
+    setActivatorNodeRef: (element: HTMLElement | null) => void;
 };

package/cjs/test-utils/dndKit/useDraggable.js

@@ -12,6 +12,12 @@ var useDraggable = function (props) {
         }
     }, [props.id]);
     var _b = (0, utilities_1.useNodeRef)(onChangeNode), node = _b[0], setNodeRef = _b[1];
+    var onChangeActivatorNode = (0, react_1.useCallback)(function (newElement) {
+        if (newElement) {
+            newElement.setAttribute('data-test-dnd-activator-id', props.id);
+        }
+    }, [props.id]);
+    var _c = (0, utilities_1.useNodeRef)(onChangeActivatorNode), setActivatorNodeRef = _c[1];
     var data = (0, react_1.useRef)(props.data);
     (0, react_1.useEffect)(function () {
         draggableNodesRef.current.set(props.id, { id: props.id, data: data, node: node });
@@ -37,7 +43,8 @@ var useDraggable = function (props) {
     return {
         attributes: {},
         listeners: listeners,
-        setNodeRef: setNodeRef
+        setNodeRef: setNodeRef,
+        setActivatorNodeRef: setActivatorNodeRef
     };
 };
 exports.useDraggable = useDraggable;

package/cjs/test-utils/index.d.ts

@@ -1,3 +1,4 @@
+export { mockUseSelector, mockUseDispatch } from './mockStoreHooks';
 export declare const awaitMockPromises: () => Promise<unknown>;
 export declare const deepFreeze: (obj: any) => any;
 export declare const rerenderWrapper: (wrapper: any) => any;
@@ -29,4 +30,3 @@ interface MouseEventWithOffsets extends MouseEventInit {
 export declare class FakeMouseEvent extends MouseEvent {
     constructor(type: string, values: MouseEventWithOffsets);
 }
-export {};

package/cjs/test-utils/index.js

@@ -73,8 +73,11 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.FakeMouseEvent = exports.getMuiIconsByName = exports.getMuiIconByName = exports.fixClicksOnResizablePanes = exports.mockBasicTableSizing = exports.mockComputedStyles = exports.mockElementSizes = exports.rerenderWrapper = exports.deepFreeze = exports.awaitMockPromises = void 0;
+exports.FakeMouseEvent = exports.getMuiIconsByName = exports.getMuiIconByName = exports.fixClicksOnResizablePanes = exports.mockBasicTableSizing = exports.mockComputedStyles = exports.mockElementSizes = exports.rerenderWrapper = exports.deepFreeze = exports.awaitMockPromises = exports.mockUseDispatch = exports.mockUseSelector = void 0;
 var react_1 = require("@testing-library/react");
+var mockStoreHooks_1 = require("./mockStoreHooks");
+Object.defineProperty(exports, "mockUseSelector", { enumerable: true, get: function () { return mockStoreHooks_1.mockUseSelector; } });
+Object.defineProperty(exports, "mockUseDispatch", { enumerable: true, get: function () { return mockStoreHooks_1.mockUseDispatch; } });
 var awaitMockPromises = function () { return __awaiter(void 0, void 0, void 0, function () {
     return __generator(this, function (_a) {
         return [2 /*return*/, new Promise(function (resolve) { return setImmediate(resolve); })];

package/cjs/test-utils/mockStoreHooks.d.ts

@@ -0,0 +1,4 @@
+type UseSelectorImpl = (selector: (state: unknown) => unknown) => unknown;
+export declare const mockUseSelector: (impl?: UseSelectorImpl) => jest.Mock;
+export declare const mockUseDispatch: (dispatch?: jest.Mock) => jest.Mock;
+export {};

package/cjs/test-utils/mockStoreHooks.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.mockUseDispatch = exports.mockUseSelector = void 0;
+var defaultUseSelectorImpl = function (selector) { return selector({}); };
+var getMockedReactRedux = function () {
+    return jest.requireMock('react-redux');
+};
+var mockUseSelector = function (impl) {
+    if (impl === void 0) { impl = defaultUseSelectorImpl; }
+    var useSelector = getMockedReactRedux().useSelector;
+    useSelector.mockImplementation(impl);
+    return useSelector;
+};
+exports.mockUseSelector = mockUseSelector;
+var mockUseDispatch = function (dispatch) {
+    if (dispatch === void 0) { dispatch = jest.fn(); }
+    var useDispatch = getMockedReactRedux().useDispatch;
+    useDispatch.mockReturnValue(dispatch);
+    return dispatch;
+};
+exports.mockUseDispatch = mockUseDispatch;

package/cjs/utils/withChildrenProp.d.ts

@@ -0,0 +1,10 @@
+import { ComponentProps, ComponentType, ReactNode } from 'react';
+/**
+ * Augments a component's prop type with an explicit `children?: ReactNode` field.
+ * Workaround for legacy 3rd-party components (e.g. `react-dnd` v9 `DndProvider`,
+ * `redux-dynamic-modules-react`'s `DynamicModuleLoader`) whose typings predate the
+ * React 18 change where `children` is no longer part of `FC<P>` implicitly.
+ */
+export declare const withChildrenProp: <T extends ComponentType<object>>(Component: T) => ComponentType<ComponentProps<T> & {
+    children?: ReactNode;
+}>;

package/cjs/utils/withChildrenProp.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.withChildrenProp = void 0;
+/**
+ * Augments a component's prop type with an explicit `children?: ReactNode` field.
+ * Workaround for legacy 3rd-party components (e.g. `react-dnd` v9 `DndProvider`,
+ * `redux-dynamic-modules-react`'s `DynamicModuleLoader`) whose typings predate the
+ * React 18 change where `children` is no longer part of `FC<P>` implicitly.
+ */
+var withChildrenProp = function (Component) {
+    return Component;
+};
+exports.withChildrenProp = withChildrenProp;

package/contexts/AutoExpandedAttributesContext/useAttributeAutoExpanded.test.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { renderHook } from '@testing-library/react-hooks';
+import { renderHook } from '@testing-library/react';
 import { AutoExpandedAttributesProvider, useAttributeAutoExpanded } from './index';
 var setUp = function (attributeUri, attributeUris) {
     var DefaultProviders = function (_a) {

package/contexts/ReloadDataContext/ReloadDataContext.spec.js

@@ -1,4 +1,4 @@
-import { renderHook } from '@testing-library/react-hooks';
+import { renderHook } from '@testing-library/react';
 import React from 'react';
 import { useReloadData, ReloadDataProvider } from './index';
 describe('ReloadDataContext tests', function () {

package/features/activity-log/ActivityFilterButton/ActivityFilterButton.js

@@ -21,7 +21,7 @@ import { useStyles } from './styles';
 export var ActivityFilterButton = function (_a) {
     var filter = _a.filter, entityType = _a.entityType, onChange = _a.onChange;
     var styles = useStyles();
-    var buttonRef = useRef();
+    var buttonRef = useRef(null);
     var initialValue = useRef(filter);
     var _b = useState(false), isEditorOpen = _b[0], setIsEditorOpen = _b[1];
     var isApplied = !equals(filter, initialValue.current);

package/features/crosswalks/AttributesTable/AttributesTable.test.js

@@ -55,7 +55,7 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
     return to.concat(ar || Array.prototype.slice.call(from));
 };
 import React from 'react';
-import { render, fireEvent, within, screen } from '@testing-library/react';
+import { render, fireEvent, within, screen, waitFor } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import { config } from 'react-transition-group';
 import { mockDndKit } from '../../../test-utils/dndKit';
@@ -138,7 +138,7 @@ describe('attribute table tests', function () {
             args_1[_i - 1] = arguments[_i];
         }
         return __awaiter(void 0, __spreadArray([user_1], args_1, true), void 0, function (user, valueIndex) {
-            var attribute;
+            var attribute, textbox;
             if (valueIndex === void 0) { valueIndex = 0; }
             return __generator(this, function (_a) {
                 switch (_a.label) {
@@ -153,11 +153,18 @@ describe('attribute table tests', function () {
                         return [4 /*yield*/, user.click(screen.getByText('Edit'))];
                     case 3:
                         _a.sent();
-                        return [4 /*yield*/, user.type(screen.getByRole('textbox'), ' newValue')];
+                        textbox = screen.getByRole('textbox');
+                        return [4 /*yield*/, waitFor(function () { return expect(textbox.value).not.toBe(''); })];
                     case 4:
                         _a.sent();
-                        return [4 /*yield*/, user.keyboard('[Enter]')];
+                        return [4 /*yield*/, user.click(textbox)];
                     case 5:
+                        _a.sent();
+                        return [4 /*yield*/, user.paste(' newValue')];
+                    case 6:
+                        _a.sent();
+                        return [4 /*yield*/, user.keyboard('[Enter]')];
+                    case 7:
                         _a.sent();
                         return [2 /*return*/];
                 }

package/features/crosswalks/CrosswalkAttributes/CrosswalkAttributes.test.js

@@ -88,9 +88,10 @@ var defaultProps = {
     onEditAttribute: jest.fn(),
     onDeleteAttribute: jest.fn()
 };
-var setUp = function (props) {
+var setUp = function (props, _a) {
     if (props === void 0) { props = defaultProps; }
-    var user = userEvent.setup({ delay: null });
+    var _b = _a === void 0 ? {} : _a, _c = _b.useTypingDelay, useTypingDelay = _c === void 0 ? false : _c;
+    var user = useTypingDelay ? userEvent.setup() : userEvent.setup({ delay: null });
     var Providers = function (_a) {
         var children = _a.children;
         return (React.createElement(MdmModuleProvider, { values: { metadata: metadata } },
@@ -153,19 +154,23 @@ describe('CrosswalkAttributes tests', function () {
         });
     }); });
     it('should provide correct value to deleteDate editor and call props.onEditAttribute on editing', function () { return __awaiter(void 0, void 0, void 0, function () {
-        var deleteDate, newDeleteDate, user;
+        var deleteDate, newDeleteDate, user, textbox;
         return __generator(this, function (_a) {
             switch (_a.label) {
                 case 0:
                     deleteDate = '2021-02-02';
                     newDeleteDate = new Date('2021-01-01').valueOf();
-                    user = setUp(__assign(__assign({}, defaultProps), { crosswalk: __assign(__assign({}, crosswalk), { deleteDate: deleteDate }) })).user;
+                    user = setUp(__assign(__assign({}, defaultProps), { crosswalk: __assign(__assign({}, crosswalk), { deleteDate: deleteDate }) }), { useTypingDelay: true }).user;
                     expect(screen.getByDisplayValue(/^02\/02\/2021/)).toBeInTheDocument();
-                    return [4 /*yield*/, user.type(screen.getByRole('textbox'), '01/01/2021')];
+                    textbox = screen.getByRole('textbox');
+                    return [4 /*yield*/, user.clear(textbox)];
                 case 1:
                     _a.sent();
-                    return [4 /*yield*/, user.click(screen.getByText('Delete Date:'))];
+                    return [4 /*yield*/, user.type(textbox, '01/01/2021')];
                 case 2:
+                    _a.sent();
+                    return [4 /*yield*/, user.click(screen.getByText('Delete Date:'))];
+                case 3:
                     _a.sent();
                     expect(defaultProps.onEditAttribute).toHaveBeenCalledWith('deleteDate', newDeleteDate.toString());
                     return [2 /*return*/];

package/features/crosswalks/CrosswalkEditor/CrosswalkEditor.test.js

@@ -72,9 +72,10 @@ var defaultProps = {
     onAdd: jest.fn(),
     onClose: jest.fn()
 };
-var setUp = function (props) {
+var setUp = function (props, _a) {
     if (props === void 0) { props = defaultProps; }
-    var user = userEvent.setup({ delay: null });
+    var _b = _a === void 0 ? {} : _a, _c = _b.useTypingDelay, useTypingDelay = _c === void 0 ? false : _c;
+    var user = useTypingDelay ? userEvent.setup() : userEvent.setup({ delay: null });
     var Providers = function (_a) {
         var children = _a.children;
         return (React.createElement(MdmModuleProvider, { values: { metadata: metadata } },
@@ -155,11 +156,11 @@ describe('CrosswalkEditor tests', function () {
         });
     }); });
     it('should call onAdd with correct params if deleteDate and sourceTable params are filled', function () { return __awaiter(void 0, void 0, void 0, function () {
-        var user, backdrop;
+        var user, backdrop, dateTextbox;
         return __generator(this, function (_a) {
             switch (_a.label) {
                 case 0:
-                    user = setUp().user;
+                    user = setUp(defaultProps, { useTypingDelay: true }).user;
                     return [4 /*yield*/, user.click(screen.getByText('Add attributes'))];
                 case 1:
                     _a.sent();
@@ -179,23 +180,27 @@ describe('CrosswalkEditor tests', function () {
                     return [4 /*yield*/, user.type(screen.getAllByRole('textbox')[1], 's')];
                 case 6:
                     _a.sent();
-                    return [4 /*yield*/, user.type(screen.getAllByRole('textbox')[2], '01/01/2025 01:01:00 A')];
+                    dateTextbox = screen.getAllByRole('textbox')[2];
+                    return [4 /*yield*/, user.clear(dateTextbox)];
                 case 7:
                     _a.sent();
-                    return [4 /*yield*/, user.tab()];
+                    return [4 /*yield*/, user.type(dateTextbox, '01/01/2025 01:01:00 AM')];
                 case 8:
                     _a.sent();
-                    return [4 /*yield*/, user.click(screen.getByRole('combobox'))];
+                    return [4 /*yield*/, user.tab()];
                 case 9:
                     _a.sent();
-                    return [4 /*yield*/, user.click(screen.getByText('AHA'))];
+                    return [4 /*yield*/, user.click(screen.getByRole('combobox'))];
                 case 10:
                     _a.sent();
-                    return [4 /*yield*/, user.type(screen.getAllByRole('textbox')[0], 'v')];
+                    return [4 /*yield*/, user.click(screen.getByText('AHA'))];
                 case 11:
                     _a.sent();
-                    return [4 /*yield*/, user.click(screen.getByText('Add'))];
+                    return [4 /*yield*/, user.type(screen.getAllByRole('textbox')[0], 'v')];
                 case 12:
+                    _a.sent();
+                    return [4 /*yield*/, user.click(screen.getByText('Add'))];
+                case 13:
                     _a.sent();
                     expect(defaultProps.onAdd).toHaveBeenCalledWith({
                         type: 'configuration/sources/AHA',

package/features/crosswalks/CrosswalkRow/CrosswalkRow.test.js

@@ -94,10 +94,11 @@ var defaultProps = {
     onDelete: jest.fn(),
     onEdit: jest.fn()
 };
-var setUp = function (props, dndProps) {
+var setUp = function (props, dndProps, _a) {
     if (props === void 0) { props = defaultProps; }
     if (dndProps === void 0) { dndProps = {}; }
-    var user = userEvent.setup({ delay: null });
+    var _b = _a === void 0 ? {} : _a, _c = _b.useTypingDelay, useTypingDelay = _c === void 0 ? false : _c;
+    var user = useTypingDelay ? userEvent.setup() : userEvent.setup({ delay: null });
     var Providers = function (_a) {
         var children = _a.children;
         return (React.createElement(DndContext, __assign({}, dndProps),
@@ -366,13 +367,13 @@ describe('CrosswalkRow tests', function () {
         });
     }); });
     it('should call props.onEdit when calling CrosswalkAttributes onEditAttribute prop', function () { return __awaiter(void 0, void 0, void 0, function () {
-        var dateString, newDeleteDate, user, backdrop;
+        var dateString, newDeleteDate, user, backdrop, textbox;
         return __generator(this, function (_a) {
             switch (_a.label) {
                 case 0:
                     dateString = '01/01/2025 01:01:00';
                     newDeleteDate = new Date(dateString).valueOf();
-                    user = setUp().user;
+                    user = setUp(defaultProps, {}, { useTypingDelay: true }).user;
                     return [4 /*yield*/, user.click(screen.getByTestId('arrow-expand-button'))];
                 case 1:
                     _a.sent();
@@ -389,11 +390,15 @@ describe('CrosswalkRow tests', function () {
                     return [4 /*yield*/, screen.findByText('Delete Date:')];
                 case 5:
                     _a.sent();
-                    return [4 /*yield*/, user.type(screen.getByRole('textbox'), dateString + 'A')];
+                    textbox = screen.getByRole('textbox');
+                    return [4 /*yield*/, user.clear(textbox)];
                 case 6:
                     _a.sent();
-                    return [4 /*yield*/, user.click(screen.getByText('Delete Date:'))];
+                    return [4 /*yield*/, user.type(textbox, dateString + ' AM')];
                 case 7:
+                    _a.sent();
+                    return [4 /*yield*/, user.click(screen.getByText('Delete Date:'))];
+                case 8:
                     _a.sent();
                     expect(defaultProps.onEdit).toHaveBeenCalledWith({
                         crosswalkId: '1kQ5cap2n',

package/features/crosswalks/hooks/useAttributeActions.test.js

@@ -46,7 +46,7 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
     }
 };
 import { useAttributeActions } from './useAttributeActions';
-import { renderHook, act } from '@testing-library/react-hooks';
+import { renderHook, act } from '@testing-library/react';
 import { createAttribute, entityCumulativeDelete, entityCumulativeUpdate, ignoreAttribute, pinAttribute, removeRelation, updateAttribute } from '@reltio/mdm-sdk';
 jest.mock('@reltio/mdm-sdk', function () { return (__assign(__assign({}, jest.requireActual('@reltio/mdm-sdk')), { entityCumulativeDelete: jest.fn(), entityCumulativeUpdate: jest.fn(), ignoreAttribute: jest.fn(), pinAttribute: jest.fn(), removeRelation: jest.fn(), updateAttribute: jest.fn(), createAttribute: jest.fn() })); });
 describe('useAttributeActions', function () {

package/features/crosswalks/hooks/useCrosswalkActions.test.js

@@ -46,7 +46,7 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
     }
 };
 import { useCrosswalkActions } from './useCrosswalkActions';
-import { renderHook, act } from '@testing-library/react-hooks';
+import { renderHook, act } from '@testing-library/react';
 import { addCrosswalk, addCrosswalkInContributor, editCrosswalkAttribute, deleteCrosswalkAttribute, deleteCrosswalk } from '@reltio/mdm-sdk';
 jest.mock('@reltio/mdm-sdk', function () { return (__assign(__assign({}, jest.requireActual('@reltio/mdm-sdk')), { addCrosswalk: jest.fn(), addCrosswalkInContributor: jest.fn(), editCrosswalkAttribute: jest.fn(), deleteCrosswalkAttribute: jest.fn(), deleteCrosswalk: jest.fn() })); });
 describe('useCrosswalkActions tests', function () {

package/features/crosswalks/hooks/useModifiedEntity.js

@@ -91,10 +91,10 @@ export var useModifiedEntity = function (_a) {
         }
         setModifiedEntity(function (entity) {
             var _a;
-            if (isNil(index)) {
-                index = (_a = findAttributeValues(entity, parentUri, attributeType.name)) === null || _a === void 0 ? void 0 : _a.length;
-            }
-            return addNewAttribute({ entity: entity, attributeType: attributeType, newAttribute: newAttribute, index: index });
+            var targetIndex = isNil(index)
+                ? (_a = findAttributeValues(entity, parentUri, attributeType.name)) === null || _a === void 0 ? void 0 : _a.length
+                : index;
+            return addNewAttribute({ entity: entity, attributeType: attributeType, newAttribute: newAttribute, index: targetIndex });
         });
     }, []);
     var onDeleteAttribute = useCallback(function (event) {

package/features/crosswalks/hooks/useModifiedEntity.test.js

@@ -9,7 +9,7 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-import { renderHook, act } from '@testing-library/react-hooks';
+import { renderHook, act } from '@testing-library/react';
 import * as useAttributesActionsImport from './useAttributeActions';
 import { useModifiedEntity } from './useModifiedEntity';
 describe('useModifiedEntity', function () {