@mic-rexjs/usecases-react 2.3.1 → 2.3.4

package/lib/hooks/useUseCase/index.test.js

@@ -36,7 +36,8 @@ var fileUseCase = function fileUseCase() {
   var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   var entityReducers = (0, _usecases.objectUseCase)();
   var _options$pathPrefix = options.pathPrefix,
-    pathPrefix = _options$pathPrefix === void 0 ? '' : _options$pathPrefix;
+    pathPrefix = _options$pathPrefix === void 0 ? '' : _options$pathPrefix,
+    onPathChange = options.onPathChange;
   var init = function init(entity) {
     var newEntity = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : defaultFile;
     return /*#__PURE__*/_regenerator["default"].mark(function _callee() {
@@ -56,15 +57,20 @@ var fileUseCase = function fileUseCase() {
   };
   var setPath = /*#__PURE__*/_regenerator["default"].mark(function setPath(entity, path) {
     var _path$match;
+    var oldPath, newPath;
     return _regenerator["default"].wrap(function setPath$(_context2) {
       while (1) switch (_context2.prev = _context2.next) {
         case 0:
-          _context2.next = 2;
+          oldPath = entity.path;
+          newPath = pathPrefix + path;
+          _context2.next = 4;
           return _objectSpread(_objectSpread({}, entity), {}, {
-            path: pathPrefix + path,
+            path: newPath,
             ext: ((_path$match = path.match(/\.[^.]+$/)) === null || _path$match === void 0 ? void 0 : _path$match[0]) || ''
           });
-        case 2:
+        case 4:
+          onPathChange === null || onPathChange === void 0 || onPathChange(newPath, oldPath);
+        case 5:
         case "end":
           return _context2.stop();
       }
@@ -126,9 +132,6 @@ var mathUseCase = function mathUseCase() {
     subtraction: subtractionReducer
   };
 };
-var fieldPathUseCase = function fieldPathUseCase() {
-  return (0, _usecases.objectUseCase)();
-};
 var Child = function Child(_ref2) {
   var _ref2$textPrefix = _ref2.textPrefix,
     textPrefix = _ref2$textPrefix === void 0 ? '' : _ref2$textPrefix,
@@ -606,8 +609,46 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
         ext: EXT_1
       }), defaultFile);
     });
-    (0, _globals.test)('`options.options` should override rest options', function () {
+    (0, _globals.test)('`options.onChange` should always trigger the latest one', function () {
+      var onChange1 = _globals.jest.fn();
+      var onChange2 = _globals.jest.fn();
+      var onChange = onChange1;
       var _renderHook13 = (0, _react.renderHook)(function () {
+          return (0, _.useUseCase)(defaultFile, fileUseCase, {
+            onChange: onChange
+          }, []);
+        }),
+        result = _renderHook13.result;
+      var cores = result.current;
+      var _cores11 = (0, _slicedToArray2["default"])(cores, 2),
+        reducers = _cores11[1];
+      var setPath = reducers.setPath;
+      (0, _globals.expect)(onChange1).toHaveBeenCalledTimes(0);
+      (0, _react.act)(function () {
+        setPath(PATH_1);
+        onChange = onChange2;
+      });
+      (0, _globals.expect)(onChange2).toHaveBeenCalledTimes(0);
+      (0, _globals.expect)(onChange1).toHaveBeenCalledTimes(1);
+      (0, _globals.expect)(onChange1).toHaveBeenLastCalledWith(_objectSpread(_objectSpread({}, defaultFile), {}, {
+        path: PATH_1,
+        ext: EXT_1
+      }), defaultFile);
+      (0, _react.act)(function () {
+        setPath(PATH_2);
+      });
+      (0, _globals.expect)(onChange1).toHaveBeenCalledTimes(1);
+      (0, _globals.expect)(onChange2).toHaveBeenCalledTimes(1);
+      (0, _globals.expect)(onChange2).toHaveBeenLastCalledWith(_objectSpread(_objectSpread({}, defaultFile), {}, {
+        path: PATH_2,
+        ext: EXT_2
+      }), _objectSpread(_objectSpread({}, defaultFile), {}, {
+        path: PATH_1,
+        ext: EXT_1
+      }));
+    });
+    (0, _globals.test)('`options.options` should override rest options', function () {
+      var _renderHook14 = (0, _react.renderHook)(function () {
           return (0, _.useUseCase)(defaultFile, fileUseCase, {
             pathPrefix: 'xyz/',
             options: {
@@ -615,11 +656,11 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
             }
           });
         }),
-        result = _renderHook13.result;
+        result = _renderHook14.result;
       var cores = result.current;
-      var _cores11 = (0, _slicedToArray2["default"])(cores, 2),
-        path = _cores11[0].path,
-        reducers = _cores11[1];
+      var _cores12 = (0, _slicedToArray2["default"])(cores, 2),
+        path = _cores12[0].path,
+        reducers = _cores12[1];
       var setPath = reducers.setPath;
       (0, _globals.expect)(path).toBe('');
       (0, _react.act)(function () {
@@ -630,7 +671,7 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
     (0, _globals.test)('when `options` has changed, it should not trigger update', function () {
       var onUpdate = _globals.jest.fn();
       var onDeepUpdate = _globals.jest.fn();
-      var _renderHook14 = (0, _react.renderHook)(function () {
+      var _renderHook15 = (0, _react.renderHook)(function () {
           var _useState = (0, _react2.useState)('user/'),
             _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
             pathPrefix = _useState2[0],
@@ -646,7 +687,7 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
           }, [context]);
           return setPathPrefix;
         }),
-        result = _renderHook14.result;
+        result = _renderHook15.result;
       (0, _globals.expect)(onUpdate).toHaveBeenCalledTimes(0);
       (0, _globals.expect)(onDeepUpdate).toHaveBeenCalledTimes(0);
       (0, _react.act)(function () {
@@ -655,96 +696,10 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
       (0, _globals.expect)(onUpdate).toHaveBeenCalledTimes(0);
       (0, _globals.expect)(onDeepUpdate).toHaveBeenCalledTimes(0);
     });
-    (0, _globals.test)('when `entity` change, it should trigger watchers', function () {
-      var onPathChange = _globals.jest.fn();
-      var onSizeChange = _globals.jest.fn();
-      var _renderHook15 = (0, _react.renderHook)(function () {
-          return (0, _.useUseCase)(defaultFile, fileUseCase, {
-            watch: {
-              path: onPathChange,
-              size: onSizeChange
-            }
-          });
-        }),
-        result = _renderHook15.result;
-      var cores = result.current;
-      var _cores12 = (0, _slicedToArray2["default"])(cores, 2),
-        setPath = _cores12[1].setPath;
-      (0, _globals.expect)(onPathChange).toHaveBeenCalledTimes(0);
-      (0, _react.act)(function () {
-        setPath(PATH_1);
-      });
-      (0, _globals.expect)(onPathChange).toHaveBeenCalledTimes(1);
-      (0, _globals.expect)(onSizeChange).toHaveBeenCalledTimes(0);
-      (0, _globals.expect)(onPathChange).toHaveBeenLastCalledWith({
-        fieldPaths: ['path'],
-        newEntity: _objectSpread(_objectSpread({}, defaultFile), {}, {
-          path: PATH_1,
-          ext: EXT_1
-        }),
-        oldEntity: defaultFile,
-        newValue: PATH_1,
-        oldValue: ''
-      });
-    });
-    (0, _globals.test)('watcher should be updated after `entity` change', function () {
-      var onPathChange1 = _globals.jest.fn();
-      var onPathChange2 = _globals.jest.fn();
-      var onPathChange = onPathChange1;
-      var _renderHook16 = (0, _react.renderHook)(function () {
-          return (0, _.useUseCase)(defaultFile, fileUseCase, {
-            watch: {
-              path: onPathChange
-            }
-          });
-        }),
-        result = _renderHook16.result;
-      var cores = result.current;
-      var _cores13 = (0, _slicedToArray2["default"])(cores, 2),
-        _cores13$ = _cores13[1],
-        setPath = _cores13$.setPath,
-        setEntity = _cores13$.setEntity;
-      onPathChange = onPathChange2;
-      (0, _globals.expect)(onPathChange1).toHaveBeenCalledTimes(0);
-      (0, _react.act)(function () {
-        setPath(PATH_1);
-        setEntity({
-          size: 5000
-        });
-      });
-      (0, _globals.expect)(onPathChange1).toHaveBeenCalledTimes(1);
-      (0, _globals.expect)(onPathChange1).toHaveBeenLastCalledWith({
-        fieldPaths: ['path'],
-        newEntity: _objectSpread(_objectSpread({}, defaultFile), {}, {
-          path: PATH_1,
-          ext: EXT_1
-        }),
-        oldEntity: defaultFile,
-        newValue: PATH_1,
-        oldValue: ''
-      });
-      (0, _react.act)(function () {
-        setPath('');
-      });
-      (0, _globals.expect)(onPathChange2).toHaveBeenCalledTimes(1);
-      (0, _globals.expect)(onPathChange2).toHaveBeenLastCalledWith({
-        fieldPaths: ['path'],
-        newEntity: _objectSpread(_objectSpread({}, defaultFile), {}, {
-          size: 5000
-        }),
-        oldEntity: _objectSpread(_objectSpread({}, defaultFile), {}, {
-          path: PATH_1,
-          size: 5000,
-          ext: EXT_1
-        }),
-        newValue: '',
-        oldValue: PATH_1
-      });
-    });
     (0, _globals.test)('when `deps` has changed, it should trigger update', function () {
       var onUpdate = _globals.jest.fn();
       var onDeepUpdate = _globals.jest.fn();
-      var _renderHook17 = (0, _react.renderHook)(function () {
+      var _renderHook16 = (0, _react.renderHook)(function () {
           var _useState3 = (0, _react2.useState)('user/'),
             _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
             pathPrefix = _useState4[0],
@@ -760,7 +715,7 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
           }, [context]);
           return setPathPrefix;
         }),
-        result = _renderHook17.result;
+        result = _renderHook16.result;
       (0, _globals.expect)(onUpdate).toHaveBeenCalledTimes(0);
       (0, _globals.expect)(onDeepUpdate).toHaveBeenCalledTimes(0);
       (0, _react.act)(function () {
@@ -772,7 +727,7 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
     (0, _globals.test)('empty `deps` should not trigger update', function () {
       var onUpdate = _globals.jest.fn();
       var onDeepUpdate = _globals.jest.fn();
-      var _renderHook18 = (0, _react.renderHook)(function () {
+      var _renderHook17 = (0, _react.renderHook)(function () {
           var _useState5 = (0, _react2.useState)('user/'),
             _useState6 = (0, _slicedToArray2["default"])(_useState5, 2),
             pathPrefix = _useState6[0],
@@ -788,7 +743,7 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
           }, [context]);
           return setPathPrefix;
         }),
-        result = _renderHook18.result;
+        result = _renderHook17.result;
       (0, _globals.expect)(onUpdate).toHaveBeenCalledTimes(0);
       (0, _globals.expect)(onDeepUpdate).toHaveBeenCalledTimes(0);
       (0, _react.act)(function () {
@@ -797,627 +752,32 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
       (0, _globals.expect)(onUpdate).toHaveBeenCalledTimes(0);
       (0, _globals.expect)(onDeepUpdate).toHaveBeenCalledTimes(0);
     });
-    (0, _globals.test)('`options.watch` should be trigger at child elements', function () {
-      var onFirstExtChange = _globals.jest.fn();
-      var onSecondExtChange = _globals.jest.fn();
-      var onParentExtChange = _globals.jest.fn();
-      var onExtChange = onFirstExtChange;
-      var firstButtonText = 'first button';
-      var secondButtonText = 'second button';
-      var A = function A() {
-        (0, _.useUseCase)(fileUseCase, {
-          watch: {
-            ext: onExtChange
-          }
-        });
-        return (0, _jsxRuntime.jsx)(_react2.Fragment, {});
-      };
-      var B = function B() {
-        var _useUseCase12 = (0, _.useUseCase)(defaultFile, fileUseCase, {
-            watch: {
-              ext: onParentExtChange
-            }
-          }),
-          _useUseCase13 = (0, _slicedToArray2["default"])(_useUseCase12, 3),
-          setPath = _useUseCase13[1].setPath,
-          Provider = _useUseCase13[2];
-        var onFirstClick = function onFirstClick() {
-          setPath(PATH_1);
-          onExtChange = onSecondExtChange;
-        };
-        var onSecondClick = function onSecondClick() {
-          setPath('');
-        };
-        return (0, _jsxRuntime.jsxs)(Provider, {
-          children: [(0, _jsxRuntime.jsx)(A, {}), (0, _jsxRuntime.jsx)("button", {
-            onClick: onFirstClick,
-            children: firstButtonText
-          }), (0, _jsxRuntime.jsx)("button", {
-            onClick: onSecondClick,
-            children: secondButtonText
-          })]
-        });
-      };
-      (0, _react.render)((0, _jsxRuntime.jsx)(B, {}));
-      (0, _globals.expect)(onFirstExtChange).toHaveBeenCalledTimes(0);
-      _react.fireEvent.click(_react.screen.getByText(firstButtonText));
-      (0, _globals.expect)(onFirstExtChange).toHaveBeenCalledTimes(1);
-      (0, _globals.expect)(onFirstExtChange).toHaveBeenLastCalledWith({
-        fieldPaths: ['ext'],
-        newEntity: _objectSpread(_objectSpread({}, defaultFile), {}, {
-          ext: EXT_1,
-          path: PATH_1
-        }),
-        oldEntity: defaultFile,
-        newValue: EXT_1,
-        oldValue: ''
-      });
-      (0, _globals.expect)(onParentExtChange).toHaveBeenCalledTimes(1);
-      (0, _globals.expect)(onSecondExtChange).toHaveBeenCalledTimes(0);
-      _react.fireEvent.click(_react.screen.getByText(secondButtonText));
-      (0, _globals.expect)(onSecondExtChange).toHaveBeenCalledTimes(1);
-      (0, _globals.expect)(onSecondExtChange).toHaveBeenLastCalledWith({
-        fieldPaths: ['ext'],
-        newEntity: defaultFile,
-        oldEntity: _objectSpread(_objectSpread({}, defaultFile), {}, {
-          ext: EXT_1,
-          path: PATH_1
-        }),
-        newValue: '',
-        oldValue: EXT_1
-      });
-      (0, _globals.expect)(onFirstExtChange).toHaveBeenCalledTimes(1);
-      (0, _globals.expect)(onParentExtChange).toHaveBeenCalledTimes(2);
-    });
-    (0, _globals.test)('`options.watch` should be trigger in orders', function () {
-      var changeTimes = 0;
-      var updateChangeTimes = function updateChangeTimes(e) {
-        void e;
-        return ++changeTimes;
-      };
-      var onChangeA = _globals.jest.fn(updateChangeTimes);
-      var onChangeB = _globals.jest.fn(updateChangeTimes);
-      var onChangeC = _globals.jest.fn(updateChangeTimes);
-      var buttonText = 'my button';
-      var A = function A(_ref7) {
-        var children = _ref7.children;
-        (0, _.useUseCase)(fileUseCase, {
-          watch: {
-            ext: onChangeA
-          }
-        });
-        return (0, _jsxRuntime.jsx)(_react2.Fragment, {
-          children: children
-        });
-      };
-      var B = function B() {
-        (0, _.useUseCase)(fileUseCase, {
-          watch: {
-            ext: onChangeB
-          }
-        });
-        return (0, _jsxRuntime.jsx)(_react2.Fragment, {});
-      };
-      var C = function C() {
-        var _useUseCase14 = (0, _.useUseCase)(defaultFile, fileUseCase, {
-            watch: {
-              ext: onChangeC
-            }
-          }),
-          _useUseCase15 = (0, _slicedToArray2["default"])(_useUseCase14, 3),
-          setPath = _useUseCase15[1].setPath,
-          Provider = _useUseCase15[2];
-        var onFirstClick = function onFirstClick() {
-          setPath(PATH_1);
-        };
-        return (0, _jsxRuntime.jsxs)(Provider, {
-          children: [(0, _jsxRuntime.jsx)(A, {
-            children: (0, _jsxRuntime.jsx)(B, {})
-          }), (0, _jsxRuntime.jsx)("button", {
-            onClick: onFirstClick,
-            children: buttonText
-          })]
-        });
-      };
-      (0, _react.render)((0, _jsxRuntime.jsx)(C, {}));
-      (0, _globals.expect)(changeTimes).toBe(0);
-      _react.fireEvent.click(_react.screen.getByText(buttonText));
-      (0, _globals.expect)(onChangeA).toHaveReturnedWith(2);
-      (0, _globals.expect)(onChangeB).toHaveReturnedWith(1);
-      (0, _globals.expect)(onChangeC).toHaveReturnedWith(3);
-    });
-    (0, _globals.test)('`options.watch` should work with array field path of array', function () {
-      var onExtChange = _globals.jest.fn();
-      var onSizeChange = _globals.jest.fn();
-      var _renderHook19 = (0, _react.renderHook)(function () {
-          return (0, _.useUseCase)({}, fieldPathUseCase, {
-            watch: {
-              'list.ext': onExtChange,
-              'list.size': onSizeChange
-            }
-          });
-        }),
-        result = _renderHook19.result;
-      var cores = result.current;
-      var _cores14 = (0, _slicedToArray2["default"])(cores, 2),
-        setEntity = _cores14[1].setEntity;
-      (0, _react.act)(function () {
-        setEntity({
-          list: [defaultFile]
-        });
-      });
-      (0, _globals.expect)(onExtChange).toHaveBeenCalledTimes(1);
-      (0, _globals.expect)(onSizeChange).toHaveBeenCalledTimes(1);
-      (0, _globals.expect)(onExtChange).toHaveBeenCalledWith({
-        fieldPaths: ['list', '0', 'ext'],
-        newEntity: {
-          list: [defaultFile]
-        },
-        oldEntity: {},
-        newValue: '',
-        oldValue: void 0
-      });
-      (0, _globals.expect)(onSizeChange).toHaveBeenCalledWith({
-        fieldPaths: ['list', '0', 'size'],
-        newEntity: {
-          list: [defaultFile]
-        },
-        oldEntity: {},
-        newValue: 0,
-        oldValue: void 0
-      });
-      (0, _react.act)(function () {
-        setEntity({
-          list: [_objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_1
-          })]
-        });
-      });
-      (0, _globals.expect)(onExtChange).toHaveBeenCalledTimes(2);
-      (0, _globals.expect)(onSizeChange).toHaveBeenCalledTimes(1);
-      (0, _globals.expect)(onExtChange).toHaveBeenCalledWith({
-        fieldPaths: ['list', '0', 'ext'],
-        newEntity: {
-          list: [_objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_1
-          })]
-        },
-        oldEntity: {
-          list: [defaultFile]
-        },
-        newValue: EXT_1,
-        oldValue: ''
-      });
-      (0, _react.act)(function () {
-        setEntity({
-          list: [_objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_1
-          }), _objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_2
-          })]
-        });
-      });
-      (0, _globals.expect)(onExtChange).toHaveBeenCalledTimes(3);
-      (0, _globals.expect)(onSizeChange).toHaveBeenCalledTimes(2);
-      (0, _globals.expect)(onExtChange).toHaveBeenCalledWith({
-        fieldPaths: ['list', '1', 'ext'],
-        newEntity: {
-          list: [_objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_1
-          }), _objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_2
-          })]
-        },
-        oldEntity: {
-          list: [_objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_1
-          })]
-        },
-        newValue: EXT_2,
-        oldValue: void 0
-      });
-      (0, _globals.expect)(onSizeChange).toHaveBeenCalledWith({
-        fieldPaths: ['list', '1', 'size'],
-        newEntity: {
-          list: [_objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_1
-          }), _objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_2
-          })]
-        },
-        oldEntity: {
-          list: [_objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_1
-          })]
-        },
-        newValue: 0,
-        oldValue: void 0
-      });
-      (0, _react.act)(function () {
-        setEntity({
-          nestedList: []
-        });
-      });
-      (0, _globals.expect)(onExtChange).toHaveBeenCalledTimes(3);
-      (0, _globals.expect)(onSizeChange).toHaveBeenCalledTimes(2);
-      (0, _react.act)(function () {
-        setEntity(function () {
-          return {
-            list: [_objectSpread(_objectSpread({}, defaultFile), {}, {
-              ext: EXT_2
-            }), _objectSpread(_objectSpread({}, defaultFile), {}, {
-              ext: EXT_1
-            }), defaultFile]
-          };
-        });
-      });
-      (0, _globals.expect)(onExtChange).toHaveBeenCalledTimes(6);
-      (0, _globals.expect)(onSizeChange).toHaveBeenCalledTimes(3);
-      (0, _globals.expect)(onExtChange).toHaveBeenNthCalledWith(4, {
-        fieldPaths: ['list', '0', 'ext'],
-        newEntity: {
-          list: [_objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_2
-          }), _objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_1
-          }), defaultFile]
-        },
-        oldEntity: {
-          list: [_objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_1
-          }), _objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_2
-          })],
-          nestedList: []
-        },
-        newValue: EXT_2,
-        oldValue: EXT_1
-      });
-      (0, _globals.expect)(onExtChange).toHaveBeenNthCalledWith(5, {
-        fieldPaths: ['list', '1', 'ext'],
-        newEntity: {
-          list: [_objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_2
-          }), _objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_1
-          }), defaultFile]
-        },
-        oldEntity: {
-          list: [_objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_1
-          }), _objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_2
-          })],
-          nestedList: []
-        },
-        newValue: EXT_1,
-        oldValue: EXT_2
-      });
-      (0, _globals.expect)(onExtChange).toHaveBeenNthCalledWith(6, {
-        fieldPaths: ['list', '2', 'ext'],
-        newEntity: {
-          list: [_objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_2
-          }), _objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_1
-          }), defaultFile]
-        },
-        oldEntity: {
-          list: [_objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_1
-          }), _objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_2
-          })],
-          nestedList: []
-        },
-        newValue: '',
-        oldValue: void 0
-      });
-      (0, _globals.expect)(onSizeChange).toHaveBeenCalledWith({
-        fieldPaths: ['list', '2', 'size'],
-        newEntity: {
-          list: [_objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_2
-          }), _objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_1
-          }), defaultFile]
-        },
-        oldEntity: {
-          list: [_objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_1
-          }), _objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_2
-          })],
-          nestedList: []
-        },
-        newValue: 0,
-        oldValue: void 0
-      });
-      (0, _react.act)(function () {
-        setEntity(function () {
-          return {};
-        });
-      });
-      (0, _globals.expect)(onExtChange).toHaveBeenCalledTimes(9);
-      (0, _globals.expect)(onSizeChange).toHaveBeenCalledTimes(6);
-      (0, _globals.expect)(onExtChange).toHaveBeenNthCalledWith(7, {
-        fieldPaths: ['list', '0', 'ext'],
-        newEntity: {},
-        oldEntity: {
-          list: [_objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_2
-          }), _objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_1
-          }), defaultFile]
-        },
-        newValue: void 0,
-        oldValue: EXT_2
-      });
-      (0, _globals.expect)(onExtChange).toHaveBeenNthCalledWith(8, {
-        fieldPaths: ['list', '1', 'ext'],
-        newEntity: {},
-        oldEntity: {
-          list: [_objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_2
-          }), _objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_1
-          }), defaultFile]
-        },
-        newValue: void 0,
-        oldValue: EXT_1
-      });
-      (0, _globals.expect)(onExtChange).toHaveBeenNthCalledWith(9, {
-        fieldPaths: ['list', '2', 'ext'],
-        newEntity: {},
-        oldEntity: {
-          list: [_objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_2
-          }), _objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_1
-          }), defaultFile]
-        },
-        newValue: void 0,
-        oldValue: ''
-      });
-      (0, _globals.expect)(onSizeChange).toHaveBeenNthCalledWith(4, {
-        fieldPaths: ['list', '0', 'size'],
-        newEntity: {},
-        oldEntity: {
-          list: [_objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_2
-          }), _objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_1
-          }), defaultFile]
-        },
-        newValue: void 0,
-        oldValue: 0
-      });
-      (0, _globals.expect)(onSizeChange).toHaveBeenNthCalledWith(5, {
-        fieldPaths: ['list', '1', 'size'],
-        newEntity: {},
-        oldEntity: {
-          list: [_objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_2
-          }), _objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_1
-          }), defaultFile]
-        },
-        newValue: void 0,
-        oldValue: 0
-      });
-      (0, _globals.expect)(onSizeChange).toHaveBeenNthCalledWith(6, {
-        fieldPaths: ['list', '2', 'size'],
-        newEntity: {},
-        oldEntity: {
-          list: [_objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_2
-          }), _objectSpread(_objectSpread({}, defaultFile), {}, {
-            ext: EXT_1
-          }), defaultFile]
-        },
-        newValue: void 0,
-        oldValue: 0
-      });
-    });
-    (0, _globals.test)('`options.watch` should work with field path of array length', function () {
-      var onEntityLengthChange = _globals.jest.fn();
-      var onListLengthChange = _globals.jest.fn();
-      var lengthUseCase = function lengthUseCase() {
-        return (0, _usecases.entityUseCase)();
-      };
-      var _renderHook20 = (0, _react.renderHook)(function () {
-          return (0, _.useUseCase)([], lengthUseCase, {
-            watch: {
-              length: onEntityLengthChange,
-              'list.length': onListLengthChange
-            }
-          });
-        }),
-        result = _renderHook20.result;
-      var cores = result.current;
-      var _cores15 = (0, _slicedToArray2["default"])(cores, 2),
-        setEntity = _cores15[1].setEntity;
-      (0, _globals.expect)(onEntityLengthChange).toHaveBeenCalledTimes(0);
-      (0, _globals.expect)(onListLengthChange).toHaveBeenCalledTimes(0);
-      (0, _react.act)(function () {
-        setEntity([{
-          list: [defaultFile, defaultFile]
-        }]);
-      });
-      (0, _globals.expect)(onEntityLengthChange).toHaveBeenCalledTimes(1);
-      (0, _globals.expect)(onListLengthChange).toHaveBeenCalledTimes(1);
-      (0, _globals.expect)(onEntityLengthChange).toHaveBeenCalledWith({
-        fieldPaths: ['length'],
-        newEntity: [{
-          list: [defaultFile, defaultFile]
-        }],
-        oldEntity: [],
-        newValue: 1,
-        oldValue: 0
-      });
-      (0, _globals.expect)(onListLengthChange).toHaveBeenCalledWith({
-        fieldPaths: ['0', 'list', 'length'],
-        newEntity: [{
-          list: [defaultFile, defaultFile]
-        }],
-        oldEntity: [],
-        newValue: 2,
-        oldValue: void 0
-      });
-    });
-    (0, _globals.test)('`options.watch` should work with field path of nested array', function () {
-      var onChange = _globals.jest.fn();
-      var _renderHook21 = (0, _react.renderHook)(function () {
-          return (0, _.useUseCase)({}, fieldPathUseCase, {
-            watch: {
-              'nestedList.size': onChange
-            }
-          });
-        }),
-        result = _renderHook21.result;
-      var cores = result.current;
-      var _cores16 = (0, _slicedToArray2["default"])(cores, 2),
-        setEntity = _cores16[1].setEntity;
-      (0, _globals.expect)(onChange).toHaveBeenCalledTimes(0);
-      (0, _react.act)(function () {
-        setEntity({
-          nestedList: [[[defaultFile]]]
-        });
-      });
-      (0, _globals.expect)(onChange).toHaveBeenCalledTimes(1);
-      (0, _globals.expect)(onChange).toHaveBeenCalledWith({
-        fieldPaths: ['nestedList', '0', '0', '0', 'size'],
-        newEntity: {
-          nestedList: [[[defaultFile]]]
-        },
-        oldEntity: {},
-        newValue: 0,
-        oldValue: void 0
-      });
-      (0, _react.act)(function () {
-        setEntity({
-          nestedList: [[[_objectSpread(_objectSpread({}, defaultFile), {}, {
-            size: 100
-          }), _objectSpread(_objectSpread({}, defaultFile), {}, {
-            size: 200
-          })]], [[_objectSpread(_objectSpread({}, defaultFile), {}, {
-            size: 300
-          })]]]
-        });
-      });
-      (0, _globals.expect)(onChange).toHaveBeenCalledTimes(4);
-      (0, _globals.expect)(onChange).toHaveBeenNthCalledWith(2, {
-        fieldPaths: ['nestedList', '0', '0', '0', 'size'],
-        newEntity: {
-          nestedList: [[[_objectSpread(_objectSpread({}, defaultFile), {}, {
-            size: 100
-          }), _objectSpread(_objectSpread({}, defaultFile), {}, {
-            size: 200
-          })]], [[_objectSpread(_objectSpread({}, defaultFile), {}, {
-            size: 300
-          })]]]
-        },
-        oldEntity: {
-          nestedList: [[[defaultFile]]]
-        },
-        newValue: 100,
-        oldValue: 0
-      });
-      (0, _globals.expect)(onChange).toHaveBeenNthCalledWith(3, {
-        fieldPaths: ['nestedList', '0', '0', '1', 'size'],
-        newEntity: {
-          nestedList: [[[_objectSpread(_objectSpread({}, defaultFile), {}, {
-            size: 100
-          }), _objectSpread(_objectSpread({}, defaultFile), {}, {
-            size: 200
-          })]], [[_objectSpread(_objectSpread({}, defaultFile), {}, {
-            size: 300
-          })]]]
-        },
-        oldEntity: {
-          nestedList: [[[defaultFile]]]
-        },
-        newValue: 200,
-        oldValue: void 0
-      });
-      (0, _globals.expect)(onChange).toHaveBeenNthCalledWith(4, {
-        fieldPaths: ['nestedList', '1', '0', '0', 'size'],
-        newEntity: {
-          nestedList: [[[_objectSpread(_objectSpread({}, defaultFile), {}, {
-            size: 100
-          }), _objectSpread(_objectSpread({}, defaultFile), {}, {
-            size: 200
-          })]], [[_objectSpread(_objectSpread({}, defaultFile), {}, {
-            size: 300
-          })]]]
-        },
-        oldEntity: {
-          nestedList: [[[defaultFile]]]
-        },
-        newValue: 300,
-        oldValue: void 0
-      });
-    });
-    (0, _globals.test)('`options.watch` should work with field path of object', function () {
-      var onExtChange = _globals.jest.fn();
-      var onSizeChange = _globals.jest.fn();
-      var _renderHook22 = (0, _react.renderHook)(function () {
-          return (0, _.useUseCase)({}, fieldPathUseCase, {
-            watch: {
-              'obj.file.ext': onExtChange,
-              'obj.file.size': onSizeChange
-            }
+    (0, _globals.test)("should call latest functions of usecase options even deps has not change", function () {
+      var onPathChange1 = _globals.jest.fn();
+      var onPathChange2 = _globals.jest.fn();
+      var onPathChange = onPathChange1;
+      var _renderHook18 = (0, _react.renderHook)(function () {
+          return (0, _.useUseCase)(defaultFile, fileUseCase, {
+            onPathChange: onPathChange
           });
         }),
-        result = _renderHook22.result;
-      var cores = result.current;
-      var _cores17 = (0, _slicedToArray2["default"])(cores, 2),
-        setEntity = _cores17[1].setEntity;
-      (0, _globals.expect)(onExtChange).toHaveBeenCalledTimes(0);
+        result = _renderHook18.result;
+      var context = result.current;
+      var _context6 = (0, _slicedToArray2["default"])(context, 2),
+        setPath = _context6[1].setPath;
       (0, _react.act)(function () {
-        setEntity({
-          obj: {
-            file: {
-              ext: EXT_1
-            }
-          }
-        });
-      });
-      (0, _globals.expect)(onExtChange).toHaveBeenCalledTimes(1);
-      (0, _globals.expect)(onSizeChange).toHaveBeenCalledTimes(0);
-      (0, _globals.expect)(onExtChange).toHaveBeenCalledWith({
-        fieldPaths: ['obj', 'file', 'ext'],
-        newEntity: {
-          obj: {
-            file: {
-              ext: EXT_1
-            }
-          }
-        },
-        oldEntity: {},
-        newValue: EXT_1,
-        oldValue: void 0
+        setPath(PATH_1);
+        onPathChange = onPathChange2;
       });
+      (0, _globals.expect)(onPathChange1).toHaveBeenCalledTimes(1);
+      (0, _globals.expect)(onPathChange2).toHaveBeenCalledTimes(0);
+      (0, _globals.expect)(onPathChange1).toHaveBeenLastCalledWith(PATH_1, '');
       (0, _react.act)(function () {
-        setEntity(function () {
-          return {};
-        });
-      });
-      (0, _globals.expect)(onExtChange).toHaveBeenCalledTimes(2);
-      (0, _globals.expect)(onSizeChange).toHaveBeenCalledTimes(0);
-      (0, _globals.expect)(onExtChange).toHaveBeenCalledWith({
-        fieldPaths: ['obj', 'file', 'ext'],
-        newEntity: {},
-        oldEntity: {
-          obj: {
-            file: {
-              ext: EXT_1
-            }
-          }
-        },
-        newValue: void 0,
-        oldValue: EXT_1
+        setPath(PATH_2);
       });
+      (0, _globals.expect)(onPathChange1).toHaveBeenCalledTimes(1);
+      (0, _globals.expect)(onPathChange2).toHaveBeenCalledTimes(1);
+      (0, _globals.expect)(onPathChange2).toHaveBeenLastCalledWith(PATH_2, PATH_1);
     });
     (0, _globals.test)('multiple `Provider` should work', function () {
       var onNumberMount = _globals.jest.fn();
@@ -1433,15 +793,15 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
         return (0, _usecases.objectUseCase)();
       };
       var TestChildComponent = function TestChildComponent() {
-        var _useUseCase16 = (0, _.useUseCase)(numberUseCase),
+        var _useUseCase12 = (0, _.useUseCase)(numberUseCase),
+          _useUseCase13 = (0, _slicedToArray2["default"])(_useUseCase12, 1),
+          numberValue = _useUseCase13[0];
+        var _useUseCase14 = (0, _.useUseCase)(stringUseCase),
+          _useUseCase15 = (0, _slicedToArray2["default"])(_useUseCase14, 1),
+          stringValue = _useUseCase15[0];
+        var _useUseCase16 = (0, _.useUseCase)(booleanUseCase),
           _useUseCase17 = (0, _slicedToArray2["default"])(_useUseCase16, 1),
-          numberValue = _useUseCase17[0];
-        var _useUseCase18 = (0, _.useUseCase)(stringUseCase),
-          _useUseCase19 = (0, _slicedToArray2["default"])(_useUseCase18, 1),
-          stringValue = _useUseCase19[0];
-        var _useUseCase20 = (0, _.useUseCase)(booleanUseCase),
-          _useUseCase21 = (0, _slicedToArray2["default"])(_useUseCase20, 1),
-          booleanValue = _useUseCase21[0];
+          booleanValue = _useUseCase17[0];
         (0, _ahooks.useMount)(function () {
           onNumberMount(numberValue);
           onStringMount(stringValue);
@@ -1450,15 +810,15 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
         return null;
       };
       var TestParentComponent = function TestParentComponent() {
-        var _useUseCase22 = (0, _.useUseCase)(11, numberUseCase),
+        var _useUseCase18 = (0, _.useUseCase)(11, numberUseCase),
+          _useUseCase19 = (0, _slicedToArray2["default"])(_useUseCase18, 3),
+          NumberProvider = _useUseCase19[2];
+        var _useUseCase20 = (0, _.useUseCase)('hello', stringUseCase),
+          _useUseCase21 = (0, _slicedToArray2["default"])(_useUseCase20, 3),
+          StringProvider = _useUseCase21[2];
+        var _useUseCase22 = (0, _.useUseCase)(true, booleanUseCase),
           _useUseCase23 = (0, _slicedToArray2["default"])(_useUseCase22, 3),
-          NumberProvider = _useUseCase23[2];
-        var _useUseCase24 = (0, _.useUseCase)('hello', stringUseCase),
-          _useUseCase25 = (0, _slicedToArray2["default"])(_useUseCase24, 3),
-          StringProvider = _useUseCase25[2];
-        var _useUseCase26 = (0, _.useUseCase)(true, booleanUseCase),
-          _useUseCase27 = (0, _slicedToArray2["default"])(_useUseCase26, 3),
-          BooleanProvider = _useUseCase27[2];
+          BooleanProvider = _useUseCase23[2];
         return (0, _jsxRuntime.jsx)(NumberProvider, {
           "with": [StringProvider, BooleanProvider],
           children: (0, _jsxRuntime.jsx)(TestChildComponent, {})
@@ -1471,29 +831,29 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
     });
   });
   (0, _globals.describe)('`useUseCase` should work the same as `ModeCoreCollectionHook`', function () {
-    _globals.test.each([_UseCaseModes.UseCaseModes.Normal, _UseCaseModes.UseCaseModes.Stateless])('check context type', function (mode) {
-      var _renderHook23 = (0, _react.renderHook)(function () {
+    _globals.test.each([_UseCaseModes.UseCaseModes.Normal, _UseCaseModes.UseCaseModes.Stateless])('[mode=%s]: check context type', function (mode) {
+      var _renderHook19 = (0, _react.renderHook)(function () {
           return (0, _.useUseCase)(defaultFile, fileUseCase, mode);
         }),
-        result = _renderHook23.result;
+        result = _renderHook19.result;
       var cores = result.current;
       (0, _globals.expect)(Array.isArray(cores)).toBe(true);
       (0, _globals.expect)(cores).toHaveLength(3);
     });
     (0, _globals.test)('stateless mode should not generate new reducers when `yeild entity`', function () {
       var onUpdate = _globals.jest.fn();
-      var _renderHook24 = (0, _react.renderHook)(function () {
+      var _renderHook20 = (0, _react.renderHook)(function () {
           var file = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : defaultFile;
           (0, _ahooks.useUpdateEffect)(function () {
             onUpdate();
           });
           return (0, _.useUseCase)(file, fileUseCase, _UseCaseModes.UseCaseModes.Stateless);
         }),
-        result = _renderHook24.result,
-        rerender = _renderHook24.rerender;
+        result = _renderHook20.result,
+        rerender = _renderHook20.rerender;
       var cores = result.current;
-      var _cores18 = (0, _slicedToArray2["default"])(cores, 2),
-        setPath = _cores18[1].setPath;
+      var _cores13 = (0, _slicedToArray2["default"])(cores, 2),
+        setPath = _cores13[1].setPath;
       setPath(PATH_1);
       (0, _globals.expect)(onUpdate).toHaveBeenCalledTimes(0);
       (0, _globals.expect)(result.current[0].path).toBe('');
@@ -1506,16 +866,16 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
     });
     (0, _globals.test)('stateless mode should not trigger update when after `yield entity`', function () {
       var onUpdate = _globals.jest.fn();
-      var _renderHook25 = (0, _react.renderHook)(function () {
+      var _renderHook21 = (0, _react.renderHook)(function () {
           (0, _ahooks.useUpdateEffect)(function () {
             onUpdate();
           });
           return (0, _.useUseCase)(defaultFile, fileUseCase, _UseCaseModes.UseCaseModes.Stateless);
         }),
-        result = _renderHook25.result;
+        result = _renderHook21.result;
       var cores = result.current;
-      var _cores19 = (0, _slicedToArray2["default"])(cores, 2),
-        reducers = _cores19[1];
+      var _cores14 = (0, _slicedToArray2["default"])(cores, 2),
+        reducers = _cores14[1];
       var setPath = reducers.setPath;
       (0, _react.act)(function () {
         setPath(PATH_1);
@@ -1590,9 +950,9 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
         return (0, _jsxRuntime.jsx)(_react2.Fragment, {});
       };
       var B = function B() {
-        var _useUseCase28 = (0, _.useUseCase)(defaultFile, mockUseCase),
-          _useUseCase29 = (0, _slicedToArray2["default"])(_useUseCase28, 3),
-          Provider = _useUseCase29[2];
+        var _useUseCase24 = (0, _.useUseCase)(defaultFile, mockUseCase),
+          _useUseCase25 = (0, _slicedToArray2["default"])(_useUseCase24, 3),
+          Provider = _useUseCase25[2];
         return (0, _jsxRuntime.jsx)(Provider, {
           children: (0, _jsxRuntime.jsx)(A, {})
         });
@@ -1612,9 +972,9 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
         });
       };
       var A = function A() {
-        var _useUseCase30 = (0, _.useUseCase)(stringUseCase),
-          _useUseCase31 = (0, _slicedToArray2["default"])(_useUseCase30, 2),
-          add = _useUseCase31[1].add;
+        var _useUseCase26 = (0, _.useUseCase)(stringUseCase),
+          _useUseCase27 = (0, _slicedToArray2["default"])(_useUseCase26, 2),
+          add = _useUseCase27[1].add;
         var update = (0, _ahooks.useUpdate)();
         var onClick = function onClick() {
           update();
@@ -1626,9 +986,9 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
         });
       };
       var B = function B() {
-        var _useUseCase32 = (0, _.useUseCase)('', stringUseCase),
-          _useUseCase33 = (0, _slicedToArray2["default"])(_useUseCase32, 3),
-          Provider = _useUseCase33[2];
+        var _useUseCase28 = (0, _.useUseCase)('', stringUseCase),
+          _useUseCase29 = (0, _slicedToArray2["default"])(_useUseCase28, 3),
+          Provider = _useUseCase29[2];
         return (0, _jsxRuntime.jsx)(Provider, {
           children: (0, _jsxRuntime.jsx)(A, {})
         });
@@ -1652,9 +1012,9 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
         });
       };
       var A = function A() {
-        var _useUseCase34 = (0, _.useUseCase)(stringUseCase),
-          _useUseCase35 = (0, _slicedToArray2["default"])(_useUseCase34, 2),
-          add = _useUseCase35[1].add;
+        var _useUseCase30 = (0, _.useUseCase)(stringUseCase),
+          _useUseCase31 = (0, _slicedToArray2["default"])(_useUseCase30, 2),
+          add = _useUseCase31[1].add;
         var onClick = function onClick() {
           add('x');
         };
@@ -1668,9 +1028,9 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
         });
       };
       var B = function B() {
-        var _useUseCase36 = (0, _.useUseCase)('', stringUseCase),
-          _useUseCase37 = (0, _slicedToArray2["default"])(_useUseCase36, 3),
-          Provider = _useUseCase37[2];
+        var _useUseCase32 = (0, _.useUseCase)('', stringUseCase),
+          _useUseCase33 = (0, _slicedToArray2["default"])(_useUseCase32, 3),
+          Provider = _useUseCase33[2];
         return (0, _jsxRuntime.jsx)(Provider, {
           children: (0, _jsxRuntime.jsx)(A, {})
         });
@@ -1698,11 +1058,11 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
         });
       };
       var A = function A() {
-        var _useUseCase38 = (0, _.useUseCase)(stringUseCase),
-          _useUseCase39 = (0, _slicedToArray2["default"])(_useUseCase38, 2),
-          _useUseCase39$ = _useUseCase39[1],
-          add = _useUseCase39$.add,
-          setEntity = _useUseCase39$.setEntity;
+        var _useUseCase34 = (0, _.useUseCase)(stringUseCase),
+          _useUseCase35 = (0, _slicedToArray2["default"])(_useUseCase34, 2),
+          _useUseCase35$ = _useUseCase35[1],
+          add = _useUseCase35$.add,
+          setEntity = _useUseCase35$.setEntity;
         var update = (0, _ahooks.useUpdate)();
         add(addedText);
         var onSet = function onSet() {
@@ -1722,9 +1082,9 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
         });
       };
       var B = function B() {
-        var _useUseCase40 = (0, _.useUseCase)('', stringUseCase),
-          _useUseCase41 = (0, _slicedToArray2["default"])(_useUseCase40, 3),
-          Provider = _useUseCase41[2];
+        var _useUseCase36 = (0, _.useUseCase)('', stringUseCase),
+          _useUseCase37 = (0, _slicedToArray2["default"])(_useUseCase36, 3),
+          Provider = _useUseCase37[2];
         return (0, _jsxRuntime.jsx)(Provider, {
           children: (0, _jsxRuntime.jsx)(A, {})
         });
@@ -1744,62 +1104,6 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
       _react.fireEvent.click(_react.screen.getByText(updateButtonText));
       (0, _globals.expect)(addReducer).toHaveBeenCalledTimes(3);
     });
-    (0, _globals.test)('`options.onChange` event should be trigger at child elements', function () {
-      var onFirstChange = _globals.jest.fn();
-      var onSecondChange = _globals.jest.fn();
-      var onParentPathChange = _globals.jest.fn();
-      var firstButtonText = 'first button';
-      var secondButtonText = 'second button';
-      var onChange = onFirstChange;
-      var A = function A() {
-        (0, _.useUseCase)(fileUseCase, {
-          onChange: onChange
-        });
-        return (0, _jsxRuntime.jsx)(_react2.Fragment, {});
-      };
-      var B = function B() {
-        var _useUseCase42 = (0, _.useUseCase)(defaultFile, fileUseCase, {
-            onChange: onParentPathChange
-          }),
-          _useUseCase43 = (0, _slicedToArray2["default"])(_useUseCase42, 3),
-          setPath = _useUseCase43[1].setPath,
-          Provider = _useUseCase43[2];
-        var onFirstClick = function onFirstClick() {
-          setPath(PATH_1);
-          onChange = onSecondChange;
-        };
-        var onSecondClick = function onSecondClick() {
-          setPath('');
-        };
-        return (0, _jsxRuntime.jsxs)(Provider, {
-          children: [(0, _jsxRuntime.jsx)(A, {}), (0, _jsxRuntime.jsx)("button", {
-            onClick: onFirstClick,
-            children: firstButtonText
-          }), (0, _jsxRuntime.jsx)("button", {
-            onClick: onSecondClick,
-            children: secondButtonText
-          })]
-        });
-      };
-      (0, _react.render)((0, _jsxRuntime.jsx)(B, {}));
-      (0, _globals.expect)(onFirstChange).toHaveBeenCalledTimes(0);
-      _react.fireEvent.click(_react.screen.getByText(firstButtonText));
-      (0, _globals.expect)(onFirstChange).toHaveBeenCalledTimes(1);
-      (0, _globals.expect)(onFirstChange).toHaveBeenLastCalledWith(_objectSpread(_objectSpread({}, defaultFile), {}, {
-        ext: EXT_1,
-        path: PATH_1
-      }), defaultFile);
-      (0, _globals.expect)(onParentPathChange).toHaveBeenCalledTimes(1);
-      (0, _globals.expect)(onSecondChange).toHaveBeenCalledTimes(0);
-      _react.fireEvent.click(_react.screen.getByText(secondButtonText));
-      (0, _globals.expect)(onSecondChange).toHaveBeenCalledTimes(1);
-      (0, _globals.expect)(onSecondChange).toHaveBeenLastCalledWith(defaultFile, _objectSpread(_objectSpread({}, defaultFile), {}, {
-        ext: EXT_1,
-        path: PATH_1
-      }));
-      (0, _globals.expect)(onFirstChange).toHaveBeenCalledTimes(1);
-      (0, _globals.expect)(onParentPathChange).toHaveBeenCalledTimes(2);
-    });
     (0, _globals.test)('`options.onChange` event should be trigger in orders', function () {
       var changeTimes = 0;
       var updateChangeTimes = function updateChangeTimes() {
@@ -1809,8 +1113,8 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
       var onChangeB = _globals.jest.fn(updateChangeTimes);
       var onChangeC = _globals.jest.fn(updateChangeTimes);
       var buttonText = 'my button';
-      var A = function A(_ref8) {
-        var children = _ref8.children;
+      var A = function A(_ref7) {
+        var children = _ref7.children;
         (0, _.useUseCase)(fileUseCase, {
           onChange: onChangeA
         });
@@ -1825,12 +1129,12 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
         return (0, _jsxRuntime.jsx)(_react2.Fragment, {});
       };
       var C = function C() {
-        var _useUseCase44 = (0, _.useUseCase)(defaultFile, fileUseCase, {
+        var _useUseCase38 = (0, _.useUseCase)(defaultFile, fileUseCase, {
             onChange: onChangeC
           }),
-          _useUseCase45 = (0, _slicedToArray2["default"])(_useUseCase44, 3),
-          setPath = _useUseCase45[1].setPath,
-          Provider = _useUseCase45[2];
+          _useUseCase39 = (0, _slicedToArray2["default"])(_useUseCase38, 3),
+          setPath = _useUseCase39[1].setPath,
+          Provider = _useUseCase39[2];
         var onFirstClick = function onFirstClick() {
           setPath(PATH_1);
         };
@@ -1850,41 +1154,103 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
       (0, _globals.expect)(onChangeB).toHaveReturnedWith(1);
       (0, _globals.expect)(onChangeC).toHaveReturnedWith(3);
     });
+    _globals.test.each([_UseCaseModes.UseCaseModes.Normal, _UseCaseModes.UseCaseModes.Stateless])('[mode=%s]: `options.onChange` should always trigger the latest one in child components', function (mode) {
+      var onFirstChange = _globals.jest.fn();
+      var onSecondChange = _globals.jest.fn();
+      var onChange = onFirstChange;
+      var firstButtonText = 'first button';
+      var secondButtonText = 'second button';
+      var A = function A() {
+        var _useUseCase40 = (0, _.useUseCase)(fileUseCase, {
+            onChange: onChange
+          }),
+          _useUseCase41 = (0, _slicedToArray2["default"])(_useUseCase40, 2),
+          setPath = _useUseCase41[1].setPath;
+        var onFirstClick = function onFirstClick() {
+          setPath(PATH_1);
+          onChange = onSecondChange;
+        };
+        var onSecondClick = function onSecondClick() {
+          setPath('');
+        };
+        return (0, _jsxRuntime.jsxs)(_react2.Fragment, {
+          children: [(0, _jsxRuntime.jsx)("button", {
+            onClick: onFirstClick,
+            children: firstButtonText
+          }), (0, _jsxRuntime.jsx)("button", {
+            onClick: onSecondClick,
+            children: secondButtonText
+          })]
+        });
+      };
+      var B = function B() {
+        var _useState7 = (0, _react2.useState)(defaultFile),
+          _useState8 = (0, _slicedToArray2["default"])(_useState7, 2),
+          file = _useState8[0],
+          setFile = _useState8[1];
+        var _useUseCase42 = (0, _.useUseCase)(file, fileUseCase, mode, {
+            onChange: function onChange(newFile) {
+              if ((mode & _UseCaseModes.UseCaseModes.Stateless) !== _UseCaseModes.UseCaseModes.Stateless) {
+                return;
+              }
+              // `stateless` 不会保存状态，所以需要手动保存
+              setFile(newFile);
+            }
+          }),
+          _useUseCase43 = (0, _slicedToArray2["default"])(_useUseCase42, 3),
+          Provider = _useUseCase43[2];
+        return (0, _jsxRuntime.jsx)(Provider, {
+          children: (0, _jsxRuntime.jsx)(A, {})
+        });
+      };
+      (0, _react.render)((0, _jsxRuntime.jsx)(B, {}));
+      (0, _globals.expect)(onFirstChange).toHaveBeenCalledTimes(0);
+      _react.fireEvent.click(_react.screen.getByText(firstButtonText));
+      (0, _globals.expect)(onFirstChange).toHaveBeenCalledTimes(1);
+      (0, _globals.expect)(onSecondChange).toHaveBeenCalledTimes(0);
+      _react.fireEvent.click(_react.screen.getByText(secondButtonText));
+      (0, _globals.expect)(onFirstChange).toHaveBeenCalledTimes(1);
+      (0, _globals.expect)(onSecondChange).toHaveBeenCalledTimes(1);
+      (0, _globals.expect)(onSecondChange).toHaveBeenLastCalledWith(defaultFile, _objectSpread(_objectSpread({}, defaultFile), {}, {
+        ext: EXT_1,
+        path: PATH_1
+      }));
+    });
   });
   (0, _globals.describe)('`useUseCase` should work the same as `useReducers`', function () {
     (0, _globals.test)('`entity` should equal `defaultFile`', function () {
-      var _renderHook26 = (0, _react.renderHook)(function () {
+      var _renderHook22 = (0, _react.renderHook)(function () {
           return (0, _.useUseCase)(mathUseCase);
         }),
-        result = _renderHook26.result;
+        result = _renderHook22.result;
       var reducers = result.current;
       (0, _globals.expect)(Array.isArray(reducers)).toBe(false);
     });
     (0, _globals.test)('returned reducer should work', function () {
-      var _renderHook27 = (0, _react.renderHook)(function () {
+      var _renderHook23 = (0, _react.renderHook)(function () {
           return (0, _.useUseCase)(mathUseCase);
         }),
-        result = _renderHook27.result;
+        result = _renderHook23.result;
       var reducers = result.current;
       var add = reducers.add;
       (0, _globals.expect)(add(1, 2)).toBe(3);
     });
     (0, _globals.test)('`usecase` should be called only once if deps has not provided', function () {
       var mockUseCase = _globals.jest.fn(mathUseCase);
-      var _renderHook28 = (0, _react.renderHook)(function () {
+      var _renderHook24 = (0, _react.renderHook)(function () {
           return (0, _.useUseCase)(mockUseCase);
         }),
-        rerender = _renderHook28.rerender;
+        rerender = _renderHook24.rerender;
       (0, _globals.expect)(mockUseCase).toHaveBeenCalledTimes(1);
       rerender();
       (0, _globals.expect)(mockUseCase).toHaveBeenCalledTimes(1);
     });
     (0, _globals.test)('`usecase` should be called only once if deps has not changed', function () {
       var mockUseCase = _globals.jest.fn(mathUseCase);
-      var _renderHook29 = (0, _react.renderHook)(function () {
+      var _renderHook25 = (0, _react.renderHook)(function () {
           return (0, _.useUseCase)(mockUseCase, {}, [1, 'x']);
         }),
-        rerender = _renderHook29.rerender;
+        rerender = _renderHook25.rerender;
       (0, _globals.expect)(mockUseCase).toHaveBeenCalledTimes(1);
       rerender();
       (0, _globals.expect)(mockUseCase).toHaveBeenCalledTimes(1);
@@ -1892,10 +1258,10 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
     (0, _globals.test)('`usecase` should be called if deps has changed', function () {
       var i = 0;
       var mockUseCase = _globals.jest.fn(mathUseCase);
-      var _renderHook30 = (0, _react.renderHook)(function () {
+      var _renderHook26 = (0, _react.renderHook)(function () {
           return (0, _.useUseCase)(mockUseCase, {}, [i++, 'x']);
         }),
-        rerender = _renderHook30.rerender;
+        rerender = _renderHook26.rerender;
       (0, _globals.expect)(mockUseCase).toHaveBeenCalledTimes(1);
       rerender();
       (0, _globals.expect)(mockUseCase).toHaveBeenCalledTimes(2);
@@ -1903,8 +1269,8 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
     (0, _globals.test)('reducer call should not be cached if component is at rendering phase', function () {
       var buttonText = 'button';
       var CacheTestComponent = function CacheTestComponent() {
-        var _useUseCase46 = (0, _.useUseCase)(mathUseCase),
-          subtraction = _useUseCase46.subtraction;
+        var _useUseCase44 = (0, _.useUseCase)(mathUseCase),
+          subtraction = _useUseCase44.subtraction;
         var update = (0, _ahooks.useUpdate)();
         var onClick = function onClick() {
           update();
@@ -1927,8 +1293,8 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
     (0, _globals.test)('reducer call should not be cached if component is not at rendering phase', function () {
       var buttonText = 'button';
       var CacheTestComponent = function CacheTestComponent() {
-        var _useUseCase47 = (0, _.useUseCase)(mathUseCase),
-          subtraction = _useUseCase47.subtraction;
+        var _useUseCase45 = (0, _.useUseCase)(mathUseCase),
+          subtraction = _useUseCase45.subtraction;
         var onClick = function onClick() {
           subtraction(5, 3);
         };
@@ -1956,8 +1322,8 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
       var count = 0;
       var buttonText = 'button';
       var StringUseCaseTestComponent = function StringUseCaseTestComponent() {
-        var _useUseCase48 = (0, _.useUseCase)(mathUseCase),
-          subtraction = _useUseCase48.subtraction;
+        var _useUseCase46 = (0, _.useUseCase)(mathUseCase),
+          subtraction = _useUseCase46.subtraction;
         var update = (0, _ahooks.useUpdate)();
         subtraction(5, count++);
         var onUpdate = function onUpdate() {
@@ -1979,12 +1345,12 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
       (0, _globals.expect)(subtractionReducer).toHaveReturnedWith(4);
     });
     (0, _globals.test)('`options.extraValue` should be added after call `add` method', function () {
-      var _renderHook31 = (0, _react.renderHook)(function () {
+      var _renderHook27 = (0, _react.renderHook)(function () {
           return (0, _.useUseCase)(mathUseCase, {
             extraValue: 5
           });
         }),
-        result = _renderHook31.result;
+        result = _renderHook27.result;
       var reducers = result.current;
       var add = reducers.add;
       (0, _globals.expect)(add(1, 2)).toBe(8);
@@ -1992,11 +1358,11 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
     (0, _globals.test)('when `options` has changed, it should not trigger update', function () {
       var onUpdate = _globals.jest.fn();
       var onDeepUpdate = _globals.jest.fn();
-      var _renderHook32 = (0, _react.renderHook)(function () {
-          var _useState7 = (0, _react2.useState)(0),
-            _useState8 = (0, _slicedToArray2["default"])(_useState7, 2),
-            extraValue = _useState8[0],
-            setExtraValue = _useState8[1];
+      var _renderHook28 = (0, _react.renderHook)(function () {
+          var _useState9 = (0, _react2.useState)(0),
+            _useState10 = (0, _slicedToArray2["default"])(_useState9, 2),
+            extraValue = _useState10[0],
+            setExtraValue = _useState10[1];
           var reducers = (0, _.useUseCase)(mathUseCase, {
             extraValue: extraValue
           });
@@ -2008,7 +1374,7 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
           }, [reducers]);
           return setExtraValue;
         }),
-        result = _renderHook32.result;
+        result = _renderHook28.result;
       (0, _globals.expect)(onUpdate).toHaveBeenCalledTimes(0);
       (0, _globals.expect)(onDeepUpdate).toHaveBeenCalledTimes(0);
       (0, _react.act)(function () {
@@ -2020,11 +1386,11 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
     (0, _globals.test)('when `deps` change, it should update reducers', function () {
       var onUpdate = _globals.jest.fn();
       var onDeepUpdate = _globals.jest.fn();
-      var _renderHook33 = (0, _react.renderHook)(function () {
-          var _useState9 = (0, _react2.useState)(0),
-            _useState10 = (0, _slicedToArray2["default"])(_useState9, 2),
-            extraValue = _useState10[0],
-            setExtraValue = _useState10[1];
+      var _renderHook29 = (0, _react.renderHook)(function () {
+          var _useState11 = (0, _react2.useState)(0),
+            _useState12 = (0, _slicedToArray2["default"])(_useState11, 2),
+            extraValue = _useState12[0],
+            setExtraValue = _useState12[1];
           var reducers = (0, _.useUseCase)(mathUseCase, {
             extraValue: extraValue
           }, [extraValue]);
@@ -2036,7 +1402,7 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
           }, [reducers]);
           return setExtraValue;
         }),
-        result = _renderHook33.result;
+        result = _renderHook29.result;
       (0, _globals.expect)(onUpdate).toHaveBeenCalledTimes(0);
       (0, _globals.expect)(onDeepUpdate).toHaveBeenCalledTimes(0);
       (0, _react.act)(function () {
@@ -2048,11 +1414,11 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
     (0, _globals.test)('empty `deps` should not update reducers', function () {
       var onUpdate = _globals.jest.fn();
       var onDeepUpdate = _globals.jest.fn();
-      var _renderHook34 = (0, _react.renderHook)(function () {
-          var _useState11 = (0, _react2.useState)(0),
-            _useState12 = (0, _slicedToArray2["default"])(_useState11, 2),
-            extraValue = _useState12[0],
-            setExtraValue = _useState12[1];
+      var _renderHook30 = (0, _react.renderHook)(function () {
+          var _useState13 = (0, _react2.useState)(0),
+            _useState14 = (0, _slicedToArray2["default"])(_useState13, 2),
+            extraValue = _useState14[0],
+            setExtraValue = _useState14[1];
           var reducers = (0, _.useUseCase)(mathUseCase, {
             extraValue: extraValue
           }, []);
@@ -2064,7 +1430,7 @@ var useDeepCompareUpdate = function useDeepCompareUpdate(callback, deps) {
           }, [reducers]);
           return setExtraValue;
         }),
-        result = _renderHook34.result;
+        result = _renderHook30.result;
       (0, _globals.expect)(onUpdate).toHaveBeenCalledTimes(0);
       (0, _globals.expect)(onDeepUpdate).toHaveBeenCalledTimes(0);
       (0, _react.act)(function () {