downloadButton does not work on startup if hidden, downloads html of app instead, improve docs to clarify.

[Roleren]

Just spent 12 hours coding a single button of a shiny (modular) app and it turned out shiny disables my hidden buttons on default, why would it disable programmatic clicks on a hidden download button ?

Could we maybe add a note to docs of downloadButton {shiny} that simply states:

"Shiny by default disables programmatic clicks for hidden downloadButtons, use: output options(output, "my_button_id", suspendWhenHidden = FALSE) to suppress this behavior"

Will save future versions of myself in alternate universes a lot of time.
Thank you.

[philibe]

It's a normal behavior in HTML +css.

You have to activate the element and make it invisible with a display duration of 0 seconds.

library(shiny)
library(shinyjs)



ui <- fluidPage(
  useShinyjs(),
  tags$head(
    tags$style(type = "text/css", HTML(".texte_code {
                                       font-family: Courier New,Courier,Lucida Sans Typewriter,Lucida Typewriter,monospace; 
                                       font-weight: 400; 
                                       }")),
    tags$style(type = "text/css", HTML(".display_none {
                                       display: none; 
                                       }")),
    tags$style(type = "text/css", HTML(".display_inline {
                                       display: inline; 
                                       }")),    
    tags$style(type = "text/css", 
               HTML(paste0("
               .active_invisible { animation: animeHiddend 0s linear 0s 1 normal forwards;
                                  height: 0px;}

               ")
               )
    )
  ),
  h3("works :"),
  downloadButton("downloadData1", "downloadData1"),
  h3("doesn't work "),
  splitLayout(
    actionButton("BtndownloadData2",HTML("See downloadData2 <span class='texte_code'>display: none</span>")),
    div(id="divDownloadData2",
        downloadButton("downloadData2", "downloadData2"),
        class="display_none"
    ),
    cellWidths =c("25%","25%")
  ),
  h3("works :"),
  splitLayout(
    actionButton("BtndownloadData3",HTML("See downloadData3 <span class='texte_code'>.active_invisible</span>")),
    div(id="divDownloadData3",
        downloadButton("downloadData3", "downloadData3"),
        class="active_invisible"
    ),
    cellWidths =c("25%","25%")
  )
  
)


server <- function(input, output) {
  
  data <- mtcars
  
  output$downloadData1 <- downloadHandler(
    filename = function() {
      paste("data-", format(Sys.time(),'%Y-%m-%d_%H-%M-%S'), ".csv", sep="")
    },
    content = function(file) {
      write.csv(data, file)
    }
  )
  
  output$downloadData2 <- downloadHandler(
    filename = function() {
      paste("data-", format(Sys.time(),'%Y-%m-%d_%H-%M-%S'), ".csv", sep="")
    },
    content = function(file) {
      write.csv(data, file)
    }
  )
  
  output$downloadData3 <- downloadHandler(
    filename = function() {
      paste("data-", format(Sys.time(),'%Y-%m-%d_%H-%M-%S'), ".csv", sep="")
    },
    content = function(file) {
      write.csv(data, file)
    }
  )

  
  observeEvent(input$BtndownloadData2,{
    shinyjs::removeClass(id="divDownloadData2", class="display_none")
    shinyjs::addClass(id="divDownloadData2", class="display_inline")
    
  },ignoreInit=TRUE )
  
  observeEvent(input$BtndownloadData3,{
    shinyjs::removeClass(id="divDownloadData3", class="active_invisible")
    shinyjs::addClass(id="divDownloadData3", class="display_inline")
    
  },ignoreInit=TRUE )  
  

}

shinyApp(ui, server)