Proxy update not working across whole app

I'm using highcharter proxy update functions to make the transitions between UI changes look slicker in my app. However, I'm finding some instances where the proxy updating functions do not trigger updates for all of the charts across the app.

For example, in one app I'm developing users need to make a selection to enter the app (the 'global selection'). This selection then needs to apply to all of the charts and tables across the app. However, a highchart that is not yet visible (i.e. on a second or third tab) will not update to honour the 'global selection'.

See the reprex shiny code (below) for a demonstration.

Any help/guidance on this would be very much appreciated. Is it a bug / feature request / coding issue?

Alex

library(shiny)
library(ggplot2)
library(dplyr)
library(highcharter)

shinyApp(

  ui <- 
    fluidPage(
      h2("Proxy update not working across tabs"),
      HTML(
        "<p>
          <b>Issue:</b> the highchart on Tab2 does not update when the number of cyclinders option changes.</br>
        </p>
        <p>
          This issue only happens on the first cycle, i.e. once Tab2 has been selected the issue resolves itself and everything updates.</br>
        </p>
        <p>
          To replicate the issue:</br>
          <ol>
            <li>Refresh the app.</li>
            <li>Change number of cyclinders from 4 ot 8 - you can see the highchart and table on this tab update.</li>
            <li>Now select Tab2 can see the highchart shows data for cars that have 4 cyclinders, not eight.</li>
          </ol>
        </p>
        <p>This issue only happens on the first cycle and only when using proxy updates. There is no issue if i was to remake the charts in response to a ui input change.</p>
        <p>However, i'm really keen to use and better understand the highchart proxy update methods.</p>
        <p>Thanks for the help!</p>"
      ),
      hr(),
      radioButtons(
        "cylinders",
        label = "Number of cylinders",
        choices = list("4", "6", "8"),
        selected = "4",
        inline = TRUE
      ),
      tabsetPanel(
        tabPanel(
          "Tab1",
          highchartOutput("plot1")
        ),
        tabPanel(
          "Tab2",
          highchartOutput("plot2")
        )
      ),
      tableOutput("data")
    ),

  server <- function(input, output, session) {

    rv <- reactiveValues

    output$plot1 <- renderPlot({

      df <-
        mtcars %>%
        filter(cyl == "4") %>%
        mutate(model = row.names(.)) %>%
        select(model, everything())

      ggplot(df, aes(model, mpg)) + 
        geom_col(fill = "#6aafd6") +
        theme_minimal()

    })

    output$plot2 <- renderPlot({

      df <-
        mtcars %>%
        filter(cyl == "4") %>%
        mutate(model = row.names(.)) %>%
        select(model, everything())

      ggplot(df, aes(model, mpg)) + 
        geom_col(fill = "#20406c") +
        theme_minimal()

    })

    output$plot1 <- renderHighchart({

      df <-
        mtcars %>%
        filter(cyl == "4") %>%
        mutate(model = row.names(.)) %>%
        select(model, everything()) %>%
        arrange(mpg)

      highchart() %>%
        hc_add_series(
          data = df,
          type = "column",
          name = "mtcars",
          hcaes(
            x = model,
            y = mpg
          ),
          color = "#6aafd6"
        ) %>%
        hc_tooltip(
          formatter =
            JS(
              "function () {
              return '<b>' + this.point.model + '</b><br/>' +
              'Number of cyclinders: ' + this.point.cyl + '</br>' +
              'Miles per gallon: ' + this.point.mpg;}"
            )
        ) %>%
        hc_xAxis(
          categories = unique(df$model)
        )

    })

    output$plot2 <- renderHighchart({

      df <-
        mtcars %>%
        filter(cyl == "4") %>%
        mutate(model = row.names(.)) %>%
        select(model, everything()) %>%
        arrange(mpg)

      highchart() %>%
        hc_add_series(
          data = df,
          type = "column",
          name = "mtcars",
          hcaes(
            x = model,
            y = mpg
          ),
          color = "#20406c"
        ) %>%
        hc_tooltip(
          formatter =
            JS(
              "function () {
              return '<b>' + this.point.model + '</b><br/>' +
              'Number of cyclinders: ' + this.point.cyl + '</br>' +
              'Miles per gallon: ' + this.point.mpg;}"
            )
        ) %>%
        hc_xAxis(
          categories = unique(df$model)
        )

    })

    output$data <- renderTable(

      mtcars %>% 
        filter(cyl == as.numeric(input$cylinders)) %>% 
        mutate(model = row.names(.)) %>%
        select(model, everything()) %>% 
        arrange(mpg)

    )

    observeEvent(input$cylinders, {

      df <- 
        mtcars %>%
        filter(cyl == as.numeric(input$cylinders)) %>%
        mutate(
          model = row.names(.)
        ) %>%
        select(model, everything()) %>% 
        arrange(mpg)

      highchartProxy("plot1") %>%
        hcpxy_set_data(
          data = df,
          type = "column",
          hcaes(
            x = model,
            y = mpg
          ),
          redraw = FALSE
        ) %>%
        hcpxy_update(
          xAxis = list(categories = unique(df$model))
        ) %>%
        hcpxy_redraw()

      highchartProxy("plot2") %>%
        hcpxy_set_data(
          data = df,
          type = "column",
          hcaes(
            x = model,
            y = mpg
          ),
          redraw = FALSE
        ) %>%
        hcpxy_update(
          xAxis = list(categories = unique(df$model))
        ) %>%
        hcpxy_redraw()

    })

  }

)

jbkunst / highcharter

Proxy update not working across whole app #730