onSort option doesn't work properly when names in sortable list are the same.

[gcpoole]

When using the onSort option, something like this:

sortable_js(css_id = "example_1",
              options = sortable_options(
                onSort = sortable_js_capture_input("reorder_1")
              ))

The observer on input$reorder_1 only fires once if the items in the list have the same text.

Try the MRE. It should be self explanatory. Basically, if the text of a collection of sortable objects is not unique, the observer may not fire.

This might seem trivial, in that the second example in the MRE is "the same" regardless of the sort order. However, for more complex objects -- e.g. for boxes in shinydashboard, if two adjacent sortable boxes have the same name but different content, the observer doesn't fire if the position of the two boxes are switched. Same applies to objects with different ids but same text.

The third case In the MRE is even more insidious because it is so intermittent.

Here is a shiny app as an MRE:

library(shiny)
library(sortable)

# Define UI for shinydashboard
ui <- fluidPage(
  tags$p("Example 1 - Read the following then sort the lines.  This works perfectly."),
  tags$ul(
    id = "example_1",
    tags$li("= These lines of text are sortable"),
    tags$li("= Try sorting them."),
    tags$li("= The observer prints to the console each time you do."),
    tags$li("= But only because the lines are different.")
  ),
  sortable_js(css_id = "example_1",
              options = sortable_options(
                onSort = sortable_js_capture_input("reorder_1")
              )),
  tags$p("Example 2 - Here, the observer fires only on the first sort.  Try sorting the lines below"),
  tags$ul(
    id = "example_2",
    tags$li("= The oberver only fires once if the text is the same."),
    tags$li("= The oberver only fires once if the text is the same."),
    tags$li("= The oberver only fires once if the text is the same."),
    tags$li("= The oberver only fires once if the text is the same.")
  ),
  sortable_js(css_id = "example_2",
              options = sortable_options(
                onSort = sortable_js_capture_input("reorder_2")
              )),
  tags$p("Example 3 - Read the lines below.  Then try sorting them.  Observer always fires once, and then usually fires, but not if you put the identical lines next to one another and then swap the identical lines."),
  tags$ul(
    id = "example_3",
    tags$li("= On the first sort, the observer always fires."),
    tags$li("= After the first sort, the observer ususally fires."),
    tags$li("= But if the identical lines are placed next to one another."),
    tags$li("= And then you swap them."),
    tags$li("= The observer doesn't fire."),
    tags$li("= Identical line."),
    tags$li("= Identical line.")
  ),
  sortable_js(css_id = "example_3",
              options = sortable_options(
                onSort = sortable_js_capture_input("reorder_3")
              ))
)

# Define server logic to dynamically create menuSubItems
server <- function(input, output) {

  # Message appears in the console each time the list is sorted
  observeEvent(input$reorder_1, {
    print("Sorted 1")
  })

  # Message appears in the console only the first time the list is sorted.
  observeEvent(input$reorder_2, {
    print("Sorted 2")
  })

  # Message appears in the console only the first time the list is sorted.
  observeEvent(input$reorder_3, {
    print("Sorted 3")
  })
  
}

# Run the application
shinyApp(ui = ui, server = server)