Error in init.ts when using library(jsTreeR) about shiny HOT 3 CLOSED

I've found the reason @gadenbuie - see https://stackoverflow.com/a/77993889/1100107. That's the jsTreeGrid plugin which copies the classes of the tree to the grid.

So I changed the regex to /(^shiny|^jstree(r|-|$))/ in jstreegrid.js, to prevent the classes shiny-bound-output and jstreer to be copied, and the problem has gone.

from shiny.

What's interesting is that I see two .shiny-bound-output objects -- or even two htmlwidgets in this example:

document.querySelectorAll(".shiny-bound-output")
// NodeList(2) [...]
document.querySelectorAll(".shiny-bound-output").forEach(el => console.log(`${el.tagName}${el.id ? "#" : ""}${el.id}.${[...el.classList].join('.')}`))
// DIV.jstree-grid-wrapper.jstreer.html-widget.html-widget-output.shiny-report-size.html-fill-item.shiny-bound-output
// DIV#jstree.jstreer.html-widget.html-widget-output.shiny-report-size.html-fill-item.shiny-bound-output.jstree.jstree-1.jstree-grid-cell.jstree-default

The element with #jstree does have the correct binding; it's the .jstree-grid-wrapper that's throwing the error:

$("#jstree").data("shiny-output-binding")
// OutputBindingAdapter2 {el: div#jstree.jstreer.html-widget.html-widget-output.shiny-report-size.html-fill-item.shiny-bound-outp…, binding: OutputBinding2, onResize: ƒ}
$(".jstree-grid-wrapper").data("shiny-output-binding")
// undefined

My first instinct is to look into the jstree initialization code. Maybe you're cloning or re-using an initial element and retaining some classes on the copy that aren't needed?

from shiny.

@gadenbuie thanks for the hints!

To me the jstree initialization code looks just like the boilerplate.

The class shiny-bound-output seems to be added here, however, so far I don't understand how or where the jstree-grid-wrapper element is enlisted or chosen for binding. I'll keep digging.

from shiny.