[60638] Opening a work package (full view) on mobile auto-scrolls to the tab row when not desired

[bsatarnejad]

Ticket

https://community.openproject.org/wp/60638

What are you trying to accomplish?

Avoid scrolling to the tabs in small screen devices.

Screenshots

Before:

Screen.Recording.2025-02-13.at.16.54.53.mov

After:

Screen.Recording.2025-02-13.at.16.53.30.mov

What approach did you choose and why?

If there is a fragment identifier in the url(id for comment or an activity for example), page will scroll to the identifier, otherwise there won't be a scroll.

Merge checklist

• Added/updated tests
• Added/updated documentation in Lookbook (patterns, previews, etc)
• Tested major browsers (Chrome, Firefox, Edge, ...)

[HDinger]

I don't know whether the assumption that we only want to scroll when there is a hash in the URL is really true. It feels dangerous to me.. Why didn't you simply remove the autofocus from the label?

[HDinger]

I did not test this, but this whole block could probably be changed to focusable?.focus({ preventScroll: !!window.location.hash });

[HDinger]

That comment is really not helpful. It is pretty self-explaining, that it should prevent scrolling when there is no hash in the URL, the actual question is why?

[bsatarnejad]

I don't know whether the assumption that we only want to scroll when there is a hash in the URL is really true. It feels dangerous to me.. Why didn't you simply remove the autofocus from the label?

I don't know whether the assumption that we only want to scroll when there is a hash in the URL is really true. It feels dangerous to me.. Why didn't you simply remove the autofocus from the label?

If we remove autofocus, there will be some issues for a comment, it won't scroll to the comment set in the URL, for example this test will fail:
./spec/features/activities/work_package/activities_spec.rb:951 # Work package activity auto scrolling scrolls to comment specified in the URL when sorting set to asc when on mobile screen size scrolls to the comment specified in the URL

[HDinger]

I don't know whether the assumption that we only want to scroll when there is a hash in the URL is really true. It feels dangerous to me.. Why didn't you simply remove the autofocus from the label?

I don't know whether the assumption that we only want to scroll when there is a hash in the URL is really true. It feels dangerous to me.. Why didn't you simply remove the autofocus from the label?

If we remove autofocus, there will be some issues for a comment, it won't scroll to the comment set in the URL, for example this test will fail: ./spec/features/activities/work_package/activities_spec.rb:951 # Work package activity auto scrolling scrolls to comment specified in the URL when sorting set to asc when on mobile screen size scrolls to the comment specified in the URL

Well, this is coincidence.. The fact, that the users is scrolled to the tabs, triggers the turbo frame of the activity panel to be loaded, and thus the page can be scrolled (a second time) to the actual comment. If we move the hidden label to the top of the page, this will also break. So basically, there is an inderdependency between things that are totally unrelated.
That is why, I still think that we should not change the default focus behavior without double checking that this is really what we want. In my opinion, the activity panel should be responsible for scrolling itslef into view if there is a hash on the URL.