microsoft
diff --git a/‎src/Reactor/Hosting/OverlayHostWiring.cs‎
Lines changed: 16 additions & 0 deletions b/‎src/Reactor/Hosting/OverlayHostWiring.cs‎
Lines changed: 16 additions & 0 deletions
diff --git a/‎src/Reactor/Hosting/ReactorHost.cs‎
Lines changed: 3 additions & 0 deletions b/‎src/Reactor/Hosting/ReactorHost.cs‎
Lines changed: 3 additions & 0 deletions
diff --git a/‎src/Reactor/Hosting/ReconcileHighlightOverlay.cs‎
Lines changed: 150 additions & 138 deletions b/‎src/Reactor/Hosting/ReconcileHighlightOverlay.cs‎
Lines changed: 150 additions & 138 deletions
@@ -81,6 +81,22 @@ public OverlayHostWiring(DispatcherQueue dispatcherQueue)
     public Grid? WrapperRoot => _wrapperRoot;
     public Canvas? OverlayCanvas => _overlayCanvas;
 
+    /// <summary>Test-only: live reconcile-highlight overlay (null if not yet created).</summary>
+    internal ReconcileHighlightOverlay? HighlightOverlay => _highlightOverlay;
+
+    /// <summary>
+    /// Test-only: bypass the highlight cooldown and dispatch a flush
+    /// synchronously. Returns false if no overlay context exists yet.
+    /// </summary>
+    internal bool DebugForceHighlightFlush()
+    {
+        if (_overlayCanvas is null) return false;
+        _highlightCooldown.Reset();
+        _highlightFlushPending = false;
+        FlushHighlight();
+        return true;
+    }
+
     /// <summary>
     /// Install <paramref name="newControl"/> into the shared wrapper Grid.
     /// The wrapper + Canvas are created on first call and reused forever
 
@@ -71,6 +71,9 @@ public sealed class ReactorHost : IDisposable
     // flips on.
     private OverlayHostWiring? _overlayWiring;
 
+    /// <summary>Test-only: access the live overlay-host wiring (null if not constructed).</summary>
+    internal OverlayHostWiring? OverlayWiring => _overlayWiring;
+
     // ── Layout cost overlay data pipeline (gated by ReactorFeatureFlags.ShowLayoutCost) ──
     // Owned by the host so the ETW session lifetime matches the host's lifetime.
     // Constructed lazily on first observed flag-on; never torn down except on Dispose
 
@@ -1,46 +1,73 @@
 using System.Numerics;
 using Microsoft.UI.Composition;
-using Microsoft.UI.Reactor.Core;
+using Microsoft.UI.Dispatching;
 using Microsoft.UI.Xaml;
 using Microsoft.UI.Xaml.Controls;
-using Microsoft.UI.Xaml.Hosting;
 
 namespace Microsoft.UI.Reactor.Hosting;
 
 /// <summary>
-/// Draws diagonal-striped overlay rectangles over UIElements that were mounted (red, 45°)
-/// or modified (yellow, 135°) during a reconcile pass. Uses the Composition visual layer
-/// to avoid creating XAML elements (which would themselves show up as reconcile churn).
-/// Each overlay fades out over <see cref="FadeDurationMs"/> milliseconds.
-/// Designed for best-effort display under high update cadence — caps sprites and
-/// uses a single scoped batch per flush to avoid swamping the compositor.
+/// Draws solid-color overlay rectangles over UIElements that were mounted (red)
+/// or modified (yellow) during a reconcile pass. Uses the Composition visual
+/// layer to avoid creating XAML elements (which would themselves show up as
+/// reconcile churn). One sprite per live target — repeat hits within
+/// <see cref="DefaultHoldDurationMs"/> refresh the existing sprite (geometry +
+/// brush) and restart its expiry timer instead of stacking duplicates. Sprites
+/// snap on/off via direct Opacity assignment + a one-shot
+/// <see cref="DispatcherQueueTimer"/>; no Composition animation is involved.
 /// </summary>
+/// <remarks>
+/// Issue #167 — sub-1.0 opacity sprites with a tiled <c>LinearGradientBrush</c>
+/// (transparent gradient stops, <c>ExtendMode=Wrap</c>, rotated
+/// <c>TransformMatrix</c>) cause a persistent ~50%-blend-with-white wash on
+/// nearby content (e.g. chart slice paths) until the next layout pass. The
+/// previous design used such a brush to paint the diagonal stripe pattern.
+/// Empirical bisect confirmed the gradient brush itself is the trigger:
+/// solid <c>CompositionColorBrush</c> at any opacity (1.0 or 0.33) clears
+/// the bug; the gradient brush at 0.33 reproduces it. This file uses solid
+/// color brushes only. Distinguishability stays via color (red vs yellow).
+/// See https://github.com/microsoft/microsoft-ui-reactor/issues/167 for
+/// the full repro investigation and bisect data.
+/// </remarks>
 internal sealed class ReconcileHighlightOverlay : IDisposable
 {
-    private const float MountedOpacity = 0.22f;
-    private const float ModifiedOpacity = 0.22f;
-    private const int FadeDurationMs = 600;
-    private const float StripeWidth = 5f;
+    private const float MountedOpacity = 0.33f;
+    private const float ModifiedOpacity = 0.33f;
+    private const int DefaultHoldDurationMs = 600;
 
-    /// <summary>Max sprites to add per flush call (excess elements are dropped).</summary>
+    /// <summary>
+    /// Test-only override for the hold duration (ms). Set before constructing
+    /// an overlay to make lifecycle tests run against a tighter window. Null
+    /// (default) means use <see cref="DefaultHoldDurationMs"/>.
+    /// </summary>
+    internal static int? TestHoldDurationOverrideMs { get; set; }
+
+    /// <summary>Max NEW sprites to add per flush call (refreshes don't count).</summary>
     private const int MaxSpritesPerFlush = 200;
 
-    /// <summary>Max live sprites in the container — skip adding more if exceeded.</summary>
+    /// <summary>Max live sprites in the container — skip adding new ones if exceeded.</summary>
     private const int MaxLiveSprites = 500;
 
     private static readonly global::Windows.UI.Color MountedColor =
-        global::Windows.UI.Color.FromArgb(255, 220, 40, 40);   // red at 45°
+        global::Windows.UI.Color.FromArgb(255, 220, 40, 40);   // red — mounted
     private static readonly global::Windows.UI.Color ModifiedColor =
-        global::Windows.UI.Color.FromArgb(255, 240, 200, 20);  // yellow at 135°
+        global::Windows.UI.Color.FromArgb(255, 240, 200, 20);  // yellow — modified
 
     private readonly Canvas _overlayCanvas;
     private readonly ContainerVisual _parentContainer;
     private readonly Compositor _compositor;
+    private readonly DispatcherQueue _dispatcherQueue;
     private readonly ContainerVisual _container;
+    private readonly Dictionary<UIElement, ActiveHighlight> _active = new();
+    private readonly int _holdDurationMs;
     private CompositionBrush? _mountedBrush;
     private CompositionBrush? _modifiedBrush;
-    private ScalarKeyFrameAnimation? _fadeMountedAnim;
-    private ScalarKeyFrameAnimation? _fadeModifiedAnim;
+
+    private sealed class ActiveHighlight
+    {
+        public SpriteVisual Sprite = default!;
+        public DispatcherQueueTimer Timer = default!;
+    }
 
     /// <summary>
     /// Ctor takes both the Canvas (for hit-testing / size queries) and the
@@ -55,8 +82,12 @@ public ReconcileHighlightOverlay(Canvas overlayCanvas, ContainerVisual parentCon
         _overlayCanvas = overlayCanvas;
         _parentContainer = parentContainer;
         _compositor = parentContainer.Compositor;
+        _dispatcherQueue = DispatcherQueue.GetForCurrentThread()
+            ?? throw new InvalidOperationException(
+                "ReconcileHighlightOverlay must be constructed on a UI thread with a DispatcherQueue.");
         _container = _compositor.CreateContainerVisual();
         _parentContainer.Children.InsertAtTop(_container);
+        _holdDurationMs = TestHoldDurationOverrideMs ?? DefaultHoldDurationMs;
     }
 
     /// <summary>
@@ -69,158 +100,139 @@ public void Show(
         IReadOnlyList<UIElement> mounted,
         IReadOnlyList<UIElement> modified)
     {
-        // Back-pressure: if too many sprites are already animating, skip this flush entirely
-        if (_container.Children.Count >= MaxLiveSprites) return;
+        _mountedBrush ??= _compositor.CreateColorBrush(MountedColor);
+        _modifiedBrush ??= _compositor.CreateColorBrush(ModifiedColor);
 
-        _mountedBrush ??= CreateStripeBrush(MountedColor, 45f);
-        _modifiedBrush ??= CreateStripeBrush(ModifiedColor, 135f);
-        _fadeMountedAnim ??= CreateFadeAnimation(MountedOpacity);
-        _fadeModifiedAnim ??= CreateFadeAnimation(ModifiedOpacity);
+        int newBudget = MaxSpritesPerFlush;
 
-        int budget = MaxSpritesPerFlush;
+        for (int i = 0; i < mounted.Count; i++)
+            RefreshOrAdd(host, mounted[i], _mountedBrush, MountedOpacity, ref newBudget);
 
-        // Single scoped batch for ALL sprites in this flush — avoids per-sprite batch overhead.
-        // CompositionScopedBatch is IDisposable; we dispose it from the Completed handler
-        // (or from the catch path below) so long debugging sessions don't leak COM/resource
-        // pressure one batch at a time.
-        var batch = _compositor.CreateScopedBatch(CompositionBatchTypes.Animation);
-        bool disposeInCompleted = false;
-        var thisFlushSprites = new List<SpriteVisual>(Math.Min(mounted.Count + modified.Count, MaxSpritesPerFlush));
-
-        try
-        {
-            for (int i = 0; i < mounted.Count && budget > 0; i++)
-            {
-                if (TryAddHighlight(host, mounted[i], _mountedBrush, MountedOpacity, _fadeMountedAnim, thisFlushSprites))
-                    budget--;
-            }
-
-            for (int i = 0; i < modified.Count && budget > 0; i++)
-            {
-                if (TryAddHighlight(host, modified[i], _modifiedBrush, ModifiedOpacity, _fadeModifiedAnim, thisFlushSprites))
-                    budget--;
-            }
-
-            // When the batch's animations complete, remove exactly the sprites
-            // we added in this flush. We can't use sprite.Opacity to decide —
-            // CompositionAnimation drives the rendered value but does not write
-            // back to the static property, so the getter still reads the last
-            // value we assigned (0.17 / 0.22) even after the fade completes.
-            // Tracking the per-flush list directly avoids that pitfall and
-            // prevents sprites from leaking permanently into the container.
-            var container = _container;
-            batch.Completed += (_, _) =>
-            {
-                try
-                {
-                    foreach (var sprite in thisFlushSprites)
-                    {
-                        try { container.Children.Remove(sprite); } catch { }
-                        try { sprite.Dispose(); } catch { }
-                    }
-                }
-                finally
-                {
-                    batch.Dispose();
-                }
-            };
-
-            disposeInCompleted = true;
-            batch.End();
-        }
-        catch
-        {
-            if (!disposeInCompleted) batch.Dispose();
-            throw;
-        }
+        for (int i = 0; i < modified.Count; i++)
+            RefreshOrAdd(host, modified[i], _modifiedBrush, ModifiedOpacity, ref newBudget);
     }
 
-    private bool TryAddHighlight(UIElement host, UIElement target, CompositionBrush brush,
-        float opacity, ScalarKeyFrameAnimation fadeAnim, List<SpriteVisual> flushSprites)
+    private void RefreshOrAdd(UIElement host, UIElement target, CompositionBrush brush,
+        float opacity, ref int newBudget)
     {
-        if (target is not FrameworkElement fe) return false;
-        if (fe.ActualWidth <= 0 || fe.ActualHeight <= 0) return false;
+        if (target is not FrameworkElement fe) return;
+        if (fe.ActualWidth <= 0 || fe.ActualHeight <= 0) return;
 
+        Vector2 size;
+        Vector3 offset;
         try
         {
             var transform = target.TransformToVisual(host);
-            var position = transform.TransformPoint(default);
-
-            var sprite = _compositor.CreateSpriteVisual();
-            sprite.Size = new Vector2((float)fe.ActualWidth, (float)fe.ActualHeight);
-            sprite.Offset = new Vector3((float)position.X, (float)position.Y, 0);
-            sprite.Opacity = opacity;
-            sprite.Brush = brush;
-
-            _container.Children.InsertAtTop(sprite);
-            flushSprites.Add(sprite);
-            sprite.StartAnimation("Opacity", fadeAnim);
-            return true;
+            var pos = transform.TransformPoint(default);
+            size = new Vector2((float)fe.ActualWidth, (float)fe.ActualHeight);
+            offset = new Vector3((float)pos.X, (float)pos.Y, 0);
         }
         catch (ArgumentException)
         {
             // TransformToVisual throws if target is in a different visual tree (popup/flyout)
-            return false;
+            return;
+        }
+
+        // Refresh path: same target already has a live sprite — update geometry/brush
+        // and restart the expiry timer. No new SpriteVisual, no stacking.
+        if (_active.TryGetValue(target, out var existing))
+        {
+            existing.Sprite.Brush = brush;
+            existing.Sprite.Opacity = opacity;
+            existing.Sprite.Size = size;
+            existing.Sprite.Offset = offset;
+            try { existing.Timer.Stop(); } catch { }
+            try { existing.Timer.Start(); } catch { }
+            return;
         }
+
+        // New sprite path — gated by per-flush and global caps.
+        if (newBudget <= 0) return;
+        if (_container.Children.Count >= MaxLiveSprites) return;
+
+        var sprite = _compositor.CreateSpriteVisual();
+        sprite.Size = size;
+        sprite.Offset = offset;
+        sprite.Opacity = opacity;
+        sprite.Brush = brush;
+        _container.Children.InsertAtTop(sprite);
+
+        var timer = _dispatcherQueue.CreateTimer();
+        timer.Interval = TimeSpan.FromMilliseconds(_holdDurationMs);
+        timer.IsRepeating = false;
+
+        var capturedTarget = target;
+        var container = _container;
+        timer.Tick += (s, _) =>
+        {
+            try
+            {
+                if (_active.TryGetValue(capturedTarget, out var ah))
+                {
+                    try { container.Children.Remove(ah.Sprite); } catch { }
+                    try { ah.Sprite.Dispose(); } catch { }
+                    _active.Remove(capturedTarget);
+                }
+            }
+            finally
+            {
+                try { ((DispatcherQueueTimer)s).Stop(); } catch { }
+            }
+        };
+
+        _active[target] = new ActiveHighlight { Sprite = sprite, Timer = timer };
+        timer.Start();
+        newBudget--;
     }
 
-    private ScalarKeyFrameAnimation CreateFadeAnimation(float fromOpacity)
+    // ─────────────────────────────────────────────────────────────────────
+    // Test-only accessors (gated by InternalsVisibleTo on Reactor.AppTests.Host)
+    // ─────────────────────────────────────────────────────────────────────
+
+    /// <summary>Test-only: live sprite count in the overlay container.</summary>
+    internal int LiveSpriteCount => _container.Children.Count;
+
+    /// <summary>Test-only: number of distinct targets currently tracked.</summary>
+    internal int ActiveTargetCount => _active.Count;
+
+    /// <summary>Test-only: snapshot of the current sprites for inspection.</summary>
+    internal IReadOnlyList<SpriteVisual> TestActiveSprites()
     {
-        var anim = _compositor.CreateScalarKeyFrameAnimation();
-        anim.InsertKeyFrame(0f, fromOpacity);
-        anim.InsertKeyFrame(1f, 0f);
-        anim.Duration = TimeSpan.FromMilliseconds(FadeDurationMs);
-        return anim;
+        var list = new List<SpriteVisual>(_active.Count);
+        foreach (var ah in _active.Values) list.Add(ah.Sprite);
+        return list;
     }
 
     /// <summary>
-    /// Creates a repeating diagonal-stripe brush. The gradient tiles with
-    /// <see cref="CompositionGradientExtendMode.Wrap"/> and is rotated to
-    /// the requested angle (e.g. 45° or 135°).
+    /// Test-only: synchronously fire all pending expiry timers, removing
+    /// every active sprite. Use to make lifecycle tests deterministic without
+    /// waiting on real wall-clock time.
     /// </summary>
-    private CompositionBrush CreateStripeBrush(global::Windows.UI.Color color, float angleDegrees)
+    internal void TestForceExpire()
     {
-        var brush = _compositor.CreateLinearGradientBrush();
-        brush.MappingMode = CompositionMappingMode.Absolute;
-        brush.ExtendMode = CompositionGradientExtendMode.Wrap;
-
-        // Vertical gradient over one period (stripe + gap), then rotate
-        float period = StripeWidth * 2f;
-        brush.StartPoint = new Vector2(0, 0);
-        brush.EndPoint = new Vector2(0, period);
-
-        var transparent = global::Windows.UI.Color.FromArgb(0, color.R, color.G, color.B);
-        brush.ColorStops.Add(_compositor.CreateColorGradientStop(0f, color));
-        brush.ColorStops.Add(_compositor.CreateColorGradientStop(0.5f, color));
-        brush.ColorStops.Add(_compositor.CreateColorGradientStop(0.5f, transparent));
-        brush.ColorStops.Add(_compositor.CreateColorGradientStop(1f, transparent));
-
-        float radians = angleDegrees * MathF.PI / 180f;
-        brush.TransformMatrix = Matrix3x2.CreateRotation(radians);
-
-        return brush;
+        var snapshot = new List<KeyValuePair<UIElement, ActiveHighlight>>(_active);
+        foreach (var kv in snapshot)
+        {
+            try { kv.Value.Timer.Stop(); } catch { }
+            try { _container.Children.Remove(kv.Value.Sprite); } catch { }
+            try { kv.Value.Sprite.Dispose(); } catch { }
+            _active.Remove(kv.Key);
+        }
     }
 
     public void Dispose()
     {
-        // Dispose any in-flight sprite children before tearing down the
-        // container itself. They hold animations + brushes that the
-        // compositor would otherwise leak across long debug sessions.
-        try
+        foreach (var ah in _active.Values)
         {
-            for (int i = _container.Children.Count - 1; i >= 0; i--)
-            {
-                var child = _container.Children.ElementAt(i);
-                try { _container.Children.Remove(child); } catch { }
-                try { child.Dispose(); } catch { }
-            }
+            try { ah.Timer.Stop(); } catch { }
+            try { _container.Children.Remove(ah.Sprite); } catch { }
+            try { ah.Sprite.Dispose(); } catch { }
         }
-        catch { }
+        _active.Clear();
+
         try { _parentContainer.Children.Remove(_container); } catch { }
         try { _container.Dispose(); } catch { }
         try { _mountedBrush?.Dispose(); } catch { }
         try { _modifiedBrush?.Dispose(); } catch { }
-        try { _fadeMountedAnim?.Dispose(); } catch { }
-        try { _fadeModifiedAnim?.Dispose(); } catch { }
     }
 }