Merge branch 'develop' into gmarabout/improve_dispatcher_shutdown

Avaiga · Feb 13, 2024 · ee5487d · ee5487d
2 parents a3217b6 + e77e892
commit ee5487d
Show file tree

Hide file tree

Showing 15 changed files with 1,214 additions and 904 deletions.
diff --git a/frontend/taipy-gui/package-lock.json b/frontend/taipy-gui/package-lock.json
diff --git a/frontend/taipy-gui/package.json b/frontend/taipy-gui/package.json
@@ -88,8 +88,8 @@
     "@types/react-window-infinite-loader": "^1.0.5",
     "@types/sprintf-js": "^1.1.2",
     "@types/uuid": "^9.0.0",
-    "@typescript-eslint/eslint-plugin": "^6.7.0",
-    "@typescript-eslint/parser": "^6.7.0",
+    "@typescript-eslint/eslint-plugin": "^7.0.1",
+    "@typescript-eslint/parser": "^7.0.1",
     "add-asset-html-webpack-plugin": "^6.0.0",
     "autoprefixer": "^10.4.0",
     "copy-webpack-plugin": "^12.0.1",

diff --git a/frontend/taipy-gui/src/components/Taipy/Input.spec.tsx b/frontend/taipy-gui/src/components/Taipy/Input.spec.tsx
@@ -90,6 +90,25 @@ describe("Input Component", () => {
             type: "SEND_ACTION_ACTION",
         });
     });
+    it("dispatch a well formed update message with change_delay=-1", async () => {
+        const dispatch = jest.fn();
+        const state: TaipyState = INITIAL_STATE;
+        const { getByDisplayValue } = render(
+            <TaipyContext.Provider value={{ state, dispatch }}>
+                <Input value="Val" type="text" updateVarName="varname" changeDelay={-1} />
+            </TaipyContext.Provider>
+        );
+        const elt = getByDisplayValue("Val");
+        await userEvent.click(elt);
+        await userEvent.keyboard("data{Enter}");
+        await waitFor(() => expect(dispatch).toHaveBeenCalled());
+        expect(dispatch).toHaveBeenLastCalledWith({
+            name: "varname",
+            payload: { value: "Valdata" },
+            propagate: true,
+            type: "SEND_UPDATE_ACTION",
+        });
+    });
     it("dispatch a no action message on unsupported key", async () => {
         const dispatch = jest.fn();
         const state: TaipyState = INITIAL_STATE;

diff --git a/frontend/taipy-gui/src/components/Taipy/Input.tsx b/frontend/taipy-gui/src/components/Taipy/Input.tsx
@@ -48,10 +48,10 @@ const Input = (props: TaipyInputProps) => {
     const [value, setValue] = useState(defaultValue);
     const dispatch = useDispatch();
     const delayCall = useRef(-1);
-    const [actionKeys] = useState(() => (onAction ? getActionKeys(props.actionKeys) : []));
+    const [actionKeys] = useState(() => getActionKeys(props.actionKeys));
     const module = useModule();
 
-    const changeDelay = typeof props.changeDelay === "number" && props.changeDelay >= 0 ? props.changeDelay : 300;
+    const changeDelay = typeof props.changeDelay === "number" ? (props.changeDelay >= 0 ? props.changeDelay : -1) : 300;
     const className = useClassNames(props.libClassName, props.dynamicClassName, props.className);
     const active = useDynamicProperty(props.active, props.defaultActive, true);
     const hover = useDynamicProperty(props.hoverText, props.defaultHoverText, undefined);
@@ -60,31 +60,35 @@ const Input = (props: TaipyInputProps) => {
         (e: React.ChangeEvent<HTMLInputElement>) => {
             const val = e.target.value;
             setValue(val);
-            if (changeDelay) {
+            if (changeDelay === 0) {
+                dispatch(createSendUpdateAction(updateVarName, val, module, onChange, propagate));
+                return;
+            }
+            if (changeDelay > 0) {
                 if (delayCall.current > 0) {
                     clearTimeout(delayCall.current);
                 }
                 delayCall.current = window.setTimeout(() => {
                     delayCall.current = -1;
                     dispatch(createSendUpdateAction(updateVarName, val, module, onChange, propagate));
                 }, changeDelay);
-            } else {
-                dispatch(createSendUpdateAction(updateVarName, val, module, onChange, propagate));
             }
         },
         [updateVarName, dispatch, propagate, onChange, changeDelay, module]
     );
 
     const handleAction = useCallback(
         (evt: KeyboardEvent<HTMLDivElement>) => {
-            if (onAction && !evt.shiftKey && !evt.ctrlKey && !evt.altKey && actionKeys.includes(evt.key)) {
+            if (!evt.shiftKey && !evt.ctrlKey && !evt.altKey && actionKeys.includes(evt.key)) {
                 const val = evt.currentTarget.querySelector("input")?.value;
-                if (changeDelay && delayCall.current > 0) {
+                if (changeDelay > 0 && delayCall.current > 0) {
                     clearTimeout(delayCall.current);
                     delayCall.current = -1;
                     dispatch(createSendUpdateAction(updateVarName, val, module, onChange, propagate));
+                } else if (changeDelay === -1) {
+                    dispatch(createSendUpdateAction(updateVarName, val, module, onChange, propagate));
                 }
-                dispatch(createSendActionNameAction(id, module, onAction, evt.key, updateVarName, val));
+                onAction && dispatch(createSendActionNameAction(id, module, onAction, evt.key, updateVarName, val));
                 evt.preventDefault();
             }
         },
@@ -109,7 +113,7 @@ const Input = (props: TaipyInputProps) => {
                 label={props.label}
                 onChange={handleInput}
                 disabled={!active}
-                onKeyDown={onAction ? handleAction : undefined}
+                onKeyDown={handleAction}
                 multiline={multiline}
                 minRows={linesShown}
             />