types do not work in shiny modules

[thothal]

Problem
Using the types argument of shinyTree in a module results in the tree not being rendered. This happens only when using the tree in a module.

Code

library(shiny)
library(shinyTree)


elem <- structure("", sttype = "elem")
my_tree <- list(root1 = structure(list(elem1 = elem, elem2 = elem, elem3 = elem), 
                                  sttype = "root"),
                root2 = structure(list(elem1 = elem, elem2 = elem, elem3 = elem), 
                                  sttype = "root"),
                root3 = structure(list(elem1 = elem, elem2 = elem, elem3 = elem),
                                  sttype = "root"))

get_part_tree <- function(scope) {
  part_tree <- my_tree[-sample(3, 1)]
  names(part_tree) <- paste(scope, names(part_tree), sep = "_")
  part_tree
}

tree_module_ui <- function(id) {
  ns <- NS(id)
  tagList(
    actionButton(ns("go"), "Go!"),
    h4("Tree with Types"),
    shinyTree(ns("tree_with_type"),
              types = "{'root': {'icon': 'fa fa-archive'}, 'elem':{'icon': 'fa fa-file'}}"),
    h4("Tree without Types"),
    shinyTree(ns("tree_without_type"))
  )
}

tree_module <- function(input, output, session) {
  output$tree_without_type <- renderTree({
    input$go
    get_part_tree("Module w/o Type")
  })
  
  output$tree_with_type <- renderTree({
    input$go
    get_part_tree("Module w/ Type")
  })
}

ui <- fluidPage(
  h3("Module"),
  tree_module_ui("tree_module"),
  h3("Main App"),
  actionButton("go", "Go!"),
  h4("Tree with Types"),
  shinyTree("tree_with_type",
            types = "{'root': {'icon': 'fa fa-archive'}, 'elem': {'icon': 'fa fa-file'}}"),
  h4("Tree without Types"),
  shinyTree("tree_without_type")
)

server <- function(input, output, session) {
  callModule(tree_module,
             "tree_module")

  output$tree_without_type <- renderTree({
    input$go
    get_part_tree("Main w/o Type")
  })
  
  output$tree_with_type <- renderTree({
    input$go
    get_part_tree("Main w/ Type")
  })
}

shinyApp(ui, server)

Session Info

R version 3.5.1 (2018-07-02)
Platform: x86_64-w64-mingw32/x64 (64-bit)
Running under: Windows 10 x64 (build 16299)

Matrix products: default

locale:
[1] LC_COLLATE=German_Germany.1252  LC_CTYPE=German_Germany.1252   
[3] LC_MONETARY=German_Germany.1252 LC_NUMERIC=C                   
[5] LC_TIME=German_Germany.1252    

attached base packages:
[1] stats     graphics  grDevices utils     datasets  methods   base     

other attached packages:
[1] shinyTree_0.2.7 shiny_1.3.2    

loaded via a namespace (and not attached):
 [1] Rcpp_1.0.1      digest_0.6.19   later_0.8.0     mime_0.7       
 [5] R6_2.4.0        xtable_1.8-4    jsonlite_1.6    magrittr_1.5   
 [9] stringi_1.4.3   promises_1.0.1  tools_3.5.1     stringr_1.4.0  
[13] htmlwidgets_1.3 httpuv_1.5.1    compiler_3.5.1  htmltools_0.3.6

[trafficonese]

This happens because shinyTree creates a JS script with the types, but since they are in a module shiny appends the Namespace ID to it and combines it with a hyphen -.

Running your example you should see something like this in the HTML head:

<script>
  tree_module-tree_with_type_sttypes = {'root': {'icon': 'fa fa-archive'}, 'elem':{'icon': 'fa fa-file'}}
</script>

And in the console you will see this error, because hyphens are not allowed in a variable name.

ReferenceError: invalid assignment left-hand side

This issue on shiny is related.

[bvancil]

Thanks for the answer, @trafficonese! Would a viable path to getting this to work be to edit the shinyTree code to change that JavaScript to create an Object somewhere and then add a property to the object for each Shiny module, something like (and I don't know JavaScript well, so please bear with me):

<script>
  var shiny_tree_variable_name_here = Object();
</script>

and then for each module

<script>
  shiny_tree_variable_name_here['tree_module'] = {'tree_with_type_sttypes': {'root': {'icon': 'fa fa-archive'}, 'elem':{'icon': 'fa fa-file'}}}
</script>

I'm not sure I have the structure right, but could something like this work?

[trafficonese]

Something like that could work too. Unfortunately I'm also not a JS expert.

I uploaded a PR already which should fix that problem, although it is maybe more of a hack than a nice solution. I just exchange all hyphens with an underscore.

It would be really nice, if shiny would allow to set the separator used for modules. For now it is hardcoded in this variable ns.sep.