diff --git a/CHANGELOG.md b/CHANGELOG.md
index a319b07..3ca1abd 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,6 +7,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+* Fixed an issue where Plotly `FigureWidget` outputs in filling layouts could briefly render at the wrong height and then visibly jump to their final size on initial render or rerender. Plotly outputs now wait for Plotly's own resize cycle before being revealed, and Playwright coverage was added for the first visible Plotly paint. (#208, #236)
 * Fixed an issue where browser-originated widget buffers were not decoded back into bytes on the server before being forwarded to ipywidgets, which broke binary `update` and `custom` comm traffic from widgets running in the browser. Added Playwright regression coverage for both paths. (#151, #230)
 * Hardened widget teardown for re-rendered views so replacing a widget no longer emits known cleanup noise like `Widget is not attached` or dead-comm sync errors. Added Playwright regression coverage for repeated rerenders across plotly, altair, bokeh, and ipyleaflet, and wired that suite into GitHub Actions on Python 3.12. (#223)
 * Fixed an issue where parent widget updates could arrive before newly introduced child widget models were opened client-side, causing one-interaction lag or dropped updates in cases like `ipyleaflet` marker insertion. (#225)
diff --git a/js/src/output.ts b/js/src/output.ts
index 8cf3cf1..52041c0 100644
--- a/js/src/output.ts
+++ b/js/src/output.ts
@@ -1,5 +1,6 @@
 import { HTMLManager, requireLoader } from '@jupyter-widgets/html-manager';
 import { ShinyComm } from './comm';
+import { findPlotlyGraphDiv, waitForPlotlyReadyToReveal } from './plotly';
 import { jsonParse } from './utils';
 import type { ErrorsMessageValue } from 'rstudio-shiny/srcts/types/src/shiny/shinyapp';
 
@@ -76,18 +77,23 @@ class IPyWidgetOutput extends Shiny.OutputBinding {
   }
   onValueError(el: HTMLElement, err: ErrorsMessageValue): void {
     Shiny.unbindAll(el);
+    el.style.visibility = "inherit";
     this.renderError(el, err);
   }
   async renderValue(el: HTMLElement, data): Promise<void> {
+    const hiddenVisibility = "hidden";
+    const revealVisibility = "inherit";
+    const renderToken = this._nextRenderToken(el);
 
     // Allow for a None/null value to hide the widget (css inspired by htmlwidgets)
     if (!data) {
-      el.style.visibility = "hidden";
+      el.style.visibility = hiddenVisibility;
       return;
-    } else {
-      el.style.visibility = "inherit";
     }
 
+    const isPlotlyWidget = data.widget_pkg === "plotly";
+    el.style.visibility = isPlotlyWidget ? hiddenVisibility : revealVisibility;
+
     // Only forward the potential to fill if `output_widget(fillable=True)`
     // _and_ the widget instance wants to fill
     const fill = data.fill && el.classList.contains("html-fill-container");
@@ -117,7 +123,42 @@ class IPyWidgetOutput extends Shiny.OutputBinding {
     if (fill) {
       this._onImplementation(lmWidget, () => this._doAddFillClasses(lmWidget));
     }
-    this._onImplementation(lmWidget, this._doResize);
+    if (!isPlotlyWidget) {
+      this._onImplementation(lmWidget, () => this._doResize());
+    } else {
+      this._onImplementation(lmWidget, () => {
+        if (!this._isCurrentRenderToken(el, renderToken)) {
+          return;
+        }
+
+        const plotEl = findPlotlyGraphDiv(lmWidget);
+        if (!plotEl) {
+          this._doResize();
+          if (this._isCurrentRenderToken(el, renderToken)) {
+            el.style.visibility = revealVisibility;
+          }
+          return;
+        }
+
+        // Plotly FigureWidget may first render at its internal 360px fallback,
+        // then resize after paint. Keep it hidden until a direct Plotly resize
+        // completes so the first visible paint is already settled.
+        void waitForPlotlyReadyToReveal(plotEl, () => this._doResize()).finally(() => {
+          if (this._isCurrentRenderToken(el, renderToken)) {
+            el.style.visibility = revealVisibility;
+          }
+        });
+      });
+    }
+  }
+  _nextRenderToken(el: HTMLElement): number {
+    const trackedEl = el as HTMLElement & { __shinywidgetsRenderToken?: number };
+    const nextToken = (trackedEl.__shinywidgetsRenderToken ?? 0) + 1;
+    trackedEl.__shinywidgetsRenderToken = nextToken;
+    return nextToken;
+  }
+  _isCurrentRenderToken(el: HTMLElement, token: number): boolean {
+    return (el as HTMLElement & { __shinywidgetsRenderToken?: number }).__shinywidgetsRenderToken === token;
   }
   _onImplementation(lmWidget: HTMLElement, callback: () => void): void {
     if (this._hasImplementation(lmWidget)) {
@@ -127,7 +168,7 @@ class IPyWidgetOutput extends Shiny.OutputBinding {
 
     // Some widget implementation (e.g., ipyleaflet, pydeck) won't actually
     // have rendered to the DOM at this point, so wait until they do
-    const mo = new MutationObserver((mutations) => {
+    const mo = new MutationObserver((_mutations) => {
       if (this._hasImplementation(lmWidget)) {
         mo.disconnect();
         callback();
diff --git a/js/src/plotly.ts b/js/src/plotly.ts
new file mode 100644
index 0000000..9f81060
--- /dev/null
+++ b/js/src/plotly.ts
@@ -0,0 +1,75 @@
+interface PlotlyEventEmitter {
+  on(eventName: string, callback: () => void): void;
+  once(eventName: string, callback: () => void): void;
+  removeListener(eventName: string, callback: () => void): void;
+}
+
+const plotlyAfterPlotTimeoutMs = 5000;
+
+export function findPlotlyGraphDiv(root: HTMLElement): HTMLElement | null {
+  const plotlyEl = root.matches(".js-plotly-plot")
+    ? root
+    : root.querySelector(".js-plotly-plot");
+  return plotlyEl instanceof HTMLElement ? plotlyEl : null;
+}
+
+export async function waitForPlotlyReadyToReveal(
+  plotEl: HTMLElement,
+  dispatchResize: () => void,
+): Promise<void> {
+  const plotly = (window as any).Plotly;
+  await waitForPlotlyAfterPlot(plotEl);
+
+  if (plotly?.Plots?.resize) {
+    try {
+      const afterResize = waitForPlotlyAfterPlot(plotEl);
+      await plotly.Plots.resize(plotEl);
+      await afterResize;
+    } catch (err) {
+      console.error("Error resizing Plotly widget before reveal:", err);
+    }
+  }
+
+  dispatchResize();
+}
+
+function waitForPlotlyAfterPlot(plotEl: HTMLElement): Promise<void> {
+  return new Promise((resolve) => {
+    const handler = () => {
+      cleanup();
+      resolve();
+    };
+
+    const cleanup = () => {
+      if (hasMethod<PlotlyEventEmitter, "removeListener">(plotEl, "removeListener")) {
+        plotEl.removeListener("plotly_afterplot", handler);
+      }
+      window.clearTimeout(timeoutId);
+    };
+
+    const timeoutId = window.setTimeout(() => {
+      cleanup();
+      resolve();
+    }, plotlyAfterPlotTimeoutMs);
+
+    if (hasMethod<PlotlyEventEmitter, "once">(plotEl, "once")) {
+      plotEl.once("plotly_afterplot", handler);
+      return;
+    }
+
+    if (hasMethod<PlotlyEventEmitter, "on">(plotEl, "on")) {
+      plotEl.on("plotly_afterplot", handler);
+      return;
+    }
+
+    cleanup();
+    resolve();
+  });
+}
+
+function hasMethod<T, K extends keyof T>(
+  x: unknown,
+  key: K,
+): x is T & Record<K, (...args: any[]) => unknown> {
+  return !!x && typeof (x as any)[key] === "function";
+}
diff --git a/shinywidgets/_render_widget_base.py b/shinywidgets/_render_widget_base.py
index cfdd075..26aed52 100644
--- a/shinywidgets/_render_widget_base.py
+++ b/shinywidgets/_render_widget_base.py
@@ -99,6 +99,7 @@ async def _render(self) -> Jsonifiable | None:
         return {
             "model_id": str(widget.model_id),
             "fill": fill,
+            "widget_pkg": widget_pkg(widget),
         }
 
     @property
diff --git a/shinywidgets/static/output.js b/shinywidgets/static/output.js
index 487a98e..02701e3 100644
--- a/shinywidgets/static/output.js
+++ b/shinywidgets/static/output.js
@@ -36,7 +36,17 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
   \***********************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _jupyter_widgets_html_manager__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @jupyter-widgets/html-manager */ \"@jupyter-widgets/html-manager\");\n/* harmony import */ var _jupyter_widgets_html_manager__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_jupyter_widgets_html_manager__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _comm__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./comm */ \"./src/comm.ts\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./utils */ \"./src/utils.ts\");\nvar _a;\n\n\n\n/******************************************************************************\n * Define a custom HTMLManager for use with Shiny\n ******************************************************************************/\nclass OutputManager extends _jupyter_widgets_html_manager__WEBPACK_IMPORTED_MODULE_0__.HTMLManager {\n    // In a soon-to-be-released version of @jupyter-widgets/html-manager,\n    // display_view()'s first \"dummy\" argument will be removed... this shim simply\n    // makes it so that our manager can work with either version\n    // https://github.com/jupyter-widgets/ipywidgets/commit/159bbe4#diff-45c126b24c3c43d2cee5313364805c025e911c4721d45ff8a68356a215bfb6c8R42-R43\n    async display_view(view, options) {\n        const n_args = super.display_view.length;\n        if (n_args === 3) {\n            return super.display_view({}, view, options);\n        }\n        else {\n            // @ts-ignore\n            return super.display_view(view, options);\n        }\n    }\n}\n// Define our own custom module loader for Shiny\nconst shinyRequireLoader = async function (moduleName, moduleVersion) {\n    // shiny provides a shim of require.js which allows <script>s with anonymous\n    // define()s to be loaded without error. When an anonymous define() occurs,\n    // the shim uses the data-requiremodule attribute (set by require.js) on the script\n    // to determine the module name.\n    // https://github.com/posit-dev/py-shiny/blob/230940c/scripts/define-shims.js#L10-L16\n    // In the context of shinywidgets, when a widget gets rendered, it should\n    // come with another <script> tag that does `require.config({paths: {...}})`\n    // which maps the module name to a URL of the widget's JS file.\n    const oldAmd = window.define.amd;\n    // This is probably not necessary, but just in case -- especially now in a\n    // anywidget/ES6 world, we probably don't want to load AMD modules\n    // (plotly is one example of a widget that will fail to load if AMD is enabled)\n    window.define.amd = false;\n    // Store jQuery global since loading we load a module, it may overwrite it\n    // (qgrid is one good example)\n    const old$ = window.$;\n    const oldJQ = window.jQuery;\n    if (moduleName === 'qgrid') {\n        // qgrid wants to use base/js/dialog (if it's available) for full-screen tables\n        // https://github.com/quantopian/qgrid/blob/877b420/js/src/qgrid.widget.js#L11-L16\n        // Maybe that's worth supporting someday, but for now, we define it to be nothing\n        // to avoid require('qgrid') from producing an error\n        window.define(\"base/js/dialog\", [], function () { return null; });\n    }\n    return (0,_jupyter_widgets_html_manager__WEBPACK_IMPORTED_MODULE_0__.requireLoader)(moduleName, moduleVersion).finally(() => {\n        window.define.amd = oldAmd;\n        window.$ = old$;\n        window.jQuery = oldJQ;\n    });\n};\nconst manager = new OutputManager({ loader: shinyRequireLoader });\n/******************************************************************************\n* Define the Shiny binding\n******************************************************************************/\n// Ideally we'd extend Shiny's HTMLOutputBinding, but the implementation isn't exported\nclass IPyWidgetOutput extends Shiny.OutputBinding {\n    find(scope) {\n        return $(scope).find(\".shiny-ipywidget-output\");\n    }\n    onValueError(el, err) {\n        Shiny.unbindAll(el);\n        this.renderError(el, err);\n    }\n    async renderValue(el, data) {\n        // Allow for a None/null value to hide the widget (css inspired by htmlwidgets)\n        if (!data) {\n            el.style.visibility = \"hidden\";\n            return;\n        }\n        else {\n            el.style.visibility = \"inherit\";\n        }\n        // Only forward the potential to fill if `output_widget(fillable=True)`\n        // _and_ the widget instance wants to fill\n        const fill = data.fill && el.classList.contains(\"html-fill-container\");\n        if (fill)\n            el.classList.add(\"forward-fill-potential\");\n        // At this time point, we should've already handled an 'open' message, and so\n        // the model should be ready to use\n        const model = await manager.get_model(data.model_id);\n        if (!model) {\n            throw new Error(`No model found for id ${data.model_id}`);\n        }\n        const view = await manager.create_view(model, {});\n        await manager.display_view(view, { el: el });\n        // Don't allow more than one .lmWidget container, which can happen\n        // when the view is displayed more than once\n        // N.B. It's probably better to get view(s) from m.views and .remove() them,\n        // but empirically, this seems to work better\n        while (el.childNodes.length > 1) {\n            el.removeChild(el.childNodes[0]);\n        }\n        // The ipywidgets container (.lmWidget)\n        const lmWidget = el.children[0];\n        if (fill) {\n            this._onImplementation(lmWidget, () => this._doAddFillClasses(lmWidget));\n        }\n        this._onImplementation(lmWidget, this._doResize);\n    }\n    _onImplementation(lmWidget, callback) {\n        if (this._hasImplementation(lmWidget)) {\n            callback();\n            return;\n        }\n        // Some widget implementation (e.g., ipyleaflet, pydeck) won't actually\n        // have rendered to the DOM at this point, so wait until they do\n        const mo = new MutationObserver((mutations) => {\n            if (this._hasImplementation(lmWidget)) {\n                mo.disconnect();\n                callback();\n            }\n        });\n        mo.observe(lmWidget, { childList: true });\n    }\n    // In most cases, we can get widgets to fill through Python/CSS, but some widgets\n    // (e.g., quak) don't have a Python API and use shadow DOM, which can only access\n    // from JS\n    _doAddFillClasses(lmWidget) {\n        var _a;\n        const impl = lmWidget.children[0];\n        const isQuakWidget = impl && !!((_a = impl.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(\".quak\"));\n        if (isQuakWidget) {\n            impl.classList.add(\"html-fill-container\", \"html-fill-item\");\n            const quakWidget = impl.shadowRoot.querySelector(\".quak\");\n            quakWidget.style.maxHeight = \"unset\";\n        }\n    }\n    _doResize() {\n        // Trigger resize event to force layout (setTimeout() is needed for altair)\n        // TODO: debounce this call?\n        setTimeout(() => {\n            window.dispatchEvent(new Event('resize'));\n        }, 0);\n    }\n    _hasImplementation(lmWidget) {\n        var _a;\n        const impl = lmWidget.children[0];\n        return impl && (impl.children.length > 0 || ((_a = impl.shadowRoot) === null || _a === void 0 ? void 0 : _a.children.length) > 0);\n    }\n}\nShiny.outputBindings.register(new IPyWidgetOutput(), \"shiny.IPyWidgetOutput\");\n// Due to the way HTMLManager (and widget implementations) get loaded (via\n// require.js), the binding registration above can happen _after_ Shiny has\n// already bound the DOM, especially in the dynamic UI case (i.e., output_binding()'s\n// dependencies don't come in until after initial page load). And, in the dynamic UI\n// case, UI is rendered asychronously via Shiny.shinyapp.taskQueue, so if it exists,\n// we probably need to re-bind the DOM after the taskQueue is done.\nconst taskQueue = (_a = Shiny === null || Shiny === void 0 ? void 0 : Shiny.shinyapp) === null || _a === void 0 ? void 0 : _a.taskQueue;\nif (taskQueue) {\n    taskQueue.enqueue(() => Shiny.bindAll(document.body));\n}\n/******************************************************************************\n* Handle messages from the server-side Widget\n******************************************************************************/\n// Initialize the comm and model when a new widget is created\n// This is basically our version of https://github.com/jupyterlab/jupyterlab/blob/d33de15/packages/services/src/kernel/default.ts#L1144-L1176\nShiny.addCustomMessageHandler(\"shinywidgets_comm_open\", (msg_txt) => {\n    setBaseURL();\n    const msg = (0,_utils__WEBPACK_IMPORTED_MODULE_2__.jsonParse)(msg_txt);\n    Shiny.renderDependencies(msg.content.html_deps);\n    const comm = new _comm__WEBPACK_IMPORTED_MODULE_1__.ShinyComm(msg.content.comm_id);\n    manager.handle_comm_open(comm, msg);\n});\n// Handle any mutation of the model (e.g., add a marker to a map, without a full redraw)\n// Basically out version of https://github.com/jupyterlab/jupyterlab/blob/d33de15/packages/services/src/kernel/default.ts#L1200-L1215\nShiny.addCustomMessageHandler(\"shinywidgets_comm_msg\", async (msg_txt) => {\n    const msg = (0,_utils__WEBPACK_IMPORTED_MODULE_2__.jsonParse)(msg_txt);\n    const id = msg.content.comm_id;\n    const model = manager.get_model(id);\n    if (!model) {\n        console.error(`Couldn't handle message for model ${id} because it doesn't exist.`);\n        return;\n    }\n    try {\n        const m = await model;\n        // @ts-ignore for some reason IClassicComm doesn't have this method, but we do\n        m.comm.handle_msg(msg);\n    }\n    catch (err) {\n        console.error(\"Error handling message:\", err);\n    }\n});\n// Handle the closing of a widget/comm/model\nShiny.addCustomMessageHandler(\"shinywidgets_comm_close\", async (msg_txt) => {\n    const msg = (0,_utils__WEBPACK_IMPORTED_MODULE_2__.jsonParse)(msg_txt);\n    const id = msg.content.comm_id;\n    const model = manager.get_model(id);\n    if (!model) {\n        console.error(`Couldn't close model ${id} because it doesn't exist.`);\n        return;\n    }\n    try {\n        const m = await model;\n        // Some widget views need explicit teardown before model.close() removes them.\n        if (m.views) {\n            await Promise.all(Object.values(m.views).map(async (viewPromise) => {\n                try {\n                    const v = await viewPromise;\n                    // Plotly-backed views can leave DOM state and listeners behind unless\n                    // destroy() runs before the view is removed.\n                    if (hasMethod(v, 'destroy')) {\n                        v.destroy();\n                        // Clearing the back-reference prevents later teardown from touching a\n                        // model that is already being closed.\n                        delete v.model;\n                        v.remove();\n                    }\n                }\n                catch (err) {\n                    console.error(\"Error cleaning up view:\", err);\n                }\n            }));\n        }\n        // View removal updates _view_count. Mark the comm as inactive first so that\n        // save_changes() does not try to send those updates after the comm is gone.\n        m.comm_live = false;\n        // Close model after all views are cleaned up.\n        try {\n            await m.close();\n        }\n        catch (closeErr) {\n            if (!isIgnorableTeardownError(closeErr)) {\n                console.error(\"Unexpected error while closing model:\", closeErr);\n            }\n        }\n        // HTMLManager releases the model from its registry on comm:close.\n        try {\n            m.trigger(\"comm:close\");\n        }\n        catch (triggerErr) {\n            if (!isIgnorableTeardownError(triggerErr)) {\n                console.error(\"Unexpected error while triggering comm:close:\", triggerErr);\n            }\n        }\n    }\n    catch (err) {\n        console.error(\"Error during model cleanup:\", err);\n    }\n});\n$(document).on(\"shiny:disconnected\", () => {\n    manager.clear_state();\n});\n// When in filling layout, some widgets (specifically, altair) incorrectly think their\n// height is 0 after it's shown, hidden, then shown again. As a workaround, trigger a\n// resize event when a tab is shown.\n// TODO: This covers the 95% use case, but it's definitely not an ideal way to handle\n// this situation. A more robust solution would use IntersectionObserver to detect when\n// the widget becomes visible. Or better yet, we'd get altair to handle this situation\n// better.\n// https://github.com/posit-dev/py-shinywidgets/issues/172\ndocument.addEventListener('shown.bs.tab', event => {\n    window.dispatchEvent(new Event('resize'));\n});\n// Our version of https://github.com/jupyter-widgets/widget-cookiecutter/blob/9694718/%7B%7Bcookiecutter.github_project_name%7D%7D/js/lib/extension.js#L8\nfunction setBaseURL(x = '') {\n    const base_url = document.querySelector('body').getAttribute('data-base-url');\n    if (!base_url) {\n        document.querySelector('body').setAttribute('data-base-url', x);\n    }\n}\n// TypeGuard to safely check if an object has a method\nfunction hasMethod(obj, methodName) {\n    return typeof obj[methodName] === 'function';\n}\nfunction isIgnorableTeardownError(err) {\n    const msg = errorMessage(err).toLowerCase();\n    return (msg.includes(\"widget is not attached\") ||\n        msg.includes(\"no comm channel defined\"));\n}\nfunction errorMessage(err) {\n    if (err instanceof Error) {\n        return err.message;\n    }\n    return String(err);\n}\n\n\n//# sourceURL=webpack://@jupyter-widgets/shiny-embed-manager/./src/output.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _jupyter_widgets_html_manager__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @jupyter-widgets/html-manager */ \"@jupyter-widgets/html-manager\");\n/* harmony import */ var _jupyter_widgets_html_manager__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_jupyter_widgets_html_manager__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _comm__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./comm */ \"./src/comm.ts\");\n/* harmony import */ var _plotly__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./plotly */ \"./src/plotly.ts\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./utils */ \"./src/utils.ts\");\nvar _a;\n\n\n\n\n/******************************************************************************\n * Define a custom HTMLManager for use with Shiny\n ******************************************************************************/\nclass OutputManager extends _jupyter_widgets_html_manager__WEBPACK_IMPORTED_MODULE_0__.HTMLManager {\n    // In a soon-to-be-released version of @jupyter-widgets/html-manager,\n    // display_view()'s first \"dummy\" argument will be removed... this shim simply\n    // makes it so that our manager can work with either version\n    // https://github.com/jupyter-widgets/ipywidgets/commit/159bbe4#diff-45c126b24c3c43d2cee5313364805c025e911c4721d45ff8a68356a215bfb6c8R42-R43\n    async display_view(view, options) {\n        const n_args = super.display_view.length;\n        if (n_args === 3) {\n            return super.display_view({}, view, options);\n        }\n        else {\n            // @ts-ignore\n            return super.display_view(view, options);\n        }\n    }\n}\n// Define our own custom module loader for Shiny\nconst shinyRequireLoader = async function (moduleName, moduleVersion) {\n    // shiny provides a shim of require.js which allows <script>s with anonymous\n    // define()s to be loaded without error. When an anonymous define() occurs,\n    // the shim uses the data-requiremodule attribute (set by require.js) on the script\n    // to determine the module name.\n    // https://github.com/posit-dev/py-shiny/blob/230940c/scripts/define-shims.js#L10-L16\n    // In the context of shinywidgets, when a widget gets rendered, it should\n    // come with another <script> tag that does `require.config({paths: {...}})`\n    // which maps the module name to a URL of the widget's JS file.\n    const oldAmd = window.define.amd;\n    // This is probably not necessary, but just in case -- especially now in a\n    // anywidget/ES6 world, we probably don't want to load AMD modules\n    // (plotly is one example of a widget that will fail to load if AMD is enabled)\n    window.define.amd = false;\n    // Store jQuery global since loading we load a module, it may overwrite it\n    // (qgrid is one good example)\n    const old$ = window.$;\n    const oldJQ = window.jQuery;\n    if (moduleName === 'qgrid') {\n        // qgrid wants to use base/js/dialog (if it's available) for full-screen tables\n        // https://github.com/quantopian/qgrid/blob/877b420/js/src/qgrid.widget.js#L11-L16\n        // Maybe that's worth supporting someday, but for now, we define it to be nothing\n        // to avoid require('qgrid') from producing an error\n        window.define(\"base/js/dialog\", [], function () { return null; });\n    }\n    return (0,_jupyter_widgets_html_manager__WEBPACK_IMPORTED_MODULE_0__.requireLoader)(moduleName, moduleVersion).finally(() => {\n        window.define.amd = oldAmd;\n        window.$ = old$;\n        window.jQuery = oldJQ;\n    });\n};\nconst manager = new OutputManager({ loader: shinyRequireLoader });\n/******************************************************************************\n* Define the Shiny binding\n******************************************************************************/\n// Ideally we'd extend Shiny's HTMLOutputBinding, but the implementation isn't exported\nclass IPyWidgetOutput extends Shiny.OutputBinding {\n    find(scope) {\n        return $(scope).find(\".shiny-ipywidget-output\");\n    }\n    onValueError(el, err) {\n        Shiny.unbindAll(el);\n        el.style.visibility = \"inherit\";\n        this.renderError(el, err);\n    }\n    async renderValue(el, data) {\n        const hiddenVisibility = \"hidden\";\n        const revealVisibility = \"inherit\";\n        const renderToken = this._nextRenderToken(el);\n        // Allow for a None/null value to hide the widget (css inspired by htmlwidgets)\n        if (!data) {\n            el.style.visibility = hiddenVisibility;\n            return;\n        }\n        const isPlotlyWidget = data.widget_pkg === \"plotly\";\n        el.style.visibility = isPlotlyWidget ? hiddenVisibility : revealVisibility;\n        // Only forward the potential to fill if `output_widget(fillable=True)`\n        // _and_ the widget instance wants to fill\n        const fill = data.fill && el.classList.contains(\"html-fill-container\");\n        if (fill)\n            el.classList.add(\"forward-fill-potential\");\n        // At this time point, we should've already handled an 'open' message, and so\n        // the model should be ready to use\n        const model = await manager.get_model(data.model_id);\n        if (!model) {\n            throw new Error(`No model found for id ${data.model_id}`);\n        }\n        const view = await manager.create_view(model, {});\n        await manager.display_view(view, { el: el });\n        // Don't allow more than one .lmWidget container, which can happen\n        // when the view is displayed more than once\n        // N.B. It's probably better to get view(s) from m.views and .remove() them,\n        // but empirically, this seems to work better\n        while (el.childNodes.length > 1) {\n            el.removeChild(el.childNodes[0]);\n        }\n        // The ipywidgets container (.lmWidget)\n        const lmWidget = el.children[0];\n        if (fill) {\n            this._onImplementation(lmWidget, () => this._doAddFillClasses(lmWidget));\n        }\n        if (!isPlotlyWidget) {\n            this._onImplementation(lmWidget, () => this._doResize());\n        }\n        else {\n            this._onImplementation(lmWidget, () => {\n                if (!this._isCurrentRenderToken(el, renderToken)) {\n                    return;\n                }\n                const plotEl = (0,_plotly__WEBPACK_IMPORTED_MODULE_2__.findPlotlyGraphDiv)(lmWidget);\n                if (!plotEl) {\n                    this._doResize();\n                    if (this._isCurrentRenderToken(el, renderToken)) {\n                        el.style.visibility = revealVisibility;\n                    }\n                    return;\n                }\n                // Plotly FigureWidget may first render at its internal 360px fallback,\n                // then resize after paint. Keep it hidden until a direct Plotly resize\n                // completes so the first visible paint is already settled.\n                void (0,_plotly__WEBPACK_IMPORTED_MODULE_2__.waitForPlotlyReadyToReveal)(plotEl, () => this._doResize()).finally(() => {\n                    if (this._isCurrentRenderToken(el, renderToken)) {\n                        el.style.visibility = revealVisibility;\n                    }\n                });\n            });\n        }\n    }\n    _nextRenderToken(el) {\n        var _a;\n        const trackedEl = el;\n        const nextToken = ((_a = trackedEl.__shinywidgetsRenderToken) !== null && _a !== void 0 ? _a : 0) + 1;\n        trackedEl.__shinywidgetsRenderToken = nextToken;\n        return nextToken;\n    }\n    _isCurrentRenderToken(el, token) {\n        return el.__shinywidgetsRenderToken === token;\n    }\n    _onImplementation(lmWidget, callback) {\n        if (this._hasImplementation(lmWidget)) {\n            callback();\n            return;\n        }\n        // Some widget implementation (e.g., ipyleaflet, pydeck) won't actually\n        // have rendered to the DOM at this point, so wait until they do\n        const mo = new MutationObserver((_mutations) => {\n            if (this._hasImplementation(lmWidget)) {\n                mo.disconnect();\n                callback();\n            }\n        });\n        mo.observe(lmWidget, { childList: true });\n    }\n    // In most cases, we can get widgets to fill through Python/CSS, but some widgets\n    // (e.g., quak) don't have a Python API and use shadow DOM, which can only access\n    // from JS\n    _doAddFillClasses(lmWidget) {\n        var _a;\n        const impl = lmWidget.children[0];\n        const isQuakWidget = impl && !!((_a = impl.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(\".quak\"));\n        if (isQuakWidget) {\n            impl.classList.add(\"html-fill-container\", \"html-fill-item\");\n            const quakWidget = impl.shadowRoot.querySelector(\".quak\");\n            quakWidget.style.maxHeight = \"unset\";\n        }\n    }\n    _doResize() {\n        // Trigger resize event to force layout (setTimeout() is needed for altair)\n        // TODO: debounce this call?\n        setTimeout(() => {\n            window.dispatchEvent(new Event('resize'));\n        }, 0);\n    }\n    _hasImplementation(lmWidget) {\n        var _a;\n        const impl = lmWidget.children[0];\n        return impl && (impl.children.length > 0 || ((_a = impl.shadowRoot) === null || _a === void 0 ? void 0 : _a.children.length) > 0);\n    }\n}\nShiny.outputBindings.register(new IPyWidgetOutput(), \"shiny.IPyWidgetOutput\");\n// Due to the way HTMLManager (and widget implementations) get loaded (via\n// require.js), the binding registration above can happen _after_ Shiny has\n// already bound the DOM, especially in the dynamic UI case (i.e., output_binding()'s\n// dependencies don't come in until after initial page load). And, in the dynamic UI\n// case, UI is rendered asychronously via Shiny.shinyapp.taskQueue, so if it exists,\n// we probably need to re-bind the DOM after the taskQueue is done.\nconst taskQueue = (_a = Shiny === null || Shiny === void 0 ? void 0 : Shiny.shinyapp) === null || _a === void 0 ? void 0 : _a.taskQueue;\nif (taskQueue) {\n    taskQueue.enqueue(() => Shiny.bindAll(document.body));\n}\n/******************************************************************************\n* Handle messages from the server-side Widget\n******************************************************************************/\n// Initialize the comm and model when a new widget is created\n// This is basically our version of https://github.com/jupyterlab/jupyterlab/blob/d33de15/packages/services/src/kernel/default.ts#L1144-L1176\nShiny.addCustomMessageHandler(\"shinywidgets_comm_open\", (msg_txt) => {\n    setBaseURL();\n    const msg = (0,_utils__WEBPACK_IMPORTED_MODULE_3__.jsonParse)(msg_txt);\n    Shiny.renderDependencies(msg.content.html_deps);\n    const comm = new _comm__WEBPACK_IMPORTED_MODULE_1__.ShinyComm(msg.content.comm_id);\n    manager.handle_comm_open(comm, msg);\n});\n// Handle any mutation of the model (e.g., add a marker to a map, without a full redraw)\n// Basically out version of https://github.com/jupyterlab/jupyterlab/blob/d33de15/packages/services/src/kernel/default.ts#L1200-L1215\nShiny.addCustomMessageHandler(\"shinywidgets_comm_msg\", async (msg_txt) => {\n    const msg = (0,_utils__WEBPACK_IMPORTED_MODULE_3__.jsonParse)(msg_txt);\n    const id = msg.content.comm_id;\n    const model = manager.get_model(id);\n    if (!model) {\n        console.error(`Couldn't handle message for model ${id} because it doesn't exist.`);\n        return;\n    }\n    try {\n        const m = await model;\n        // @ts-ignore for some reason IClassicComm doesn't have this method, but we do\n        m.comm.handle_msg(msg);\n    }\n    catch (err) {\n        console.error(\"Error handling message:\", err);\n    }\n});\n// Handle the closing of a widget/comm/model\nShiny.addCustomMessageHandler(\"shinywidgets_comm_close\", async (msg_txt) => {\n    const msg = (0,_utils__WEBPACK_IMPORTED_MODULE_3__.jsonParse)(msg_txt);\n    const id = msg.content.comm_id;\n    const model = manager.get_model(id);\n    if (!model) {\n        console.error(`Couldn't close model ${id} because it doesn't exist.`);\n        return;\n    }\n    try {\n        const m = await model;\n        // Some widget views need explicit teardown before model.close() removes them.\n        if (m.views) {\n            await Promise.all(Object.values(m.views).map(async (viewPromise) => {\n                try {\n                    const v = await viewPromise;\n                    // Plotly-backed views can leave DOM state and listeners behind unless\n                    // destroy() runs before the view is removed.\n                    if (hasMethod(v, 'destroy')) {\n                        v.destroy();\n                        // Clearing the back-reference prevents later teardown from touching a\n                        // model that is already being closed.\n                        delete v.model;\n                        v.remove();\n                    }\n                }\n                catch (err) {\n                    console.error(\"Error cleaning up view:\", err);\n                }\n            }));\n        }\n        // View removal updates _view_count. Mark the comm as inactive first so that\n        // save_changes() does not try to send those updates after the comm is gone.\n        m.comm_live = false;\n        // Close model after all views are cleaned up.\n        try {\n            await m.close();\n        }\n        catch (closeErr) {\n            if (!isIgnorableTeardownError(closeErr)) {\n                console.error(\"Unexpected error while closing model:\", closeErr);\n            }\n        }\n        // HTMLManager releases the model from its registry on comm:close.\n        try {\n            m.trigger(\"comm:close\");\n        }\n        catch (triggerErr) {\n            if (!isIgnorableTeardownError(triggerErr)) {\n                console.error(\"Unexpected error while triggering comm:close:\", triggerErr);\n            }\n        }\n    }\n    catch (err) {\n        console.error(\"Error during model cleanup:\", err);\n    }\n});\n$(document).on(\"shiny:disconnected\", () => {\n    manager.clear_state();\n});\n// When in filling layout, some widgets (specifically, altair) incorrectly think their\n// height is 0 after it's shown, hidden, then shown again. As a workaround, trigger a\n// resize event when a tab is shown.\n// TODO: This covers the 95% use case, but it's definitely not an ideal way to handle\n// this situation. A more robust solution would use IntersectionObserver to detect when\n// the widget becomes visible. Or better yet, we'd get altair to handle this situation\n// better.\n// https://github.com/posit-dev/py-shinywidgets/issues/172\ndocument.addEventListener('shown.bs.tab', event => {\n    window.dispatchEvent(new Event('resize'));\n});\n// Our version of https://github.com/jupyter-widgets/widget-cookiecutter/blob/9694718/%7B%7Bcookiecutter.github_project_name%7D%7D/js/lib/extension.js#L8\nfunction setBaseURL(x = '') {\n    const base_url = document.querySelector('body').getAttribute('data-base-url');\n    if (!base_url) {\n        document.querySelector('body').setAttribute('data-base-url', x);\n    }\n}\n// TypeGuard to safely check if an object has a method\nfunction hasMethod(obj, methodName) {\n    return typeof obj[methodName] === 'function';\n}\nfunction isIgnorableTeardownError(err) {\n    const msg = errorMessage(err).toLowerCase();\n    return (msg.includes(\"widget is not attached\") ||\n        msg.includes(\"no comm channel defined\"));\n}\nfunction errorMessage(err) {\n    if (err instanceof Error) {\n        return err.message;\n    }\n    return String(err);\n}\n\n\n//# sourceURL=webpack://@jupyter-widgets/shiny-embed-manager/./src/output.ts?");
+
+/***/ }),
+
+/***/ "./src/plotly.ts":
+/*!***********************!*\
+  !*** ./src/plotly.ts ***!
+  \***********************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"findPlotlyGraphDiv\": () => (/* binding */ findPlotlyGraphDiv),\n/* harmony export */   \"waitForPlotlyReadyToReveal\": () => (/* binding */ waitForPlotlyReadyToReveal)\n/* harmony export */ });\nconst plotlyAfterPlotTimeoutMs = 5000;\nfunction findPlotlyGraphDiv(root) {\n    const plotlyEl = root.matches(\".js-plotly-plot\")\n        ? root\n        : root.querySelector(\".js-plotly-plot\");\n    return plotlyEl instanceof HTMLElement ? plotlyEl : null;\n}\nasync function waitForPlotlyReadyToReveal(plotEl, dispatchResize) {\n    var _a;\n    const plotly = window.Plotly;\n    await waitForPlotlyAfterPlot(plotEl);\n    if ((_a = plotly === null || plotly === void 0 ? void 0 : plotly.Plots) === null || _a === void 0 ? void 0 : _a.resize) {\n        try {\n            const afterResize = waitForPlotlyAfterPlot(plotEl);\n            await plotly.Plots.resize(plotEl);\n            await afterResize;\n        }\n        catch (err) {\n            console.error(\"Error resizing Plotly widget before reveal:\", err);\n        }\n    }\n    dispatchResize();\n}\nfunction waitForPlotlyAfterPlot(plotEl) {\n    return new Promise((resolve) => {\n        const handler = () => {\n            cleanup();\n            resolve();\n        };\n        const cleanup = () => {\n            if (hasMethod(plotEl, \"removeListener\")) {\n                plotEl.removeListener(\"plotly_afterplot\", handler);\n            }\n            window.clearTimeout(timeoutId);\n        };\n        const timeoutId = window.setTimeout(() => {\n            cleanup();\n            resolve();\n        }, plotlyAfterPlotTimeoutMs);\n        if (hasMethod(plotEl, \"once\")) {\n            plotEl.once(\"plotly_afterplot\", handler);\n            return;\n        }\n        if (hasMethod(plotEl, \"on\")) {\n            plotEl.on(\"plotly_afterplot\", handler);\n            return;\n        }\n        cleanup();\n        resolve();\n    });\n}\nfunction hasMethod(x, key) {\n    return !!x && typeof x[key] === \"function\";\n}\n\n\n//# sourceURL=webpack://@jupyter-widgets/shiny-embed-manager/./src/plotly.ts?");
 
 /***/ }),
 
diff --git a/tests/playwright/example_plotly_afterplot_stable/app.py b/tests/playwright/example_plotly_afterplot_stable/app.py
new file mode 100644
index 0000000..3e5043b
--- /dev/null
+++ b/tests/playwright/example_plotly_afterplot_stable/app.py
@@ -0,0 +1,32 @@
+from __future__ import annotations
+
+import plotly.graph_objects as go
+from shiny import App, ui
+from shinywidgets import output_widget, render_widget
+
+app_ui = ui.page_fillable(
+    ui.card(
+        ui.card_header("Plotly reveal probe"),
+        output_widget("scatterplot"),
+        full_screen=True,
+    )
+)
+
+
+def server(input, output, session):
+    @render_widget
+    def scatterplot():
+        return go.FigureWidget(
+            data=[
+                go.Scattergl(
+                    x=[1, 2, 3, 4, 5, 6],
+                    y=[5.1, 4.9, 4.7, 4.6, 6.4, 6.9],
+                    mode="markers",
+                    marker={"size": 12},
+                )
+            ],
+            layout={"showlegend": False},
+        )
+
+
+app = App(app_ui, server)
diff --git a/tests/playwright/example_plotly_afterplot_stable/test_example_plotly_afterplot_stable.py b/tests/playwright/example_plotly_afterplot_stable/test_example_plotly_afterplot_stable.py
new file mode 100644
index 0000000..4104405
--- /dev/null
+++ b/tests/playwright/example_plotly_afterplot_stable/test_example_plotly_afterplot_stable.py
@@ -0,0 +1,49 @@
+from __future__ import annotations
+
+from playwright.sync_api import Page
+
+
+def test_example_plotly_first_visible_afterplot_is_already_resized(
+    page: Page, local_app
+) -> None:
+    page.add_init_script(
+        """
+        (() => {
+          window.__plotlyAfterplotProbe = { firstVisibleAfterplot: null };
+          document.addEventListener("plotlywidget-after-render", (evt) => {
+            const gd = evt.detail?.element;
+            if (!gd?.on) return;
+
+            gd.on("plotly_afterplot", () => {
+              if (window.__plotlyAfterplotProbe.firstVisibleAfterplot) return;
+              const out = document.querySelector("#scatterplot");
+              if (!out) return;
+              const visibility = getComputedStyle(out).visibility;
+              const layoutHeight = gd?._fullLayout?.height ?? null;
+              const outHeight = out.getBoundingClientRect().height;
+              if (visibility === "hidden" || layoutHeight === null) return;
+
+              window.__plotlyAfterplotProbe.firstVisibleAfterplot = {
+                visibility,
+                outHeight,
+                layoutHeight,
+                diff: Math.abs(outHeight - layoutHeight),
+              };
+            });
+          });
+        })();
+        """
+    )
+
+    page.goto(local_app.url)
+    page.wait_for_function(
+        "() => window.__plotlyAfterplotProbe.firstVisibleAfterplot !== null",
+        timeout=30000,
+    )
+
+    first_visible_afterplot = page.evaluate(
+        "() => window.__plotlyAfterplotProbe.firstVisibleAfterplot"
+    )
+
+    assert first_visible_afterplot["visibility"] != "hidden"
+    assert first_visible_afterplot["diff"] <= 2, first_visible_afterplot
diff --git a/tests/playwright/plotly_rerender_cleanup/test_plotly_rerender_cleanup.py b/tests/playwright/plotly_rerender_cleanup/test_plotly_rerender_cleanup.py
index 1f92bd7..00ff801 100644
--- a/tests/playwright/plotly_rerender_cleanup/test_plotly_rerender_cleanup.py
+++ b/tests/playwright/plotly_rerender_cleanup/test_plotly_rerender_cleanup.py
@@ -1,8 +1,71 @@
 from __future__ import annotations
 
-from playwright.sync_api import Page
+from playwright.sync_api import Page, expect
 from tests.playwright.conftest import assert_rerender_cleanup
 
 
 def test_plotly_rerender_does_not_log_cleanup_errors(page: Page, local_app) -> None:
     assert_rerender_cleanup(page, local_app, "#plot .js-plotly-plot")
+
+
+def test_plotly_resize_failure_does_not_leave_output_hidden(
+    page: Page, local_app
+) -> None:
+    page.add_init_script(
+        """
+        (() => {
+          const patchResize = () => {
+            const plots = window.Plotly?.Plots;
+            const resize = plots?.resize;
+            if (!plots || !resize || plots.__pyShinywidgetsPatchedResize) {
+              return false;
+            }
+
+            const originalResize = resize.bind(plots);
+            plots.__pyShinywidgetsPatchedResize = true;
+            plots.resize = (...args) => {
+              if (window.__pyShinywidgetsInjectResizeFailure) {
+                window.__pyShinywidgetsInjectResizeFailure = false;
+                throw new Error("Injected Plotly resize failure");
+              }
+              return originalResize(...args);
+            };
+            return true;
+          };
+
+          if (patchResize()) {
+            return;
+          }
+
+          const intervalId = window.setInterval(() => {
+            if (patchResize()) {
+              window.clearInterval(intervalId);
+            }
+          }, 0);
+        })();
+        """
+    )
+
+    page.goto(local_app.url)
+    expect(page.locator("#plot .js-plotly-plot")).to_have_count(1, timeout=30000)
+    page.wait_for_function(
+        """
+        () => {
+          const out = document.querySelector("#plot");
+          return out && getComputedStyle(out).visibility !== "hidden";
+        }
+        """,
+        timeout=30000,
+    )
+    page.evaluate("() => { window.__pyShinywidgetsInjectResizeFailure = true; }")
+    page.click("#rerender")
+    expect(page.locator("#render_count")).to_have_text("1", timeout=30000)
+    page.wait_for_function(
+        """
+        () => {
+          const out = document.querySelector("#plot");
+          return out && getComputedStyle(out).visibility !== "hidden";
+        }
+        """,
+        timeout=30000,
+    )
diff --git a/tests/unit/test_render_widget_base_lifecycle.py b/tests/unit/test_render_widget_base_lifecycle.py
index 88c96dc..6a0b783 100644
--- a/tests/unit/test_render_widget_base_lifecycle.py
+++ b/tests/unit/test_render_widget_base_lifecycle.py
@@ -120,6 +120,30 @@ async def _():  # noqa: ANN202
     assert asyncio.run(r._render()) is None
 
 
+def test_render_includes_widget_package_for_domwidgets(monkeypatch) -> None:
+    class FakeDOMWidget:
+        def __init__(self) -> None:
+            self.model_id = "widget-1"
+
+    widget = FakeDOMWidget()
+    r = rwb.render_widget_base()
+
+    @r
+    async def _():  # noqa: ANN202
+        return widget
+
+    monkeypatch.setattr(rwb, "DOMWidget", FakeDOMWidget)
+    monkeypatch.setattr(rwb, "as_widget", lambda value: widget)
+    monkeypatch.setattr(rwb, "set_layout_defaults", lambda w: (w, True))
+    monkeypatch.setattr(rwb, "widget_pkg", lambda w: "plotly")
+
+    assert asyncio.run(r._render()) == {
+        "model_id": "widget-1",
+        "fill": True,
+        "widget_pkg": "plotly",
+    }
+
+
 def test_widget_render_context_restores_session_vars(monkeypatch) -> None:
     session = FakeSession()
     ctx = FakeContext()