Ensure old widgets are disposed when replaced by new ones

Author: TimLariviere

src/Fabulous/Attributes.fs

@@ -193,12 +193,19 @@ module Attributes =
 
             childNode.ApplyDiff(&diff)
 
-        let updateNode _ (newValueOpt: Widget voption) (node: IViewNode) =
+        let updateNode (oldValueOpt: Widget voption) (newValueOpt: Widget voption) (node: IViewNode) =
+            if oldValueOpt.IsSome then
+                // Dispose the existing child if it exists
+                let childView = get node.Target
+
+                if not(isNull childView) then
+                    let childNode = node.TreeContext.GetViewNode(childView)
+                    childNode.Dispose()
+
             match newValueOpt with
             | ValueNone -> set node.Target null
             | ValueSome widget ->
                 let struct (_, view) = Helpers.createViewForWidget node widget
-
                 set node.Target (unbox view)
 
         defineWidget name applyDiff updateNode
@@ -255,8 +262,21 @@ module Attributes =
 
                 | _ -> ()
 
-        let updateNode _ (newValueOpt: ArraySlice<Widget> voption) (node: IViewNode) =
+        let updateNode (oldValueOpt: ArraySlice<Widget> voption) (newValueOpt: ArraySlice<Widget> voption) (node: IViewNode) =
             let targetColl = getCollection node.Target
+
+            if oldValueOpt.IsSome then
+                // Dispose the existing children if they exist
+                let oldWidgets = oldValueOpt.Value
+                let span = ArraySlice.toSpan oldWidgets
+
+                for index = 0 to span.Length do
+                    let childView = box targetColl[index]
+
+                    if not(isNull childView) then
+                        let childNode = node.TreeContext.GetViewNode(childView)
+                        childNode.Dispose()
+
             targetColl.Clear()
 
             match newValueOpt with

src/Fabulous/ViewNode.fs

@@ -81,12 +81,16 @@ type ViewNode =
     member inline private this.ApplyWidgetDiffs(diffs: WidgetChanges inref) =
         for diff in diffs do
             match diff with
-            | WidgetChange.Added newWidget
-            | WidgetChange.ReplacedBy newWidget ->
+            | WidgetChange.Added newWidget ->
                 let definition = (AttributeDefinitionStore.getWidget newWidget.Key)
 
                 definition.UpdateNode ValueNone (ValueSome newWidget.Value) (this :> IViewNode)
 
+            | WidgetChange.ReplacedBy(oldWidget, newWidget) ->
+                let definition = (AttributeDefinitionStore.getWidget newWidget.Key)
+
+                definition.UpdateNode (ValueSome oldWidget.Value) (ValueSome newWidget.Value) (this :> IViewNode)
+
             | WidgetChange.Removed removed ->
                 let definition = (AttributeDefinitionStore.getWidget removed.Key)
 

src/Fabulous/WidgetDiff.fs

@@ -83,7 +83,7 @@ and [<Struct; RequireQualifiedAccess>] WidgetChange =
     | Added of widget: WidgetAttribute
     | Removed of widget: WidgetAttribute
     | Updated of widget: WidgetAttribute * diff: WidgetDiff // updated * diff
-    | ReplacedBy of widget: WidgetAttribute
+    | ReplacedBy of oldWidget: WidgetAttribute * newWidget: WidgetAttribute
 
 and [<Struct; RequireQualifiedAccess>] WidgetCollectionChange =
     | Added of attr: WidgetCollectionAttribute
@@ -395,7 +395,7 @@ and [<Struct; IsByRefLike>] WidgetChangesEnumerator
 
                                         WidgetChange.Updated(nextAttr, diff)
                                     else
-                                        WidgetChange.ReplacedBy nextAttr
+                                        WidgetChange.ReplacedBy(prevAttr, nextAttr)
 
                                 e.current <- change
                                 res <- ValueSome true