Popups can't be reopened multiple times

[krasstek]

If a popup is created, closed, and opened a second time, console logs an error "Uncaught Duplicate binding for ID popupContent". Once it is closed again you can't open it any more. Using javascript to close it results in a similar situation. I also tried to destroy the popup after closing it, but that didn't work either.

I assume this is because the popup instance is created anew every time, but doesn't get destroyed as it doesn't have an id in DOM, or something like that?

Running a modified example from f7Popup should reproduce the problem for both the default popup closing and using javascript.

if (interactive()) {
  library(shiny)
  library(shinyMobile)
  library(shinyjs)
  shinyApp(
    ui = f7Page(
      title = "Popup",
      f7SingleLayout(
        useShinyjs(),
        navbar = f7Navbar(
          title = "f7Popup",
          hairline = FALSE,
          shadow = TRUE
        ),
        f7Button("togglePopup", "Toggle Popup")
      )
    ),
    server = function(input, output, session) {
      
      output$popupContent <- renderPrint(input$text)
      
      observeEvent(input$togglePopup, {
        f7Popup(
          id = "popup1",
          title = "My first popup",
          f7Text("text", "Popup content", "This is my first popup ever, I swear!"),
          f7Button("closePopup", "Close Popup"),
          verbatimTextOutput("popupContent")
        )
      })
      
      observeEvent(input$closePopup, {
        runjs("app.popup.get('.popup').close(true);")
        runjs("app.popup.get('.popup').destroy();")
      })
      
      observeEvent(input$popup1, {
        
        popupStatus <- if (input$popup1) "opened" else "closed"
        
        f7Toast(
          position = "top",
          text = paste("Popup is", popupStatus)
        )
      })
    }
  )
}

sessionInfo()

R version 4.2.2 Patched (2022-11-10 r83330)
Platform: x86_64-pc-linux-gnu (64-bit)
Running under: Ubuntu 22.04.1 LTS

Matrix products: default
BLAS:   /usr/lib/x86_64-linux-gnu/blas/libblas.so.3.10.0
LAPACK: /usr/lib/x86_64-linux-gnu/lapack/liblapack.so.3.10.0

locale:
 [1] LC_CTYPE=fi_FI.UTF-8       LC_NUMERIC=C               LC_TIME=fi_FI.UTF-8        LC_COLLATE=fi_FI.UTF-8     LC_MONETARY=fi_FI.UTF-8   
 [6] LC_MESSAGES=fi_FI.UTF-8    LC_PAPER=fi_FI.UTF-8       LC_NAME=C                  LC_ADDRESS=C               LC_TELEPHONE=C            
[11] LC_MEASUREMENT=fi_FI.UTF-8 LC_IDENTIFICATION=C       

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

other attached packages:
[1] shinyjs_2.1.0     shinyMobile_1.0.0 shiny_1.7.4      

loaded via a namespace (and not attached):
 [1] Rcpp_1.0.10       urlchecker_1.0.1  pillar_1.8.1      bslib_0.4.2       compiler_4.2.2    later_1.3.0       jquerylib_0.1.4  
 [8] remotes_2.4.2     profvis_0.3.7     prettyunits_1.1.1 tools_4.2.2       pkgload_1.3.2     digest_0.6.31     pkgbuild_1.4.0   
[15] jsonlite_1.8.4    memoise_2.0.1     lifecycle_1.0.3   rlang_1.0.6       cli_3.6.0         rstudioapi_0.14   fastmap_1.1.1    
[22] stringr_1.5.0     htmlwidgets_1.6.1 sass_0.4.5        vctrs_0.5.2       fs_1.6.1          devtools_2.4.5    glue_1.6.2       
[29] R6_2.5.1          processx_3.8.0    fansi_1.0.4       sessioninfo_1.2.2 purrr_1.0.1       callr_3.7.3       magrittr_2.0.3   
[36] usethis_2.1.6     promises_1.2.0.1  ps_1.7.2          ellipsis_0.3.2    htmltools_0.5.4   mime_0.12         xtable_1.8-4     
[43] httpuv_1.6.9      utf8_1.2.3        stringi_1.7.12    miniUI_0.1.1.1    cachem_1.0.7      crayon_1.5.2     

Also, I'd really find it useful if it still were possible to close a popup with a function like f7TogglePopup.

[dewalex]

Hi, have you found a solution for this? I have popups in my app that need to be closed programmatically and can't put them on an F7Sheet because there is too much content without having an overflow. I haven't found any modals to use as an alternative (like shinyBS) that are compatible with shinyMobile.

[DivadNojnarg]

Note: popup is likely badly handled JS side https://github.com/RinteRface/shinyMobile/blob/master/srcjs/app.js#L256