correctly destroy vue entry components in widgetloader (#19216)

1 files changed, 5 insertions, 4 deletions

diff --git a/plugins/CoreHome/vue/src/WidgetLoader/WidgetLoader.vue b/plugins/CoreHome/vue/src/WidgetLoader/WidgetLoader.vue
index 2d1eeea6a7..7b42c8ab1c 100644
--- a/plugins/CoreHome/vue/src/WidgetLoader/WidgetLoader.vue
+++ b/plugins/CoreHome/vue/src/WidgetLoader/WidgetLoader.vue
@@ -105,7 +105,7 @@ export default defineComponent({
       this.loadWidgetUrl(this.widgetParams as QueryParameters, this.changeCounter += 1);
     }
   },
-  unmounted() {
+  beforeUnmount() {
     this.cleanupLastWidgetContent();
   },
   methods: {
@@ -117,12 +117,13 @@ export default defineComponent({
     },
     cleanupLastWidgetContent() {
       const widgetContent = this.$refs.widgetContent as HTMLElement;
-      if (widgetContent) {
-        widgetContent.innerHTML = '';
-      }
+      Matomo.helper.destroyVueComponent(widgetContent);
       if (this.currentScope) {
         this.currentScope.$destroy();
       }
+      if (widgetContent) {
+        widgetContent.innerHTML = '';
+      }
     },
     getWidgetUrl(parameters?: QueryParameters): QueryParameters {
       const urlParams = MatomoUrl.parsed.value;