caplin / FlexLayout

Docking Layout Manager for React
MIT License
919 stars 173 forks source link

Incorrect Timing of Visibility Event in `Node._setVisible` Method #442

Open NickNaumenko opened 4 months ago

NickNaumenko commented 4 months ago

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

  1. Create a layout with tabs using the flexlayout-react library.
  2. Subscribe to the model changes using onModelChange prop.
  3. 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.

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

_setVisible(visible: boolean) {
    if (visible !== this._visible) {
        this._visible = visible; // Update the _visible property first
        this._fireEvent("visibility", { visible }); // Then fire the event
    }
}

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"