diff --git a/web/src/js/__tests__/components/Modal/OptionSpec.tsx b/web/src/js/__tests__/components/Modal/OptionSpec.tsx index 47540f73d..5c74048bb 100644 --- a/web/src/js/__tests__/components/Modal/OptionSpec.tsx +++ b/web/src/js/__tests__/components/Modal/OptionSpec.tsx @@ -97,6 +97,6 @@ describe("StringOption Component", () => { it("should handle onChange", () => { let mockEvent = { target: { value: "a\nb\nc\n" } }; tree.props.onChange(mockEvent); - expect(onChangeFn).toBeCalledWith(["a", "b", "c", ""]); + expect(onChangeFn).toBeCalledWith(["a", "b", "c"]); }); }); diff --git a/web/src/js/components/Modal/Option.jsx b/web/src/js/components/Modal/Option.jsx index 7ea333139..f6841aeb0 100644 --- a/web/src/js/components/Modal/Option.jsx +++ b/web/src/js/components/Modal/Option.jsx @@ -99,11 +99,26 @@ StringSequenceOption.propTypes = { function StringSequenceOption({ value, onChange, ...props }) { const height = Math.max(value.length, 1); + + const [textAreaValue, setTextAreaValue] = React.useState(value.join("\n")); + + const handleChange = (e) => { + const newValue = e.target.value; + setTextAreaValue(newValue); //save in the state the current input value + onChange( + //we send to the backend only the strings that are not empty + newValue + .split("\n") + .map((line) => line.trim()) + .filter((line) => line !== "") + ); + }; + return (