Cytoscape expand collapse plugin is not collapsing nodes

Question

I am using cytoscape-expand-collapse with react code as below

useEffect(() => {

    const expandCollapseApi = cy.expandCollapse({
        layoutBy: getLayoutConfiguration({
          name: CytoscapeLayout.DAGRE,
          spacing,
        }),
        fit: true,
        animate: false,
        undoable: false,
        zIndex: 1,
      });
}, [cyRef]);

The problem is that when i click the collapse icon the children inside compound node are still visible and icon is changed to expand icon. When i try to expand the compound node, it stays collapsed. Do i need to add any stylesheets to collapse nodes? PS: I am using 'cytoscape-node-html-label' to render the nodes.

Please help me out here

From the above code, when the compound node is collapsed the children should be hidden.