Skip to content

Firefox does not retain browser's scroll position when switching tab in TabSheet #12551

@mikke-alekstra

Description

@mikke-alekstra

Hello!

There seems to be a problem with Firefox retaining browser's scroll position when switching tab in TabSheet component.

Vaadin Framework version 8.16.1 (the problem was originally found with 8.14.3)
Debian 10 (buster) Linux: latest versions of Firefox (and Chromium)
Windows 10: latest versions of Firefox (and Chrome)

In my test I had a VerticalLayout where I first had 25 filler (Label) rows to get a vertical scroll bar to appear in browser and then a TabSheet containing two tabs with 10 tab (Label) rows in each of them.

Test steps:

  1. Scroll to bottom of page to see the TabSheet
  2. Click tab 2 to switch tab

Expected behavior (Chrome and Chromium): scroll position is retained, full tab 2 content is visible
Actual behavior (Firefox): scroll position is not retained. Scroll bar jumps upwards and only first line of tab 2 content is seen.

Please see below the simple test code the case can be re-produced with.

    @Override
    protected void init(VaadinRequest vaadinRequest) {
        
        VerticalLayout layout = new VerticalLayout();
        
        for (int i = 1; i <= 25; i ++) {
            layout.addComponent(new Label("filler row " + i));
        }
        
        TabSheet tabSheet = new TabSheet();
        
        for (int i = 1; i <= 2; i ++) {
        
            VerticalLayout tabLayout = new VerticalLayout();
            
            for (int j = 1; j <= 10; j ++) {
                tabLayout.addComponent(new Label("tab row " + j));
            }
            
            tabSheet.addTab(tabLayout, "tab " + i);
            
        }
        
        layout.addComponent(tabSheet);
        
        setContent(layout);
        
    }

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions