WRR-6050: Fixed `IconItem` to restart marquee after done editing in `Scroller` with `editable` prop

MikyungKim commented 1 month ago

Checklist

[x] I have read and understand the contribution guide
[x] A CHANGELOG entry is included
[ ] At least one test case is included for this feature or bug fix
[x] Documentation was added or is not needed
[ ] This is an API breaking change

Issue Resolved / Feature Added

When there is long label inside IconItem in editable Scroller, after done editing the marquee stops and it will never start again.

Resolution

When completing edit, the DOM changes its order and it makes the marquee stops. I guess it's from engine but unfortunately, I coundn't find the specific logic or part. As far as I investigate, JS code has nothing to do with stopping maruee. To resolve this issue, I chose to let Marquee to invalidate its metrics to restart safely with invalidateProps of MarqueeDecorator. I've added order as invalidateProps and pass it to Marquee through IconItem in JSX so that let Marquee know when the editing is done. For the case where the editing ended without DOM change, I changed Spotlight.focus call added from https://github.com/enactjs/sandstone/pull/1550/files#diff-22d263c3907b8e109699fc727d876991ef576e0c70458dd2e6d59e014f7e426cR573-R574 conditionally to prevent stopping marquee.

Additional Considerations

Currently there is no sample to test the problem. So you should change qa-sampler/IconItem.js to have label based on the change I made.

Links

WRR-6050

Comments

Enact-DCO-1.0-Signed-off-by: Mikyung Kim (mikyung27.kim@lge.com)

codecov[bot] commented 1 month ago

Codecov Report

All modified and coverable lines are covered by tests :white_check_mark:

Project coverage is 80.79%. Comparing base (a4d543d) to head (a9d8c23). Report is 1 commits behind head on develop.

Additional details and impacted files

```diff @@ Coverage Diff @@ ## develop #1727 +/- ## =========================================== - Coverage 81.55% 80.79% -0.76% =========================================== Files 148 148 Lines 6673 6677 +4 Branches 1985 1985 =========================================== - Hits 5442 5395 -47 - Misses 938 973 +35 - Partials 293 309 +16 ```

:umbrella: View full report in Codecov by Sentry.
:loudspeaker: Have feedback on the report? Share it here.

MikyungKim commented 1 month ago

We will revisit the dropped coverage issue later.

seunghoh commented 1 month ago

Due to removing Spotlight.focus, the other issue occurred when I tried to reproduce WRQ-8363 issue. When editing complete by downkey while the pointer hovers on the next item, the long text disappear. The removed 2 lines are necessary for this scenario. :(

enactjs / sandstone