Skip to content

Wrong tab position on scroll #488

Open
@waynewee

Description

@waynewee

Describe the bug

If the window has a positive scrollY value, re-rendering Tabs (e.g. by clicking to set active tab) causes the FlexLayout Tab element to be wrongly positioned.

Your Example Website or App

No response

Steps to Reproduce the Bug or Issue

  1. Create a FlexLayout with at least two TabSets, each containing at least one Tab
  2. Scroll the window
  3. Click on the Tab which is not active
  4. All Tabs (class="flexLayout__tab") will be repositioned upwards, blocking the tabSet bar and out of the main component
  5. The further the scroll, the higher the reposition

Expected behavior

As a user, I expect the Tabs not to be repositioned out of the parent component.

Operating System

Windows

Browser Type?

Edge

Browser Version

134.0.3124.93

Screenshots or Videos

Can't upload due to company policy.

Additional context

Likely issue is here

The new top property is recalculated based on the y properties of flexlayout__layout and flexlayout__tab but not sure why this is needed since flexlayout__tab is positioned relative to flexlayout_layout

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions