odd popover behavior if element names overlap with shiny namespace

[bwaismeyer]

Sorry, Eric, I appear to be on a quest to discover all the popover bugs.

If I assign a popover to an element and the name of that element partially overlaps with an active feature of another element... crazy stuff happens.

Specifically, observe what happens as you try to trigger the popovers for x_axis_choice2, x_axis_choice3, and x_axis_choice4. The popovers for x_axis_choice2 and x_axis_choice3 end up actually assigned the first element's second and third radio buttons.

x_axis_choice4 does not, presumably because the first element has no fourth radio button.

library(shiny)
shinyApp(
    ui = navbarPage(
        "The Case Outcome Simulator",

        # using COS to explore trends per predictor ("Explore Mode")
        tabPanel("Explore Mode", fluidPage(
            # define user tools in the first column
            # width = 3 of 12 (Shiny divides the horizontal space up into 12 sections)
            column(3, 
                   wellPanel(               
                       radioButtons("x_axis_choice", label = h4("Select X-Axis"), 
                                    choices = c("one", "two", "three")),

                       bsPopover("x_axis_choice",
                                 title = "VD1",
                                 content = "STUFF",
                                 trigger = "click",
                                 placement = "right"),

                       radioButtons("x_axis_choice2", label = h4("Select X-Axis"), 
                                    choices = c("one", "two", "three")),

                       bsPopover("x_axis_choice2",
                                 title = "VD2",
                                 content = "STUFF",
                                 trigger = "hover",
                                 placement = "right"),

                       sliderInput("x_axis_choice3", label = h4("Select X-Axis"), 
                                    min = 0, max = 100, value = 50),

                       bsPopover("x_axis_choice3",
                                 title = "VD3",
                                 content = "STUFF",
                                 trigger = "click",
                                 placement = "right"),

                       sliderInput("x_axis_choice4", label = h4("Select X-Axis"), 
                                   min = 0, max = 100, value = 50),

                       bsPopover("x_axis_choice4",
                                 title = "VD4",
                                 content = "STUFF",
                                 trigger = "hover",
                                 placement = "right")
                   )
            ),
            column(9,
                   textOutput("return_stuff")
            )
        ))
    ), 
    server = function(input, output, session) {
        output$return_stuff <- renderText({input$"x_axis_choice"})
    }
)

As you might expect, one way to address this is to simply remove the number from the end of the element name (e.g., x_axis_choice instead of x_axis_choice1). Here's an example with all the problematic element names removed. The odd behavior is gone.

library(shiny)
shinyApp(
    ui = navbarPage(
        "The Case Outcome Simulator",

        # using COS to explore trends per predictor ("Explore Mode")
        tabPanel("Explore Mode", fluidPage(
            # define user tools in the first column
            # width = 3 of 12 (Shiny divides the horizontal space up into 12 sections)
            column(3, 
                   wellPanel(               
                       radioButtons("a", label = h4("Select X-Axis"), 
                                    choices = c("one", "two", "three")),

                       bsPopover("a",
                                 title = "VD1",
                                 content = "STUFF",
                                 trigger = "click",
                                 placement = "right"),

                       radioButtons("b", label = h4("Select X-Axis"), 
                                    choices = c("one", "two", "three")),

                       bsPopover("b",
                                 title = "VD2",
                                 content = "STUFF",
                                 trigger = "hover",
                                 placement = "right"),

                       sliderInput("c", label = h4("Select X-Axis"), 
                                    min = 0, max = 100, value = 50),

                       bsPopover("c",
                                 title = "VD3",
                                 content = "STUFF",
                                 trigger = "click",
                                 placement = "right"),

                       sliderInput("d", label = h4("Select X-Axis"), 
                                   min = 0, max = 100, value = 50),

                       bsPopover("d",
                                 title = "VD4",
                                 content = "STUFF",
                                 trigger = "hover",
                                 placement = "right")
                   )
            ),
            column(9,
                   textOutput("return_stuff")
            )
        ))
    ), 
    server = function(input, output, session) {
        output$return_stuff <- renderText({input$"x_axis_choice"})
    }
)

However, I suspect this points to a deeper issue given that users are likely to be unaware of what parts of the shiny namespace should be avoided when naming elements.

[ebailey78]

Again, sorry for the lack of responsiveness. I am not getting a behavior you describe when running your example in firefox or chrome. It may be something that has sorted itself out with the newer versions of shiny. Please let me know if you are still having problems and I will try to look into it further.

[bwaismeyer]

Confirming that I am no longer see the problem as I described it above. It seems that something was done to remove accidental namespace assignment (at least in these cases).

New issue: The popovers for the sliders aren't working correctly: the V3 popover-on-click is showing up at the top left of the input range and the V4 popover-on-hover isn't visible if it's activating at all.

However, this issue occurs for both versions my code above (i.e., it doesn't seem namespace related). I haven't dug into this code in a while, so it's very possible I would just need to tweak some stuff to make the slider popovers function correctly.