Plotly output in nested tables is not showing with htmlwidgets version 1.6.0

[tomsing1]

I am trying to generate a nested table that shows a plot (generated with plotly) when a row is expanded.
Unfortunately, the output web page only shows a blank space instead of the plot.

Here is a small example, based on a gist by @jthomasmock (I have broken out the details_function() to test it outside the table.)

library(reactable)
library(tidyverse)
library(plotly)
library(glue)
library(htmltools)
library(sparkline)
library(sessioninfo)

car_df <- mtcars %>%
  group_by(cyl) %>% 
  summarize(mpg = list(mpg)) %>% 
  dplyr::mutate(
    Sparkline = NA,
    color = c("red", "blue", "green")
  )

detail_function <- function(index){
      match_cyl <- car_df$cyl[index]
      plots_data <- filter(mtcars, cyl == match_cyl)
      plot_col <- filter(car_df, cyl == match_cyl) %>% pull(color)
      htmltools::div(style = "padding: 30px", {
        p1 <- ggplot(plots_data, aes(x = mpg, y = disp)) +
          geom_point(data = mtcars, color = "grey", alpha = 0.5) +
          geom_point(color = plot_col) +
          theme_minimal() +
          scale_x_continuous(limits = c(0, max(mtcars$mpg) * 1.1)) +
          scale_y_continuous(limits = c(0, max(mtcars$disp) * 1.1)) +
          geom_hline(yintercept = 0) +
          geom_vline(xintercept = 0) +
          labs(title = glue::glue("Plot for {match_cyl} cylinders."),
               x = "MPG", y = "Displacement")
        
        plotly::ggplotly(p1)
      }
      )
}

car_df %>% 
  reactable(
    # Define columns
    # hide two columns and create a sparkline from the nested MPG data
    columns = list(
      mpg = colDef(show = FALSE),
      color = colDef(show = FALSE),
      Sparkline = colDef(cell = function(value, index){
        sparkline(car_df$mpg[[index]])
      })
    ),
    # Details creates a dropdown area that we can fill with a div
    details = detail_function
  )

The details_function() creates an interactive plot when called outside the reactable() call, e.g. for the first index / row:

htmltools::browsable(detail_function(1))

But when I render the full table, I only see a blank space where the plot should be:

car_df %>% 
  reactable(
    # Define columns
    # hide two columns and create a sparkline from the nested MPG data
    columns = list(
      mpg = colDef(show = FALSE),
      color = colDef(show = FALSE),
      Sparkline = colDef(cell = function(value, index){
        sparkline(car_df$mpg[[index]])
      })
    ),
    # Details creates a dropdown area that we can fill with a div
    details = detail_function
  )

Here is my session information:

> sessioninfo::session_info()
─ Session info ────────────────────────────────────────────────────────────────────────────────────
 setting  value
 version  R version 4.2.2 (2022-10-31)
 os       macOS Monterey 12.6
 system   x86_64, darwin17.0
 ui       RStudio
 language (EN)
 collate  en_US.UTF-8
 ctype    en_US.UTF-8
 tz       America/Los_Angeles
 date     2022-12-20
 rstudio  2022.07.2+576 Spotted Wakerobin (desktop)
 pandoc   NA

─ Packages ────────────────────────────────────────────────────────────────────────────────────────
 package       * version date (UTC) lib source
 askpass         1.1     2019-01-13 [1] CRAN (R 4.2.0)
 assertthat      0.2.1   2019-03-21 [1] CRAN (R 4.2.0)
 backports       1.4.1   2021-12-13 [1] CRAN (R 4.2.0)
 broom           1.0.2   2022-12-15 [1] CRAN (R 4.2.0)
 cellranger      1.1.0   2016-07-27 [1] CRAN (R 4.2.0)
 cli             3.4.1   2022-09-23 [1] CRAN (R 4.2.0)
 colorspace      2.0-3   2022-02-21 [1] CRAN (R 4.2.0)
 crayon          1.5.2   2022-09-29 [1] CRAN (R 4.2.0)
 credentials     1.3.2   2021-11-29 [1] CRAN (R 4.2.0)
 crosstalk       1.2.0   2021-11-04 [1] CRAN (R 4.2.0)
 curl            4.3.3   2022-10-06 [1] CRAN (R 4.2.0)
 data.table      1.14.6  2022-11-16 [1] CRAN (R 4.2.0)
 DBI             1.1.3   2022-06-18 [1] CRAN (R 4.2.0)
 dbplyr          2.2.1   2022-06-27 [1] CRAN (R 4.2.0)
 digest          0.6.31  2022-12-11 [1] CRAN (R 4.2.0)
 dplyr         * 1.0.10  2022-09-01 [1] CRAN (R 4.2.0)
 ellipsis        0.3.2   2021-04-29 [1] CRAN (R 4.2.0)
 fansi           1.0.3   2022-03-24 [1] CRAN (R 4.2.0)
 fastmap         1.1.0   2021-01-25 [1] CRAN (R 4.2.0)
 forcats       * 0.5.2   2022-08-19 [1] CRAN (R 4.2.0)
 fs              1.5.2   2021-12-08 [1] CRAN (R 4.2.0)
 gargle          1.2.1   2022-09-08 [1] CRAN (R 4.2.0)
 generics        0.1.3   2022-07-05 [1] CRAN (R 4.2.0)
 ggplot2       * 3.4.0   2022-11-04 [1] CRAN (R 4.2.0)
 glue          * 1.6.2   2022-02-24 [1] CRAN (R 4.2.0)
 googledrive     2.0.0   2021-07-08 [1] CRAN (R 4.2.0)
 googlesheets4   1.0.1   2022-08-13 [1] CRAN (R 4.2.0)
 gtable          0.3.1   2022-09-01 [1] CRAN (R 4.2.0)
 haven           2.5.1   2022-08-22 [1] CRAN (R 4.2.0)
 hms             1.1.2   2022-08-19 [1] CRAN (R 4.2.0)
 htmltools     * 0.5.4   2022-12-07 [1] CRAN (R 4.2.0)
 htmlwidgets     1.6.0   2022-12-15 [1] CRAN (R 4.2.0)
 httr            1.4.4   2022-08-17 [1] CRAN (R 4.2.0)
 jsonlite        1.8.4   2022-12-06 [1] CRAN (R 4.2.0)
 knitr           1.41    2022-11-18 [1] CRAN (R 4.2.0)
 labeling        0.4.2   2020-10-20 [1] CRAN (R 4.2.0)
 lazyeval        0.2.2   2019-03-15 [1] CRAN (R 4.2.0)
 lifecycle       1.0.3   2022-10-07 [1] CRAN (R 4.2.0)
 lubridate       1.9.0   2022-11-06 [1] CRAN (R 4.2.0)
 magrittr        2.0.3   2022-03-30 [1] CRAN (R 4.2.0)
 modelr          0.1.10  2022-11-11 [1] CRAN (R 4.2.0)
 munsell         0.5.0   2018-06-12 [1] CRAN (R 4.2.0)
 openssl         2.0.5   2022-12-06 [1] CRAN (R 4.2.0)
 pillar          1.8.1   2022-08-19 [1] CRAN (R 4.2.0)
 pkgconfig       2.0.3   2019-09-22 [1] CRAN (R 4.2.0)
 plotly        * 4.10.1  2022-11-07 [1] CRAN (R 4.2.0)
 purrr         * 0.3.5   2022-10-06 [1] CRAN (R 4.2.0)
 R6              2.5.1   2021-08-19 [1] CRAN (R 4.2.0)
 reactable     * 0.4.1   2022-12-08 [1] CRAN (R 4.2.0)
 reactR          0.4.4   2021-02-22 [1] CRAN (R 4.2.0)
 readr         * 2.1.3   2022-10-01 [1] CRAN (R 4.2.0)
 readxl          1.4.1   2022-08-17 [1] CRAN (R 4.2.0)
 reprex          2.0.2   2022-08-17 [1] CRAN (R 4.2.0)
 rlang           1.0.6   2022-09-24 [1] CRAN (R 4.2.0)
 rstudioapi      0.14    2022-08-22 [1] CRAN (R 4.2.0)
 rvest           1.0.3   2022-08-19 [1] CRAN (R 4.2.0)
 scales          1.2.1   2022-08-20 [1] CRAN (R 4.2.0)
 sessioninfo   * 1.2.2   2021-12-06 [1] CRAN (R 4.2.0)
 sparkline     * 2.0     2016-11-12 [1] CRAN (R 4.2.0)
 stringi         1.7.8   2022-07-11 [1] CRAN (R 4.2.0)
 stringr       * 1.5.0   2022-12-02 [1] CRAN (R 4.2.0)
 sys             3.4.1   2022-10-18 [1] CRAN (R 4.2.0)
 tibble        * 3.1.8   2022-07-22 [1] CRAN (R 4.2.0)
 tidyr         * 1.2.1   2022-09-08 [1] CRAN (R 4.2.0)
 tidyselect      1.2.0   2022-10-10 [1] CRAN (R 4.2.0)
 tidyverse     * 1.3.2   2022-07-18 [1] CRAN (R 4.2.0)
 timechange      0.1.1   2022-11-04 [1] CRAN (R 4.2.0)
 tzdb            0.3.0   2022-03-28 [1] CRAN (R 4.2.0)
 utf8            1.2.2   2021-07-24 [1] CRAN (R 4.2.0)
 vctrs           0.5.1   2022-11-16 [1] CRAN (R 4.2.0)
 viridisLite     0.4.1   2022-08-22 [1] CRAN (R 4.2.0)
 withr           2.5.0   2022-03-03 [1] CRAN (R 4.2.0)
 xfun            0.35    2022-11-16 [1] CRAN (R 4.2.0)
 xml2            1.3.3   2021-11-30 [1] CRAN (R 4.2.0)
 yaml            2.3.6   2022-10-18 [1] CRAN (R 4.2.0)

 [1] /Users/tomsing1/Library/R/x86_64/4.2/library
 [2] /Library/Frameworks/R.framework/Versions/4.2/Resources/library

Any pointers on how to fix this issue would be great! Many thanks!

[tomsing1]

P.S.: Updating both the plotly and reactable packages to their latest development version (main branch on github) doesn't fix the issue for me:

> sessioninfo::session_info()
─ Session info ────────────────────────────────────────────────────────────────────────────────────
 setting  value
 version  R version 4.2.2 (2022-10-31)
 os       macOS Monterey 12.6
 system   x86_64, darwin17.0
 ui       RStudio
 language (EN)
 collate  en_US.UTF-8
 ctype    en_US.UTF-8
 tz       America/Los_Angeles
 date     2022-12-20
 rstudio  2022.07.2+576 Spotted Wakerobin (desktop)
 pandoc   NA

─ Packages ────────────────────────────────────────────────────────────────────────────────────────
 package       * version     date (UTC) lib source
 askpass         1.1         2019-01-13 [1] CRAN (R 4.2.0)
 assertthat      0.2.1       2019-03-21 [1] CRAN (R 4.2.0)
 backports       1.4.1       2021-12-13 [1] CRAN (R 4.2.0)
 broom           1.0.2       2022-12-15 [1] CRAN (R 4.2.0)
 cellranger      1.1.0       2016-07-27 [1] CRAN (R 4.2.0)
 cli             3.4.1       2022-09-23 [1] CRAN (R 4.2.0)
 colorspace      2.0-3       2022-02-21 [1] CRAN (R 4.2.0)
 crayon          1.5.2       2022-09-29 [1] CRAN (R 4.2.0)
 credentials     1.3.2       2021-11-29 [1] CRAN (R 4.2.0)
 crosstalk       1.2.0       2021-11-04 [1] CRAN (R 4.2.0)
 curl            4.3.3       2022-10-06 [1] CRAN (R 4.2.0)
 data.table      1.14.6      2022-11-16 [1] CRAN (R 4.2.0)
 DBI             1.1.3       2022-06-18 [1] CRAN (R 4.2.0)
 dbplyr          2.2.1       2022-06-27 [1] CRAN (R 4.2.0)
 digest          0.6.31      2022-12-11 [1] CRAN (R 4.2.0)
 dplyr         * 1.0.10      2022-09-01 [1] CRAN (R 4.2.0)
 ellipsis        0.3.2       2021-04-29 [1] CRAN (R 4.2.0)
 fansi           1.0.3       2022-03-24 [1] CRAN (R 4.2.0)
 fastmap         1.1.0       2021-01-25 [1] CRAN (R 4.2.0)
 forcats       * 0.5.2       2022-08-19 [1] CRAN (R 4.2.0)
 fs              1.5.2       2021-12-08 [1] CRAN (R 4.2.0)
 gargle          1.2.1       2022-09-08 [1] CRAN (R 4.2.0)
 generics        0.1.3       2022-07-05 [1] CRAN (R 4.2.0)
 ggplot2       * 3.4.0       2022-11-04 [1] CRAN (R 4.2.0)
 glue          * 1.6.2       2022-02-24 [1] CRAN (R 4.2.0)
 googledrive     2.0.0       2021-07-08 [1] CRAN (R 4.2.0)
 googlesheets4   1.0.1       2022-08-13 [1] CRAN (R 4.2.0)
 gtable          0.3.1       2022-09-01 [1] CRAN (R 4.2.0)
 haven           2.5.1       2022-08-22 [1] CRAN (R 4.2.0)
 hms             1.1.2       2022-08-19 [1] CRAN (R 4.2.0)
 htmltools     * 0.5.4       2022-12-07 [1] CRAN (R 4.2.0)
 htmlwidgets     1.6.0       2022-12-15 [1] CRAN (R 4.2.0)
 httr            1.4.4       2022-08-17 [1] CRAN (R 4.2.0)
 jsonlite        1.8.4       2022-12-06 [1] CRAN (R 4.2.0)
 knitr           1.41        2022-11-18 [1] CRAN (R 4.2.0)
 labeling        0.4.2       2020-10-20 [1] CRAN (R 4.2.0)
 lazyeval        0.2.2       2019-03-15 [1] CRAN (R 4.2.0)
 lifecycle       1.0.3       2022-10-07 [1] CRAN (R 4.2.0)
 lubridate       1.9.0       2022-11-06 [1] CRAN (R 4.2.0)
 magrittr        2.0.3       2022-03-30 [1] CRAN (R 4.2.0)
 modelr          0.1.10      2022-11-11 [1] CRAN (R 4.2.0)
 munsell         0.5.0       2018-06-12 [1] CRAN (R 4.2.0)
 openssl         2.0.5       2022-12-06 [1] CRAN (R 4.2.0)
 pillar          1.8.1       2022-08-19 [1] CRAN (R 4.2.0)
 pkgconfig       2.0.3       2019-09-22 [1] CRAN (R 4.2.0)
 plotly        * 4.10.1.9000 2022-12-20 [1] Github (plotly/plotly.R@3a33b1a)
 purrr         * 0.3.5       2022-10-06 [1] CRAN (R 4.2.0)
 R6              2.5.1       2021-08-19 [1] CRAN (R 4.2.0)
 reactable     * 0.4.1.9000  2022-12-20 [1] Github (glin/reactable@cf500a1)
 reactR          0.4.4       2021-02-22 [1] CRAN (R 4.2.0)
 readr         * 2.1.3       2022-10-01 [1] CRAN (R 4.2.0)
 readxl          1.4.1       2022-08-17 [1] CRAN (R 4.2.0)
 reprex          2.0.2       2022-08-17 [1] CRAN (R 4.2.0)
 rlang           1.0.6       2022-09-24 [1] CRAN (R 4.2.0)
 rstudioapi      0.14        2022-08-22 [1] CRAN (R 4.2.0)
 rvest           1.0.3       2022-08-19 [1] CRAN (R 4.2.0)
 scales          1.2.1       2022-08-20 [1] CRAN (R 4.2.0)
 sessioninfo   * 1.2.2       2021-12-06 [1] CRAN (R 4.2.0)
 sparkline     * 2.0         2016-11-12 [1] CRAN (R 4.2.0)
 stringi         1.7.8       2022-07-11 [1] CRAN (R 4.2.0)
 stringr       * 1.5.0       2022-12-02 [1] CRAN (R 4.2.0)
 sys             3.4.1       2022-10-18 [1] CRAN (R 4.2.0)
 tibble        * 3.1.8       2022-07-22 [1] CRAN (R 4.2.0)
 tidyr         * 1.2.1       2022-09-08 [1] CRAN (R 4.2.0)
 tidyselect      1.2.0       2022-10-10 [1] CRAN (R 4.2.0)
 tidyverse     * 1.3.2       2022-07-18 [1] CRAN (R 4.2.0)
 timechange      0.1.1       2022-11-04 [1] CRAN (R 4.2.0)
 tzdb            0.3.0       2022-03-28 [1] CRAN (R 4.2.0)
 utf8            1.2.2       2021-07-24 [1] CRAN (R 4.2.0)
 vctrs           0.5.1       2022-11-16 [1] CRAN (R 4.2.0)
 viridisLite     0.4.1       2022-08-22 [1] CRAN (R 4.2.0)
 withr           2.5.0       2022-03-03 [1] CRAN (R 4.2.0)
 xfun            0.35        2022-11-16 [1] CRAN (R 4.2.0)
 xml2            1.3.3       2021-11-30 [1] CRAN (R 4.2.0)
 yaml            2.3.6       2022-10-18 [1] CRAN (R 4.2.0)

 [1] /Users/tomsing1/Library/R/x86_64/4.2/library
 [2] /Library/Frameworks/R.framework/Versions/4.2/Resources/library

[tomsing1]

I was able to narrow down the issue: it seems that a change in the htmlwidgets package breaks the display of the nested plots. After installing htmlwidgets version 1.5.4, the plots are shown:

remotes::install_version("htmlwidgets", version= "1.5.4")

But with the latest version (htmlwidgets version 1.6.0) they are missing. I will report this issue in the htmlwidgets repository as well, in case the problem has arisen there.

[glin]

Thanks for the report, this is most likely a bug in reactable. I'll take a further look this weekend, but for now, I think pinning on htmlwidgets 1.5.4 would be the best workaround.

The plotly widget HTML now has two class attributes on the widget element, which I didn't know was possible. When reactable converts the HTML for rendering in the table, only the last class is included, which breaks widget rendering.

p <- plotly::plot_ly(data = data.frame(x = 1, y = 2), type = "scatter", mode = "lines")
str(htmltools::as.tags(p))
# List of 3
# $ :List of 3
# ..$ : NULL
# ..$ :List of 3
# .. ..$ name    : chr "div"
# .. ..$ attribs :List of 4
# .. .. ..$ id   : chr "htmlwidget-c7331b2cf701d3378740"
# .. .. ..$ style: chr "width:100%;height:400px;"
# .. .. ..$ class: chr "plotly html-widget html-fill-item-overflow-hidden"
# .. .. ..$ class: chr "html-fill-item"

[glin]

This should now be fixed in the latest development version:

• Fixed rendering of embedded HTML widgets when htmlwidgets 1.6.0 or later is installed. In general, fixed rendering of any Shiny HTML tags with duplicate attributes. (@tomsing1, #306)

And I might submit a quick patch to CRAN considering how bad it is. thanks!

[tomsing1]

Awesome! Thank you so much for fixing the issue so quickly. Much appreciated!