bs4Dash icon indicating copy to clipboard operation
bs4Dash copied to clipboard

tooltip not working with bookmarkButton?

Open b-rodrigues opened this issue 2 years ago • 2 comments

Hi

it seems that adding tooltips doesn’t work with bookmarkButton()’s? Here’s a MRE:

  library(shiny)
  library(bs4Dash)

  shinyApp(
    ui = dashboardPage(
      header = dashboardHeader(
        title = bs4DashBrand(
          title = "My dashboard",
        )
      ),
      sidebar = dashboardSidebar(),
      body = dashboardBody(
  tooltip(
        title = "Coucou",
          actionButton(
            "goButton", "Go!", 
            status = "danger", 
            outline = TRUE, 
            flat = TRUE, 
            size = "lg"
          ),
        ),
  tooltip(
    title = ":(",
    bookmarkButton(
      label = "Bookmark"
    ),
    )
      ),
      controlbar = dashboardControlbar(),
      title = "DashboardPage"
    ),
    server = function(input, output) {
    }
  )

b-rodrigues avatar Oct 06 '22 09:10 b-rodrigues

Hi Bruno,

Screenshot 2022-10-12 at 14 57 04

I get a JS error in the console because of the wrong id format. I don't know why the bookmarkButton function code provides such id by default, given that any punctuation triggers a jQuery error (see here: https://unleash-shiny.rinterface.com/custom-templates-testing.html#avoid-wrong-jquery-selectors):

bookmarkButton <- function (label = "Bookmark...", icon = shiny::icon("link", lib = "glyphicon"), 
    title = "Bookmark this application's state and get a URL for sharing.", 
    ..., id = "._bookmark_") { ... }

So a workaround for you would be to pass an id. I would be curious to know the reason behind this default value for id on the Shiny side (poke @schloerke). That being said, here is a working code:

library(shiny)
library(bs4Dash)

enableBookmarking(store = "url")

shinyApp(
  ui = dashboardPage(
    header = dashboardHeader(
      title = bs4DashBrand(
        title = "My dashboard",
      )
    ),
    sidebar = dashboardSidebar(),
    body = dashboardBody(
      tooltip(
        title = "Coucou",
        actionButton(
          "goButton", "Go!", 
          status = "danger", 
          outline = TRUE, 
          flat = TRUE, 
          size = "lg"
        ),
      ),
      tooltip(
        title = ":(",
        bookmarkButton(
          label = "Bookmark", id = "bookmark"
        ),
      )
    ),
    controlbar = dashboardControlbar(),
    title = "DashboardPage"
  ),
  server = function(input, output, session) {
    observeEvent(input$bookmark, {
      session$doBookmark()
    })
  }
)

DivadNojnarg avatar Oct 12 '22 13:10 DivadNojnarg

Hi @DivadNojnarg

many thanks!

b-rodrigues avatar Oct 12 '22 13:10 b-rodrigues