Fixed #5957 - [Core]: PrimeVue 4 is causing a memory leak

packages/core/src/config/PrimeVue.js

@@ -172,11 +172,21 @@ export function setup(app, options) {
     app.config.globalProperties.$primevue = PrimeVue;
     app.provide(PrimeVueSymbol, PrimeVue);
 
+    clearConfig();
     setupConfig(app, PrimeVue);
 
     return PrimeVue;
 }
 
+let stopWatchers = [];
+
+export function clearConfig() {
+    ThemeService.clear();
+
+    stopWatchers.forEach((fn) => fn?.());
+    stopWatchers = [];
+}
+
 export function setupConfig(app, PrimeVue) {
     const isThemeChanged = ref(false);
 
@@ -196,12 +206,14 @@ export function setupConfig(app, PrimeVue) {
     };
 
     ThemeService.on('theme:change', function (newTheme) {
-        isThemeChanged.value = true;
+        if (!isThemeChanged.value) {
             app.config.globalProperties.$primevue.config.theme = newTheme;
+            isThemeChanged.value = true;
+        }
     });
 
     /*** Watchers ***/
-    watch(
+    const stopConfigWatcher = watch(
         PrimeVue.config,
         (newValue, oldValue) => {
             PrimeVueService.emit('config:change', { newValue, oldValue });
@@ -209,7 +221,7 @@ export function setupConfig(app, PrimeVue) {
         { immediate: true, deep: true }
     );
 
-    watch(
+    const stopRippleWatcher = watch(
         () => PrimeVue.config.ripple,
         (newValue, oldValue) => {
             PrimeVueService.emit('config:ripple:change', { newValue, oldValue });
@@ -217,7 +229,7 @@ export function setupConfig(app, PrimeVue) {
         { immediate: true, deep: true }
     );
 
-    watch(
+    const stopThemeWatcher = watch(
         () => PrimeVue.config.theme,
         (newValue, oldValue) => {
             if (!isThemeChanged.value) {
@@ -234,7 +246,7 @@ export function setupConfig(app, PrimeVue) {
         { immediate: true, deep: true }
     );
 
-    watch(
+    const stopUnstyledWatcher = watch(
         () => PrimeVue.config.unstyled,
         (newValue, oldValue) => {
             if (!newValue && PrimeVue.config.theme) {
@@ -245,6 +257,11 @@ export function setupConfig(app, PrimeVue) {
         },
         { immediate: true, deep: true }
     );
+
+    stopWatchers.push(stopConfigWatcher);
+    stopWatchers.push(stopRippleWatcher);
+    stopWatchers.push(stopThemeWatcher);
+    stopWatchers.push(stopUnstyledWatcher);
 }
 
 export default {