Busy indicator improvements

NEWS.md

@@ -2,9 +2,12 @@
 
 ## New features and improvements
 
-* Small improvements to the default pulse busy indicator to better blend with any background. It's also now slightly smaller by default. (#4122)
-
-* When spinners and the pulse busy indicators are enabled, Shiny now shows the pulse indicator when dynamic UI elements are recalculating if no other spinners are present in the app. (#4137)
+* 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)
+    * Shows the pulse indicator when dynamic UI elements are recalculating if no other spinners are present in the app. (#4137)
+    * The pulse indicator now blends in better with any background color. It's also slightly smaller by default. (#4122)
 
 * Improve collection of deep stack traces (stack traces that are tracked across steps in an async promise chain) with `coro` async generators such as `elmer` chat streams. Previously, Shiny treated each iteration of an async generator as a distinct deep stack, leading to pathologically long stack traces; now, Shiny only keeps/prints unique deep stack trace, discarding duplicates. (#4156)
 

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;
   }