Addresing feedback, remove unnecassary code, remove setTimeout and Task.Delay from tests

Author: rolandVi

src/Components/Web.JS/src/Rendering/BinaryImageComponent.ts

@@ -73,7 +73,6 @@ export class BinaryImageComponent {
 
     observer.observe(parent, {
       childList: true,
-      subtree: true,
       attributes: true,
       attributeFilter: ['src'],
     });
@@ -292,15 +291,13 @@ export class BinaryImageComponent {
         BinaryImageComponent.loadingImages.delete(imgElement);
         imgElement.style.removeProperty('--blazor-image-progress');
       }
-      imgElement.removeEventListener('error', onError);
     };
 
     const onError = (_e: Event) => {
       if (!cacheKey || BinaryImageComponent.activeCacheKey.get(imgElement) === cacheKey) {
         BinaryImageComponent.loadingImages.delete(imgElement);
         imgElement.style.removeProperty('--blazor-image-progress');
       }
-      imgElement.removeEventListener('load', onLoad);
     };
 
     imgElement.addEventListener('load', onLoad, { once: true });

src/Components/test/E2ETest/Tests/ImageTest.cs

@@ -166,15 +166,22 @@ public void ImageRenders_WithCorrectDimensions()
     [Fact]
     public void Image_CompletesLoad_AfterArtificialDelay()
     {
-        // Patch setImageAsync to introduce a delay before delegating to original
         ((IJavaScriptExecutor)Browser).ExecuteScript(@"
             (function(){
               const root = Blazor && Blazor._internal && Blazor._internal.BinaryImageComponent;
               if (!root) return;
               if (!window.__origSetImageAsync) {
                 window.__origSetImageAsync = root.setImageAsync;
                 root.setImageAsync = async function(...args){
-                  await new Promise(r => setTimeout(r, 500));
+                  const getResolvers = () => {
+                    if (Promise.fromResolvers) return Promise.fromResolvers();
+                    let resolve, reject;
+                    const promise = new Promise((r,j)=>{ resolve=r; reject=j; });
+                    return { promise, resolve, reject };
+                  };
+                  const resolvers = getResolvers();
+                  window.__imagePromiseResolvers = resolvers;
+                  await resolvers.promise;
                   return window.__origSetImageAsync.apply(this, args);
                 };
               }
@@ -183,21 +190,25 @@ public void Image_CompletesLoad_AfterArtificialDelay()
         Browser.FindElement(By.Id("load-png")).Click();
 
         var imageElement = Browser.FindElement(By.Id("png-basic"));
-        Browser.True(() =>
-        {
+        Assert.NotNull(imageElement);
+
+        ((IJavaScriptExecutor)Browser).ExecuteScript("if (window.__imagePromiseResolvers) { window.__imagePromiseResolvers.resolve(); }");
+
+        Browser.True(() => {
             var src = imageElement.GetAttribute("src");
             return !string.IsNullOrEmpty(src) && src.StartsWith("blob:", StringComparison.Ordinal);
         });
         Browser.Equal("PNG basic loaded", () => Browser.FindElement(By.Id("current-status")).Text);
 
-        // Restore
+        // Restore original function and clean up instrumentation
         ((IJavaScriptExecutor)Browser).ExecuteScript(@"
             (function(){
               const root = Blazor && Blazor._internal && Blazor._internal.BinaryImageComponent;
               if (root && window.__origSetImageAsync) {
                 root.setImageAsync = window.__origSetImageAsync;
                 delete window.__origSetImageAsync;
               }
+              delete window.__imagePromiseResolvers;
             })();");
     }
 

src/Components/test/testassets/BasicTestApp/ImageTest/ImageTestComponent.razor

@@ -113,18 +113,17 @@
         _currentStatus = "Component initialized";
     }
 
-    private async Task LoadJpgFromStream()
+    private void LoadJpgFromStream()
     {
         _currentStatus = "Loading JPG from stream...";
         var stream = new MemoryStream(TestJpgData);
         _jpgStreamSource = new ImageSource(stream, "image/jpeg", "test-jpg-stream");
-        await Task.Delay(10);
         _jpgStream = true;
         _currentStatus = "JPG from stream loaded";
 
     }
 
-    private async Task ChangeDynamicImageSource()
+    private void ChangeDynamicImageSource()
     {
         if (!_dynamicSource)
         {
@@ -133,7 +132,6 @@
             _dynamicImageSource = new ImageSource(TestPngData, "image/png", "dynamic-png");
             _dynamicSource = true;
             _isCurrentlyShowingPng = true;
-            await Task.Delay(10);
             _currentStatus = "Dynamic source initialized with PNG";
         }
         else
@@ -144,37 +142,32 @@
                 _currentStatus = "Changing to JPG...";
                 _dynamicImageSource = new ImageSource(TestJpgData, "image/jpeg", "dynamic-jpg");
                 _isCurrentlyShowingPng = false;
-                await Task.Delay(10);
                 _currentStatus = "Dynamic source changed to JPG";
             }
             else
             {
                 _currentStatus = "Changing to PNG...";
                 _dynamicImageSource = new ImageSource(TestPngData, "image/png", "dynamic-png");
                 _isCurrentlyShowingPng = true;
-                await Task.Delay(10);
                 _currentStatus = "Dynamic source changed to PNG";
             }
         }
     }
-    private async Task LoadPairSequence()
+    private void LoadPairSequence()
     {
         _currentStatus = "Loading pair sequence...";
         _pairSource = new ImageSource(TestJpgData, "image/jpeg", "pair-cache");
         _pair1Visible = true;
-        await Task.Delay(50);
         _pair2Visible = true;
-        await Task.Delay(10);
         _currentStatus = "Pair second loaded";
     }
 
-    private async Task ReloadPng()
+    private void ReloadPng()
     {
         if (_pngBasic)
         {
             _currentStatus = "Reloading PNG...";
             _pngBasic = false;
-            await Task.Delay(10);
         }
         else
         {
@@ -183,28 +176,25 @@
 
         _basicImageSource = new ImageSource(TestPngData, "image/png", "test-png-basic");
         _pngBasic = true;
-        await Task.Delay(10);
         _currentStatus = "PNG basic loaded";
     }
 
-    private async Task LoadErrorImage()
+    private void LoadErrorImage()
     {
         _currentStatus = "Loading error image...";
         // Create a stream then seek to end so component throws when validating position
         var ms = new MemoryStream(new byte[] { 1, 2, 3, 4 });
         ms.Seek(ms.Length, SeekOrigin.Begin);
         _errorSource = new ImageSource(ms, "image/png", "error-key");
         _errorImage = true;
-        await Task.Delay(10);
         _currentStatus = "Error image loaded";
     }
 
-    private async Task LoadCachedJpg()
+    private void LoadCachedJpg()
     {
         _currentStatus = "Loading cached JPG...";
         _cachedJpgSource = new ImageSource(TestJpgData, "image/jpeg", "single-cached-jpg");
         _cachedJpgVisible = true;
-        await Task.Delay(10);
         _currentStatus = "Cached JPG loaded";
     }