Full tree gets drawn after selecting a node in search mode

[JKapostins]

Description
After selecting a node while in search mode, the entire tree gets drawn.

To Reproduce
Use the following props, search for a node in the tree, and select it. Note that if you clearSearchOnChange you won't be able to see the issue.

<DropdownTreeSelect
    showPartiallySelected={true}
    keepTreeOnSearch={true}
    clearSearchOnChange={false}
    data={this.props.treeData}
/>

Expected behavior
The demo behaves as expected, the tree structure does not change when nodes are selected.

Screenshots

Environment

• Browser Chrome Version 69.0.3497.100 (Official Build) (64-bit) and Microsoft Edge 42.17134.1.0
• OS: Windows 10 x64
• react-dropdown-tree-select@1.13.0

[mrchief]

@JKapostins That dropdown looks pretty cool!

Thanks for reporting this and creating that wonderful gif. It helps tremendously in understanding your problem.

From what I gather, I think you're referring to the lost scroll position, correct?

[JKapostins]

@mrchief thanks! You are correct the scroll position does go to the top of the tree, but notice the entire tree gets drawn after i select a node. When i type in "sales" notice there is only two nodes under the "Job Functions" parent ("Outside Sales" and "Sales"). After i select the "sales" node, all of the nodes under "Job Functions" that do not contain "sales" in the name become visible even though "sales" is still in the search box.

[mrchief]

Ah, I see. I knew something else was happening but couldn't put my finger on it.

I think I've an idea where to start looking. Let me take a deep dive and I'll let you know.

As always, if you'd like to send a fix, I can help you with some pointers; so let me know.

[JKapostins]

Thanks @mrchief I haven't had time to dive in myself. Were you able to repro this?

[mrchief]

Yeah, I can repro this in the basic demo as well.

[mrchief]

I found the root cause and working on a fix. It's taking a bit longer because I don't want to monkey patch things. Stay tuned!

[JKapostins]

Thanks @mrchief looking forward to your updates!

[mrchief]

After going through several possible solutions, I settled for one that is least intrusive. It also turns out to be the solution that requires the least amount of code change. :)

Try v1.13.1-beta.1 or do yarn add react-dropdown-tree-select@next and let me know if it works for you.

[JKapostins]

@mrchief I just tested v1.13.1-beta.1 and i'm still getting the issue. I triple checked that I got your changes. I see them in the react-dropdown-tree-select.js.map that is distributed with the package. I blew away all my cached data and did a clean build but still get same result as before.

[JKapostins]

@mrchief disregard my previous comment. After studying your change I realized the issue is now caused by how i'm maintaining the state of the tree in redux. I'll need to re-think how i'm handling things on my end. Thanks for all your hard work!

[mrchief]

Hah! I just created a sandbox to test and was about to post the updated gif here!

Let me know if there's anything I can do to help alleviate your issue. If all else looks good, I'll publish this soon.

[JKapostins]

Yep everything is looking great. Thanks again!

[mrchief]

🎉 This issue has been resolved in version 1.14.0 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀