Grid.setDetailsVisibleOnClick() effect gets reverted after the page is reloaded with PreserveOnRefresh

[mvysny]

Description of the bug

I'm calling grid.setDetailsVisibleOnClick(false); to prevent details being shown on row click. Then the Grid is detached and reattached, but suddenly it now reveals details on click.

Expected behavior

The details should not be shown.

Minimal reproducible example

@Route("")
@PreserveOnRefresh
public class MainView extends VerticalLayout {

    public MainView() {
        final Grid<String> grid = new Grid<String>();
        grid.setSelectionMode(Grid.SelectionMode.MULTI);
        grid.setItemDetailsRenderer(new ComponentRenderer<Component, String>(it -> new Span("Details: " + it)));
        grid.addColumn(it -> it);
        grid.setDetailsVisibleOnClick(false);
        grid.setItems("1", "2", "3");
        add(grid);
    }
}

Paste this into skeleton-starter-flow and run the app. The details are not revealed on click. Now reload the page via F5 - the details are now revealed on click.

Versions

• Vaadin / Flow version: 14.8.10
• Java version: 11
• OS version: Ubuntu 22.04
• Browser version (if applicable): Firefox 101
• Application Server (if applicable): Tomcat
• IDE (if applicable):

[mvysny]

Also reproducible on Vaadin 14.8.13.

Workaround:

        final Grid<String> grid = new Grid<String>() {
            @Override
            protected void onAttach(AttachEvent attachEvent) {
                super.onAttach(attachEvent);
                getElement().callJsFunction("$connector.setDetailsVisibleOnClick",
                        isDetailsVisibleOnClick());
            }
        };