Skip to content

[AnalyticalTable]: Strange behavior of onChange callback of TextArea within an AnalyticalTable cell #7542

Closed
@ThiagoSzz

Description

@ThiagoSzz

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:

  1. Open Chrome DevTools and go to the Console tab
  2. Click on the TextArea of the first row (notice a "Click detected inside [1] TextArea within AnalyticalTable" message on the console)
  3. Enter some text
  4. Click once on the TextArea of the second row (notice no "Click detected inside [2] TextArea within AnalyticalTable" message)
  5. 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:

  1. Click on the first TextArea (notice a "Click detected inside first TextArea outside of the AnalyticalTable" message on the console)
  2. Enter some text
  3. 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.

Metadata

Metadata

Assignees

No one assigned

    Type

    Projects

    Status

    🆕 New

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions

      pFad - Phonifier reborn

      Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

      Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


      Alternative Proxies:

      Alternative Proxy

      pFad Proxy

      pFad v3 Proxy

      pFad v4 Proxy