fix renderContent in AposWidget composable to keep the existing behavior

Author: ValJed

modules/@apostrophecms/widget-type/ui/apos/composables/AposWidget.js

@@ -21,10 +21,15 @@ export function useAposWidget(props) {
   };
 
   async function renderContent() {
-    rendered.value = await _renderContent(props);
-    nextTick(() => {
-      _emitWidgetRendered({ aposLivePreview: props.aposLivePreview });
-    });
+    const result = await _renderContent(props);
+    if (Object.hasOwn(result, 'data')) {
+      rendered.value = result.data;
+    }
+    if (!result.error) {
+      nextTick(() => {
+        _emitWidgetRendered(props.modelValue.aposLivePreview);
+      });
+    }
   }
 };
 
@@ -56,31 +61,37 @@ export async function _renderContent(props) {
   };
   try {
     if (props.rendering && (isEqual(props.rendering.parameters, parameters))) {
-      return props.rendering.html;
+      return { data: props.rendering.html };
     }
     // Don't use a placeholder here, it causes flickering in live preview
     // mode. It is better to display the old until we display the new, we
     // have "busy" for clarity
-    const result = await apos.http.post(`${apos.area.action}/render-widget?aposEdit=1&aposMode=${props.mode}`, {
-      busy: !aposLivePreview,
-      body: {
-        ...parameters,
-        livePreview: aposLivePreview
-      }
-    });
+    const result = await apos.http.post(
+      `${apos.area.action}/render-widget?aposEdit=1&aposMode=${props.mode}`,
+      {
+        busy: !aposLivePreview,
+        body: {
+          ...parameters,
+          livePreview: aposLivePreview
+        }
+      });
     if (result !== 'aposLivePreviewSchemaNotYetValid') {
-      return result;
+      return { data: result };
     }
+    return {};
   } catch (e) {
     // eslint-disable-next-line no-console
     console.error('Unable to render widget. Possibly the schema has been changed and the existing widget does not pass validation.', e);
-    return '<p>Unable to render this widget.</p>';
+    return {
+      data: '<p>Unable to render this widget.</p>',
+      error: true
+    };
   }
 }
 
 // Wait for reactivity to render v-html so that markup is
 // in the DOM before hinting that it might be time to prepare
 // sub-area editors and run players (done in mixin and composable)
-export function _emitWidgetRendered({ aposLivePreview }) {
+export function _emitWidgetRendered(aposLivePreview) {
   apos.bus.$emit('widget-rendered', { edit: !aposLivePreview });
 }

modules/@apostrophecms/widget-type/ui/apos/mixins/AposWidgetMixin.js

@@ -30,10 +30,15 @@ export default {
       return _getClasses(this.modelValue, this.moduleOptions);
     },
     async renderContent() {
-      this.rendered = await _renderContent(this.$props);
-      this.$nextTick(() => {
-        _emitWidgetRendered(this.$props);
-      });
+      const result = await _renderContent(props);
+      if (Object.hasOwn(result, 'data')) {
+        this.rendered = result.data;
+      }
+      if (!result.error) {
+        this.$nextTick(() => {
+          _emitWidgetRendered(this.modelValue.aposLivePreview);
+        });
+      }
     }
   }
 };