Hello again,
In the <PROJECT_NAME> project we are implementing a “link-with-editor” feature and one part of it is an A12 Tree Widget. When the user selects an element in the editor next to the tree, an item of the tree gets automatically selected, the tree expands all parents of that item, and the item will be scrolled into the viewable area of the browser. When the user selects an item in the tree, the equivalent element in the editor will be focussed, scrolled into the viewable area, and also the editor must first navigate to the appropriate site if necessary.
During implementation i found two issues that i can’t solve by myself:
- There is a property of the Tree called “scrollSelectedNodeIntoView” that comes with the “Selectable” Behavior, but it doesn’t seem to do anything. After investigating a little bit, i found that there may be an issue that the DOM reference of the tree is not correctly passed to the Selectable component wrapper. More specifically, on changing the selection
this.treeRefisnullin line 101 oftree.selectable.tsx:
protected scrollSelectedNodeIntoView(): void {
if (this.treeRef) { // null!
const selectedNode = this.treeRef.querySelector(".treeWidget__nodeContent--selected");
if (selectedNode) {
scrollIntoViewIfNeeded(selectedNode, {
scrollMode: "if-needed"
});
}
}
}
- I upgraded the widgets library to the newest version (25.6.1), because i wanted to fix the issue [A12W-3822: Tree: select only works on title, not on whole node]<INTERNAL_LINK>. But now it seems like an item gets selected implicitly, on collapsing or expanding. I guess, that’s because the propagation of the click event is not stopped when the button (with arrow) to expand/collapse already handled the click event. The consequence for our “link-with-editor” feature is, that when the user expands or collapses elements of another site of the editor, the editor will navigate implicitly and change focus etc. which is unwanted. I assume, that this behavior is rather a regression bug than a intended feature, is it?
Kind regards,
Alex