Skip to content

<Tab> moves selected indicator from inside <button> to outside when hydrating #881

Description

@bchu1

Describe the bug
On the initial SSR render, the blue underline indicator is inside the button element of the tab. After hydration, the element is placed after all the tab <button>s. The causes the position to move.

To Reproduce
Steps to reproduce the behavior:

  1. Go to https://cryoetdataportal.czscience.com/browse-data/datasets (Remix)
  2. Notice the flicker of the selection indicator.
  3. This is also reproducible in Next.js

Expected behavior
No flicker

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

Labels

BugSomething isn't workingEngP0

Type

No type

Projects

No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions