Busy indicator improvements (#4172)

* Make sure spinner is visible when htmlwidget errors are visible

* Give recalculating outputs a min-height large enough to show the spinner

* tableOutput() now gets the spinner treatment

* yarn run bundle_extras

* Forward visibility hidden for all recalculating widgets, not just those with a error message (otherwise spinner won't be visible after a req())

* Update news

NEWS.md

@@ -2,6 +2,11 @@
 
 ## New features and improvements
 
+* When busy indicators are enabled (i.e., `useBusyIndicators()`), Shiny now:
+    * Shows a spinner on recalculating htmlwidgets that have previously rendered an error (including `req()` and `validate()`). (#4172)
+    * Shows a spinner on `tableOutput()`. (#4172)
+    * Places a minimum height on recalculating outputs so that the spinner is always visible. (#4172)
+
 * Shiny now uses `{cli}` instead of `{crayon}` for rich log messages. (@olivroy #4170)
 
 ## Bug fixes

R/bootstrap.R

@@ -1113,7 +1113,7 @@ plotOutput <- function(outputId, width = "100%", height="400px",
 #' @rdname renderTable
 #' @export
 tableOutput <- function(outputId) {
-  div(id = outputId, class="shiny-html-output")
+  div(id = outputId, class="shiny-html-output shiny-table-output")
 }
 
 dataTableDependency <- list(

srcts/extras/busy-indicators/busy-indicators.scss

@@ -7,6 +7,8 @@
 
   .recalculating {
 
+    min-height: var(--shiny-spinner-size, 32px);
+
     &::after {
       position: absolute;
       content: "";
@@ -45,13 +47,31 @@
       transition: opacity 250ms ease var(--shiny-spinner-delay, 1s);
     }
 
+    /*
+      When htmlwidget errors are rendered, an inline `visibility:hidden` is put
+      on the html-widget-output, and the error message (if any) is put in a
+      sibling element that overlays the output container (this way, the height
+      of the output container doesn't change). Work around this by making the
+      output container itself visible and making the children (except the
+      spinner) invisible.
+    */
+    &.html-widget-output {
+      visibility: inherit !important;
+      > * {
+        visibility: hidden;
+      }
+      ::after {
+        visibility: visible;
+      }
+    }
+
     /*
       Disable spinner on uiOutput() mainly because (for other reasons) it has
       `display:contents`, which breaks the ::after positioning.
       Note that, even if we could position it, we'd probably want to disable it
       if it has recalculating children.
     */
-    &.shiny-html-output::after {
+    &.shiny-html-output:not(.shiny-table-output)::after {
       display: none;
     }
   }
@@ -105,6 +125,9 @@
   &.shiny-busy:has(.recalculating:not(.shiny-html-output))::after {
     display: none;
   }
+  &.shiny-busy:has(.recalculating.shiny-table-output)::after {
+    display: none;
+  }
   &.shiny-busy:has(#shiny-disconnected-overlay)::after {
     display: none;
   }