JohnCoene / cicerone

🏛️ Give tours of your Shiny apps
https://cicerone.john-coene.com
Other
187 stars 7 forks source link

Shiny app using navbarMenu & tabsetPanel #66

Open skusrini-shell opened 4 months ago

skusrini-shell commented 4 months ago

Summary of the problem: navbarMenu tabs can be highlighted by a guide when using the most recent cicerone release on CRAN however the tab panel switch does not work. If I use the most recent dev release, switching between tabs in tabsetPanel works fine however navbarMenu tabs cannot be highlighted anymore.

I have the following minimal shiny app as an example:

library(shiny)

ui <- fluidPage(
  use_cicerone(),
  navbarPage('App Title',
             tabPanel('Plot',
                      tabsetPanel(id = 'tabz',
                                  tabPanel('tab1', h2('show plot of tab 1 here', id = 'plot')),
                                  tabPanel('tab2', h2('show plot of tab 2 here', id = 'plottab2')))),
             navbarMenu('More',
                        tabPanel('Summary'),
                        hr(),
                        'Section header',
                        tabPanel('Table')
             )
  )
)

server <- function(input, output){

  # initialise then start the guide
  guide$init()$start()

}

shinyApp(ui, server)

When I use the most recent release from cicerone then the tab change would not work:

library(cicerone)

guide <- Cicerone$
  new()$
  step(
    el = 'plot',
    title = 'Text Input',
    description = 'This is where you enter the text you want to print.'
  )$
  step(
    'plottab2',
    'Plot on tab 2',
    'Here is a plot on tab 2',
    tab = 'tab2',
    tab_id = 'tabz'
  )

but highlighting the first level of a navbarMenu in a guide works. However this does not work for the subtab:

library(cicerone)

guide <- Cicerone$
  new()$
  step(
    '[data-value="More"]',
    'More tab options',
    'Select one of the subtabs',
    is_id = FALSE
  )$
  step(
    '[data-value="Summary"]',
    'Summary tab',
    'Select one of the subtabs',
    is_id = FALSE
  )

When I use the most recent dev release of cicerone switching tabs of a tabsetPanel works perfectly fine:

library(cicerone)

guide <- Cicerone$
  new()$
  step(
    el = 'plot',
    title = 'Text Input',
    description = 'This is where you enter the text you want to print.'
  )$
  step(
    'plottab2',
    'Plot on tab 2',
    'Here is a plot on tab 2',
    tab = 'tab2',
    tab_id = 'tabz'
  )

however even just guiding to the top layer of a navbarMenu causes the app to crash

library(cicerone)

guide <- Cicerone$
  new()$
  step(
    el = 'plot',
    title = 'Text Input',
    description = 'This is where you enter the text you want to print.'
  )$
  step(
    'plottab2',
    'Plot on tab 2',
    'Here is a plot on tab 2',
    tab = 'tab2',
    tab_id = 'tabz'
  )$
  step(
    '[data-value="More"]',
    'More tab options',
    'Select one of the subtabs',
    is_id = FALSE
  )$
  step(
    '[data-value="Summary"]',
    'Summary tab',
    'Select one of the subtabs',
    is_id = FALSE
  )