TreeTable: Initial empty table doesnt render nodes on AJAX update when root changes

Describe the defect If a TreeTable is initially empty, and at least one column has the filterBy attribute, an ajax update which populates the TreeTable data will show the columns but not the data.

Please note the sample code is taken from the Mirage theme demo files with slight modifications to duplicate the issue.

Reproducer None

Environment:

• PF Version: 10.0.0
• JSF + version: Mojarra/Eclipse/2.3.14.payara-p2
• Affected browsers: ALL

To Reproduce Steps to reproduce the behavior:

1. Click the ‘Populate Tree Table’ button
2. Columns for the treetable show but no data is shown
3. Type in the filter and data starts to appear

Expected behavior TreeTable data should appear immediately after clicking on the button. If the ‘filterBy’ parameter is removed, then the data appears as expected.

Example XHTML

<h:form id="frmTest">
                          <p:commandButton value="Populate Tree Table" update="@this, @(.update-me)"
                                         actionListener="#{treeSelectionView.populateRoot3()}"
                                         process="@this"/>
                        <h1>TreeTable</h1>
                        <p:treeTable id="treeTableExample" class="update-me" value="#{treeSelectionView.root3}" var="document" selectionMode="checkbox" selection="#{treeSelectionView.selectedNodes1}">
                            <f:facet name="header">
                                File System
                            </f:facet>
                            <p:column headerText="Name" sortBy="#{document.name}"
                                       filterBy="#{document.name}" filterMatchMode="contains">
                                <h:outputText value="#{document.name}" />
                            </p:column>
                            <p:column headerText="Size">
                                <h:outputText value="#{document.size}" />
                            </p:column>
                            <p:column headerText="Type">
                                <h:outputText value="#{document.type}" />
                            </p:column>
                        </p:treeTable>

</h:form>

Example Bean

@Named(value="treeSelectionView")
@ViewScoped
public class SelectionView implements Serializable {
    
    private TreeNode root3 = new DefaultTreeNode();;
    private TreeNode selectedNode;
    private TreeNode[] selectedNodes1;
    private TreeNode[] selectedNodes2;
    
    @Inject
    private DocumentService service;
    
    @PostConstruct
    public void init() {
    }

    public TreeNode getRoot3() {
        return root3;
    }
    
    public void populateRoot3() {
        root3 = service.createCheckboxDocuments();
    }

    public TreeNode getSelectedNode() {
        return selectedNode;
    }

    public void setSelectedNode(TreeNode selectedNode) {
        this.selectedNode = selectedNode;
    }

    public TreeNode[] getSelectedNodes1() {
        return selectedNodes1;
    }

    public void setSelectedNodes1(TreeNode[] selectedNodes1) {
        this.selectedNodes1 = selectedNodes1;
    }
}

@Named(value="documentService")
@ApplicationScoped
public class DocumentService {
    
    public TreeNode createDocuments() {
        TreeNode root = new DefaultTreeNode(new Document("Files", "-", "Folder"), null);
		
		TreeNode documents = new DefaultTreeNode(new Document("Documents", "-", "Folder"), root);
		TreeNode pictures = new DefaultTreeNode(new Document("Pictures", "-", "Folder"), root);
		TreeNode movies = new DefaultTreeNode(new Document("Movies", "-", "Folder"), root);
		
		TreeNode work = new DefaultTreeNode(new Document("Work", "-", "Folder"), documents);
		TreeNode primefaces = new DefaultTreeNode(new Document("PrimeFaces", "-", "Folder"), documents);
		
		//Documents
		TreeNode expenses = new DefaultTreeNode("document", new Document("Expenses.doc", "30 KB", "Word Document"), work);
		TreeNode resume = new DefaultTreeNode("document", new Document("Resume.doc", "10 KB", "Word Document"), work);
		TreeNode refdoc = new DefaultTreeNode("document", new Document("RefDoc.pages", "40 KB", "Pages Document"), primefaces);
		
		//Pictures
		TreeNode barca = new DefaultTreeNode("picture", new Document("barcelona.jpg", "30 KB", "JPEG Image"), pictures);
		TreeNode primelogo = new DefaultTreeNode("picture", new Document("logo.jpg", "45 KB", "JPEG Image"), pictures);
		TreeNode optimus = new DefaultTreeNode("picture", new Document("optimusprime.png", "96 KB", "PNG Image"), pictures);
		
		//Movies
		TreeNode pacino = new DefaultTreeNode(new Document("Al Pacino", "-", "Folder"), movies);
		TreeNode deniro = new DefaultTreeNode(new Document("Robert De Niro", "-", "Folder"), movies);
		
		TreeNode scarface = new DefaultTreeNode("movie", new Document("Scarface", "15 GB", "Movie File"), pacino);
		TreeNode carlitosWay = new DefaultTreeNode("movie", new Document("Carlitos' Way", "24 GB", "Movie File"), pacino);
		
		TreeNode goodfellas = new DefaultTreeNode("movie", new Document("Goodfellas", "23 GB", "Movie File"), deniro);
		TreeNode untouchables = new DefaultTreeNode("movie", new Document("Untouchables", "17 GB", "Movie File"), deniro);
        
        return root;
    }
    
    public TreeNode createCheckboxDocuments() {
        TreeNode root = new CheckboxTreeNode(new Document("Files", "-", "Folder"), null);
		
		TreeNode documents = new CheckboxTreeNode(new Document("Documents", "-", "Folder"), root);
		TreeNode pictures = new CheckboxTreeNode(new Document("Pictures", "-", "Folder"), root);
		TreeNode movies = new CheckboxTreeNode(new Document("Movies", "-", "Folder"), root);
		
		TreeNode work = new CheckboxTreeNode(new Document("Work", "-", "Folder"), documents);
		TreeNode primefaces = new CheckboxTreeNode(new Document("PrimeFaces", "-", "Folder"), documents);
		
		//Documents
		TreeNode expenses = new CheckboxTreeNode("document", new Document("Expenses.doc", "30 KB", "Word Document"), work);
		TreeNode resume = new CheckboxTreeNode("document", new Document("Resume.doc", "10 KB", "Word Document"), work);
		TreeNode refdoc = new CheckboxTreeNode("document", new Document("RefDoc.pages", "40 KB", "Pages Document"), primefaces);
		
		//Pictures
		TreeNode barca = new CheckboxTreeNode("picture", new Document("barcelona.jpg", "30 KB", "JPEG Image"), pictures);
		TreeNode primelogo = new CheckboxTreeNode("picture", new Document("logo.jpg", "45 KB", "JPEG Image"), pictures);
		TreeNode optimus = new CheckboxTreeNode("picture", new Document("optimusprime.png", "96 KB", "PNG Image"), pictures);
		
		//Movies
		TreeNode pacino = new CheckboxTreeNode(new Document("Al Pacino", "-", "Folder"), movies);
		TreeNode deniro = new CheckboxTreeNode(new Document("Robert De Niro", "-", "Folder"), movies);
		
		TreeNode scarface = new CheckboxTreeNode("movie", new Document("Scarface", "15 GB", "Movie File"), pacino);
		TreeNode carlitosWay = new CheckboxTreeNode("movie", new Document("Carlitos' Way", "24 GB", "Movie File"), pacino);
		
		TreeNode goodfellas = new CheckboxTreeNode("movie", new Document("Goodfellas", "23 GB", "Movie File"), deniro);
		TreeNode untouchables = new CheckboxTreeNode("movie", new Document("Untouchables", "17 GB", "Movie File"), deniro);
        
        return root;
    }
}

[wal-jan]

Reproducer pf-7136.zip

[Dougnlizt]

The issue is when the treetable starts out as ‘empty’. After an ajax update that then has data for the treetable, the treetable is not showing the data.

The showcase does not cover this use case – it shows only the case where the treetable is pre-populated with data. In our use case, the user goes to the page and the treetable is empty until the user makes a certain selection. After doing so, the ajax update fires and I can see the treetable requesting the data, but the treetable still shows as empty in the UI. If I start typing in the filter, then the data will show.