Description
Describe the bug
Hello, colleagues,
In my application, I'm creating a new component that uses the AnalyticalTable for rendering TextAreas within its cells and I've been experiencing some issues when trying to keep track of the content entered in the TextArea with the onChange callback.
When I enter text in the TextArea of the first row of the table and try to click on another TextArea to enter text, I'm not able to do this without having to click twice on the other TextArea.
My guess is this is happening because the onChange callback needs some way to indentify when the change event is finished and it seems to be tied to the way the AnalyticalTable handles events of child elements, because this doesn't happen when I try to move between TextAreas outside of AnalyticalTable cells.
Isolated Example
https://stackblitz.com/edit/vitejs-vite-28yufmq5?file=src%2FApp.tsx
Reproduction steps
On the Stackblitz project, follow these steps to reproduce the issue:
- Open Chrome DevTools and go to the Console tab
- Click on the TextArea of the first row (notice a "Click detected inside [1] TextArea within AnalyticalTable" message on the console)
- Enter some text
- Click once on the TextArea of the second row (notice no "Click detected inside [2] TextArea within AnalyticalTable" message)
- Click again on the TextArea of the second row (now the "Click detected inside [2] TextArea within AnalyticalTable" message appears and the focus is moved to the TextArea)
You can also see that this doesn't happen with the TextAreas outside of the AnalyticalTable:
- Click on the first TextArea (notice a "Click detected inside first TextArea outside of the AnalyticalTable" message on the console)
- Enter some text
- Click on the second TextArea (notice a "Click detected inside second TextArea outside of the AnalyticalTable" message and the focus is on the TextArea)
Expected Behaviour
When I edit the contents of the TextArea of a cell and move to the TextArea of another cell, the onChange event should be considered as "finished" without having to click twice on the TextArea of the other cell.
Screenshots or Videos
No response
UI5 Web Components for React Version
1.28.1+
UI5 Web Components Version
1.24.0+
Browser
Chrome
Operating System
MacOS
Additional Context
No response
Relevant log output
Organization
No response
Declaration
- I’m not disclosing any internal or sensitive information.