[Fix crash] Image loading fails due to network error for instance shut down metro while app is running

change/react-native-windows-a9b5580b-f55c-4089-b03b-1778429afec7.json

@@ -0,0 +1,7 @@
+{
+  "type": "prerelease",
+  "comment": "Fix crash when image loading fails due to network error",
+  "packageName": "react-native-windows",
+  "email": "[email protected]",
+  "dependentChangeType": "patch"
+}

package.json

@@ -44,7 +44,7 @@
     "fast-glob": "^3.2.11",
     "husky": "^4.2.5",
     "prettier-plugin-hermes-parser": "0.21.1",
-    "react-native-platform-override": "0.0.0-canary.1015",
+    "react-native-platform-override": "0.0.0-canary.1016",
     "unbroken": "1.0.27",
     "lage": "^2.7.1",
     "lodash": "^4.17.15"

packages/@rnw-scripts/promote-release/package.json

@@ -24,6 +24,7 @@
     "@react-native-windows/package-utils": "^0.0.0-canary.96",
     "@typescript-eslint/eslint-plugin": "^7.1.1",
     "@typescript-eslint/parser": "^7.1.1",
+    "minimatch": "^10.0.3",
     "chalk": "^4.1.0",
     "simple-git": "^3.3.0",
     "source-map-support": "^0.5.19",

vnext/Microsoft.ReactNative/Fabric/Composition/UriImageManager.cpp

@@ -291,9 +291,11 @@ ImageResponseOrImageErrorInfo ImageFailedResponse::ResolveImage() {
   if (imageOrError.errorInfo->error.empty()) {
     imageOrError.errorInfo->error = "Failed to load image.";
   }
-  for (auto &&[header, value] : m_responseHeaders) {
-    imageOrError.errorInfo->httpResponseHeaders.push_back(
-        std::make_pair<std::string, std::string>(winrt::to_string(header), winrt::to_string(value)));
+  if (m_responseHeaders) {
+    for (auto &&[header, value] : m_responseHeaders) {
+      imageOrError.errorInfo->httpResponseHeaders.push_back(
+          std::make_pair<std::string, std::string>(winrt::to_string(header), winrt::to_string(value)));
+    }
   }
   return imageOrError;
 }

vnext/Microsoft.ReactNative/Fabric/WindowsImageManager.cpp

@@ -10,6 +10,7 @@
 #include <Fabric/Composition/ImageResponseImage.h>
 #include <Fabric/Composition/UriImageManager.h>
 #include <Networking/NetworkPropertyIds.h>
+#include <Utils/CppWinrtLessExceptions.h>
 #include <Utils/ImageUtils.h>
 #include <fmt/format.h>
 #include <functional/functor.h>
@@ -131,7 +132,19 @@ WindowsImageManager::GetImageRandomAccessStreamAsync(
     request.Content(bodyContent);
   }
 
-  winrt::Windows::Web::Http::HttpResponseMessage response(co_await m_httpClient.SendRequestAsync(request));
+  auto asyncOp = m_httpClient.SendRequestAsync(request);
+  co_await lessthrow_await_adapter<winrt::Windows::Foundation::IAsyncOperationWithProgress<
+      winrt::Windows::Web::Http::HttpResponseMessage,
+      winrt::Windows::Web::Http::HttpProgress>>{asyncOp};
+
+  if (asyncOp.Status() == winrt::Windows::Foundation::AsyncStatus::Error ||
+      asyncOp.Status() == winrt::Windows::Foundation::AsyncStatus::Canceled) {
+    auto errorMessage = FormatHResultError(winrt::hresult_error(asyncOp.ErrorCode()));
+    co_return winrt::Microsoft::ReactNative::Composition::ImageFailedResponse(
+        winrt::to_hstring("Network request failed: " + errorMessage));
+  }
+
+  winrt::Windows::Web::Http::HttpResponseMessage response = asyncOp.GetResults();
 
   if (!response.IsSuccessStatusCode()) {
     co_return winrt::Microsoft::ReactNative::Composition::ImageFailedResponse(