vaadin / vaadin/framework

Component in grid header is not displayed correctly

Open
#12,622 5 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
Java
Stars
1.8k
Forks
717
Avg merge
2d 6h
Merged PRs (30d)
3

Description

Vaadin Framework version - 8.24.0
Google Chrome Version 125.0.6422.77 (Official Build) (64-bit)
Windows 11 Enterprise Version 23H2

Component in grid header is not displayed correctly if you set it from background thread.
image

To reproduce bug you should change header from background thread:

    protected void init(VaadinRequest vaadinRequest) {
        grid.getDefaultHeaderRow().getCell(columnId)
                .setComponent(new HorizontalLayout(new Label("Status")));
        
        CompletableFuture.supplyAsync(() -> {
                    try {
                        Thread.sleep(2000);
                    } catch (InterruptedException ignored) {}
                    return "";
                })
                .whenComplete((s, thr) -> {
                    UI ui = getUI();
                    ui.access(() -> {
                        grid.getDefaultHeaderRow().getCell(columnId)
                                .setComponent(createLayoutForStatusColumnInHeader());
                        ui.push();
                    });
                });
    }
                
    private HorizontalLayout createLayoutForStatusColumnInHeader() {
        Button button = new Button();
        button.addStyleNames(
                ValoTheme.BUTTON_SMALL,
                ValoTheme.BUTTON_ICON_ONLY,
                ValoTheme.BUTTON_BORDERLESS
        );
        button.setIcon(VaadinIcons.REFRESH);
        button.addClickListener(clickEvent -> Notification.show("refresh!"));

        HorizontalLayout horizontalLayout = new HorizontalLayout();
        Label label = new Label("Status");
        horizontalLayout.addComponentsAndExpand(label);
        horizontalLayout.setComponentAlignment(label, Alignment.MIDDLE_CENTER);
        horizontalLayout.addComponent(button);
        horizontalLayout.setComponentAlignment(button, Alignment.MIDDLE_CENTER);
        return horizontalLayout;
    }

Push mode is @Push(value = PushMode.MANUAL, transport = Transport.LONG_POLLING)

Also you can find full code in repo-vaadin8-component-in-grid-header-bug.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the supplied repo-vaadin8-component-in-grid-bug reproducer and the UI.access callback that replaces the Grid header component. Trace the Grid header update path for background-thread changes under manual long-polling push. Done means the replacement header renders correctly and remains interactive after the asynchronous update.

Written by the indexing model from the issue text.

Assessment

Tech stack
java
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
38/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.