I'm building a Shiny app where I use bsTooltip()
from the shinyBS
package to show hover-based tooltips over question mark icons next to input labels. This works fine for most inputs like sliderInput()
and checkboxInput()
, but does not show tooltips for textInput()
fields, even though I use the same label pattern. In other parts of my code the tooltips show up for textInput()
as well.
Here's a minimal reproducible example (taken from one of my tabs):
library(shiny)
library(shinyBS)
ui <- fluidPage(
titlePanel("ShinyBS Tooltip Issue: textInput vs Others"),
# Tooltips defined for various elements
bsTooltip("mtPatternHelp",
"Regex pattern used to identify mitochondrial genes. Default '^MT-' is for human data.",
placement = "right", trigger = "hover"),
bsTooltip("sliderHelp",
"Set the range of interest for the plot Y-axis.",
placement = "right", trigger = "hover"),
bsTooltip("checkboxHelp",
"Check to save the plots to disk.",
placement = "right", trigger = "hover"),
sidebarLayout(
sidebarPanel(
# Tooltip does NOT show on hover
textInput("mtPattern",
label = tagList(
"Mitochondrial gene pattern",
tags$span(
icon("question-circle"),
id = "mtPatternHelp",
style = "margin-left: 5px; cursor: pointer; color: #1c9ed8;"
)
),
value = "^MT-"
),
# Tooltip WORKS correctly
sliderInput("someSlider",
label = tagList(
"Y-axis limit",
tags$span(
icon("question-circle"),
id = "sliderHelp",
style = "margin-left: 5px; cursor: pointer; color: #1c9ed8;"
)
),
min = 0, max = 100, value = c(10, 90)
),
# Tooltip WORKS correctly
checkboxInput("savePlot",
label = tagList(
"Save plots?",
tags$span(
icon("question-circle"),
id = "checkboxHelp",
style = "margin-left: 5px; cursor: pointer; color: #1c9ed8;"
)
),
value = TRUE
)
),
mainPanel(
verbatimTextOutput("out")
)
)
)
server <- function(input, output, session) {
output$out <- renderPrint({
list(
mtPattern = input$mtPattern,
slider = input$someSlider,
save = input$savePlot
)
})
}
shinyApp(ui, server)
The issue is the question mark icon appears, but hovering over it does nothing.
This is because in the tooltip title
"Regex pattern used to identify mitochondrial genes. Default '^MT-' is for human data."
you have special characters which have to be escaped. Use
"Regex pattern used to identify mitochondrial genes. Default \\'\\^MT-\\' is for human data."
and it will show up: