When using the flexlayout-react library, I encountered an issue with the timing of the visibility event firing within the _setVisible method of the Node class. Currently, the visibility event is triggered before updating the _visible property, leading to inconsistencies when reacting to visibility changes.
Your Example Website or App
No response
Steps to Reproduce the Bug or Issue
Create a layout with tabs using the flexlayout-react library.
Subscribe to the model changes using onModelChange prop.
Perform an action that triggers a visibility change for the tab node.
Expected behavior
When accessing the visibility state of a node using model.getNodeById(<nodeId>).isVisible() within the Layout.onModelChange callback after applying an action, it should return the current visibility state of the node.
Actual Behavior:
However, model.getNodeById().isVisible() returns the previous visibility state instead of the current one when invoked within the Layout.onModelChange callback.
_setVisible(visible: boolean) {
if (visible !== this._visible) {
this._visible = visible; // Update the _visible property first
this._fireEvent("visibility", { visible }); // Then fire the event
}
}
Describe the bug
When using the flexlayout-react library, I encountered an issue with the timing of the visibility event firing within the
_setVisible
method of the Node class. Currently, the visibility event is triggered before updating the_visible
property, leading to inconsistencies when reacting to visibility changes.Your Example Website or App
No response
Steps to Reproduce the Bug or Issue
onModelChange
prop.Expected behavior
When accessing the visibility state of a node using
model.getNodeById(<nodeId>).isVisible()
within theLayout.onModelChange
callback after applying an action, it should return the current visibility state of the node.Actual Behavior:
However, model.getNodeById().isVisible() returns the previous visibility state instead of the current one when invoked within the Layout.onModelChange callback.
Proposed Solution:
Adjust the _setVisible method in the Node class to update the _visible property before firing the visibility event. Here's the proposed modification: https://github.com/caplin/FlexLayout/blob/88cbbf55d005a94e9fc469c5ad7fd56fc363d31b/src/model/Node.ts#L136-L141
Operating System
macOS
Browser Type?
Google Chrome
Browser Version
Version 124.0.6367.93 (Official Build) (arm64)
Additional context
Library Version: "flexlayout-react": "^0.7.15"