shinyccloaders: withSpinner not working well with tagList

Question

I have a problem in R I cannot solve by myself and hope I will explain it correctly.

I have a shiny page where I want to include multiple outputs into one withSpinner function (from the shinycssloaders package). I want to display the output items in a specific way. I want them to be included in fluidRow and columns functions.

I have written a short example. When I click on the action button two rendertext appear in two different columns on the same line. The spinner works well when I click on the action button for the second time or more BUT when I click for the first time, spinner disappears immediately, which is a problem for my Shiny App.

I give you an exemple below:

library(shiny)
library(shinycssloaders)

ui <- fluidPage(
  textInput("text", ""),
  actionButton(inputId = "go", ""),
  
  conditionalPanel(condition = "input.go > 0", 
                   style = "display: none;", 
                   withSpinner(uiOutput("gather"))
  ))

server <- function(input, output) {
  
  val <- eventReactive(input$go, {input$text})
  
  output$text1 <- renderText({
    paste("1/", val())
  })
  
  output$text2 <- renderText({
    Sys.sleep(4)
    paste("2/", val())
  })
  
  observeEvent(input$go, 
  output$gather <- renderUI({
    
    tagList(
      fluidRow(column(textOutput(outputId = "text1"), width = 6), 
               column(textOutput(outputId = "text2"), width = 6))
    )
    
  })
  )
  
}

shinyApp(ui = ui, server = server)

Could you help me to find a way to correct the loading spinner when I click on the button for the first time. Moreover, It is really important for me to keep the display of the two output texts (in line and in two separated columns).

Thanks and regards Thibaut

Answer 1

Well, your conditionalPanel is preventing the spinner from showing up in the first run.

There is not really a reason why to use it in the first place, so you can ignore it.

This code illustrates the idea. Take note that I also removed the outer observeEvent around the renderUI as it server no purpose.

library(shiny)
library(shinycssloaders)

ui <- fluidPage(
   textInput("text", ""),
   actionButton(inputId = "go", "Show"),
   withSpinner(uiOutput("gather"))
)

server <- function(input, output) {
   
   val <- eventReactive(input$go, {input$text})
   
   output$text1 <- renderText({
      paste("1/", val())
   })
   
   output$text2 <- renderText({
      Sys.sleep(2)
      paste("2/", val())
   })
   
   output$gather <- renderUI({
      input$go
      fluidRow(column(textOutput(outputId = "text1"), width = 6), 
               column(textOutput(outputId = "text2"), width = 6))
   })
   
}

shinyApp(ui = ui, server = server)