react-native-windows 0.74.36 → 0.74.37

package/Microsoft.ReactNative/Fabric/AbiViewProps.cpp

@@ -77,14 +77,12 @@ winrt::Microsoft::ReactNative::Color Color::ReadValue(
   switch (reader.ValueType()) {
     case JSValueType::Int64: {
       auto argb = reader.GetInt64();
-      return winrt::make<Color>(facebook::react::Color{
-          /*m_isDefined*/ true,
-          /*color*/
-          {static_cast<uint8_t>((argb >> 24) & 0xFF),
-           static_cast<uint8_t>((argb >> 16) & 0xFF),
-           static_cast<uint8_t>((argb >> 8) & 0xFF),
-           static_cast<uint8_t>(argb & 0xFF)},
-          {}});
+      return winrt::make<Color>(facebook::react::Color{/*color*/
+                                                       {static_cast<uint8_t>((argb >> 24) & 0xFF),
+                                                        static_cast<uint8_t>((argb >> 16) & 0xFF),
+                                                        static_cast<uint8_t>((argb >> 8) & 0xFF),
+                                                        static_cast<uint8_t>(argb & 0xFF)},
+                                                       {}});
     }
     case JSValueType::Object: {
       std::vector<std::string> platformColors;
@@ -96,10 +94,10 @@ winrt::Microsoft::ReactNative::Color Color::ReadValue(
           SkipValue<JSValue>(reader); // Skip this property
         }
       }
-      return winrt::make<Color>(facebook::react::Color{/*m_isDefined*/ true, /*color*/ {}, std::move(platformColors)});
+      return winrt::make<Color>(facebook::react::Color{/*color*/ {}, std::move(platformColors)});
     }
     default:
-      return winrt::make<Color>(facebook::react::Color{/*m_isDefined*/ false, /*color*/ {0, 0, 0, 0}, {}});
+      return winrt::make<Color>(facebook::react::Color{/*color*/ {0, 0, 0, 0}, {}});
   }
 }
 

package/Microsoft.ReactNative/Fabric/Composition/CompositionViewComponentView.cpp

@@ -183,7 +183,7 @@ void ComponentView::updateProps(
     updateShadowProps(oldViewProps, newViewProps);
   }
   if (oldViewProps.tooltip != newViewProps.tooltip) {
-    if (!m_tooltipTracked && newViewProps.tooltip) {
+    if (!m_tooltipTracked && newViewProps.tooltip && !newViewProps.tooltip->empty()) {
       TooltipService::GetCurrent(m_reactContext.Properties())->StartTracking(*this);
       m_tooltipTracked = true;
     } else if (m_tooltipTracked && !newViewProps.tooltip) {

package/Microsoft.ReactNative/Fabric/Composition/TooltipService.cpp

@@ -10,6 +10,7 @@
 #include <react/renderer/core/LayoutConstraints.h>
 #include <react/renderer/textlayoutmanager/TextLayoutManager.h>
 #include <winrt/Microsoft.ReactNative.Composition.h>
+#include <winrt/Windows.UI.ViewManagement.h>
 #include "TextDrawing.h"
 #include "dwmapi.h"
 
@@ -49,7 +50,9 @@ facebook::react::AttributedStringBox CreateTooltipAttributedString(const std::st
   auto fragment = facebook::react::AttributedString::Fragment{};
   fragment.string = tooltip;
   fragment.textAttributes.fontSize = tooltipFontSize;
-  attributedString.appendFragment(fragment);
+  fragment.textAttributes.fontSizeMultiplier =
+      static_cast<float>(winrt::Windows::UI::ViewManagement::UISettings().TextScaleFactor());
+  attributedString.appendFragment(std::move(fragment));
   return facebook::react::AttributedStringBox{attributedString};
 }
 
@@ -231,14 +234,13 @@ void TooltipTracker::OnUnmounted(
 }
 
 void TooltipTracker::ShowTooltip(const winrt::Microsoft::ReactNative::ComponentView &view) noexcept {
-  auto viewCompView = view.as<winrt::Microsoft::ReactNative::Composition::ViewComponentView>();
-
-  auto selfView =
-      winrt::get_self<winrt::Microsoft::ReactNative::Composition::implementation::ViewComponentView>(viewCompView);
-  auto parentHwnd = selfView->GetHwndForParenting();
   DestroyTimer();
 
   if (!m_hwndTip) {
+    auto viewCompView = view.as<winrt::Microsoft::ReactNative::Composition::ViewComponentView>();
+    auto selfView =
+        winrt::get_self<winrt::Microsoft::ReactNative::Composition::implementation::ViewComponentView>(viewCompView);
+    auto parentHwnd = selfView->GetHwndForParenting();
     auto tooltipData = std::make_unique<TooltipData>(view);
     tooltipData->attributedString = CreateTooltipAttributedString(*selfView->viewProps()->tooltip);
 
@@ -256,37 +258,39 @@ void TooltipTracker::ShowTooltip(const winrt::Microsoft::ReactNative::ComponentV
     facebook::react::TextLayoutManager::GetTextLayout(
         tooltipData->attributedString, {} /*paragraphAttributes*/, layoutConstraints, tooltipData->textLayout);
 
-    DWRITE_TEXT_METRICS tm;
-    winrt::check_hresult(tooltipData->textLayout->GetMetrics(&tm));
-
-    tooltipData->width =
-        static_cast<int>(tm.width + ((tooltipHorizontalPadding + tooltipHorizontalPadding) * scaleFactor));
-    tooltipData->height = static_cast<int>(tm.height + ((tooltipTopPadding + tooltipBottomPadding) * scaleFactor));
-
-    POINT pt = {static_cast<LONG>(m_pos.X), static_cast<LONG>(m_pos.Y)};
-    ClientToScreen(parentHwnd, &pt);
-
-    RegisterTooltipWndClass();
-    HINSTANCE hInstance = GetModuleHandle(NULL);
-    m_hwndTip = CreateWindow(
-        c_tooltipWindowClassName,
-        L"Tooltip",
-        WS_POPUP,
-        pt.x - tooltipData->width / 2,
-        static_cast<int>(pt.y - tooltipData->height - (toolTipPlacementMargin * scaleFactor)),
-        tooltipData->width,
-        tooltipData->height,
-        parentHwnd,
-        NULL,
-        hInstance,
-        tooltipData.get());
-
-    DWM_WINDOW_CORNER_PREFERENCE preference = DWMWCP_ROUNDSMALL;
-    UINT borderThickness = 0;
-    DwmSetWindowAttribute(m_hwndTip, DWMWA_WINDOW_CORNER_PREFERENCE, &preference, sizeof(preference));
-
-    tooltipData.release();
-    AnimateWindow(m_hwndTip, toolTipAnimationTimeMs, AW_BLEND);
+    if (tooltipData->textLayout) {
+      DWRITE_TEXT_METRICS tm;
+      winrt::check_hresult(tooltipData->textLayout->GetMetrics(&tm));
+
+      tooltipData->width =
+          static_cast<int>((tm.width + tooltipHorizontalPadding + tooltipHorizontalPadding) * scaleFactor);
+      tooltipData->height = static_cast<int>((tm.height + tooltipTopPadding + tooltipBottomPadding) * scaleFactor);
+
+      POINT pt = {static_cast<LONG>(m_pos.X), static_cast<LONG>(m_pos.Y)};
+      ClientToScreen(parentHwnd, &pt);
+
+      RegisterTooltipWndClass();
+      HINSTANCE hInstance = GetModuleHandle(NULL);
+      m_hwndTip = CreateWindow(
+          c_tooltipWindowClassName,
+          L"Tooltip",
+          WS_POPUP,
+          pt.x - tooltipData->width / 2,
+          static_cast<int>(pt.y - tooltipData->height - (toolTipPlacementMargin * scaleFactor)),
+          tooltipData->width,
+          tooltipData->height,
+          parentHwnd,
+          NULL,
+          hInstance,
+          tooltipData.get());
+
+      DWM_WINDOW_CORNER_PREFERENCE preference = DWMWCP_ROUNDSMALL;
+      UINT borderThickness = 0;
+      DwmSetWindowAttribute(m_hwndTip, DWMWA_WINDOW_CORNER_PREFERENCE, &preference, sizeof(preference));
+
+      tooltipData.release();
+      AnimateWindow(m_hwndTip, toolTipAnimationTimeMs, AW_BLEND);
+    }
   }
 }
 

package/Microsoft.ReactNative/Fabric/platform/react/renderer/graphics/HostPlatformColor.h

@@ -12,13 +12,10 @@ namespace facebook::react {
 
 struct Color {
   bool operator==(const Color &otherColor) const {
-    return m_isUndefined && otherColor.m_isUndefined ||
-        (m_isUndefined == otherColor.m_isUndefined && m_color == otherColor.m_color &&
-         m_platformColor == otherColor.m_platformColor);
+    return m_color == otherColor.m_color && m_platformColor == otherColor.m_platformColor;
   }
   bool operator!=(const Color &otherColor) const {
-    return m_isUndefined != otherColor.m_isUndefined || m_color != otherColor.m_color ||
-        m_platformColor != otherColor.m_platformColor;
+    return m_color != otherColor.m_color || m_platformColor != otherColor.m_platformColor;
   }
 
   winrt::Windows::UI::Color AsWindowsColor() const {
@@ -36,13 +33,12 @@ struct Color {
     return RGB(m_color.R, m_color.G, m_color.B) | (m_color.A << 24);
   }
 
-  bool m_isUndefined;
   winrt::Windows::UI::Color m_color;
   std::vector<std::string> m_platformColor;
 };
 
 namespace HostPlatformColor {
-static const facebook::react::Color UndefinedColor{true};
+static const facebook::react::Color UndefinedColor{{0, 0, 0, 0} /*Black*/, {} /*Empty PlatformColors*/};
 } // namespace HostPlatformColor
 
 inline Color hostPlatformColorFromComponents(ColorComponents components) {
@@ -53,7 +49,6 @@ inline Color hostPlatformColorFromComponents(ColorComponents components) {
       static_cast<uint8_t>((int)round(components.green * ratio) & 0xff),
       static_cast<uint8_t>((int)round(components.blue * ratio) & 0xff)};
   return {
-      /* .m_isUndefined = */ false,
       /* .m_color = */ color,
       /* .m_platformColor = */ {}};
 }

package/Microsoft.ReactNative/Fabric/platform/react/renderer/graphics/PlatformColorParser.h

@@ -19,7 +19,6 @@ parsePlatformColor(const ContextContainer &contextContainer, int32_t surfaceId,
     auto map = (std::unordered_map<std::string, std::vector<std::string>>)value;
     if (map.find("windowsbrush") != map.end()) {
       facebook::react::Color color = {
-          /* .m_isDefined = */ true,
           /* .m_color = */ {},
           /* .m_platformColor = */ std::move(map["windowsbrush"]),
       };

package/Microsoft.ReactNative.Cxx/NativeModules.h

@@ -1360,6 +1360,15 @@ inline ReactModuleProvider MakeTurboModuleProvider() noexcept {
   return MakeModuleProvider<TModule>();
 }
 
+// Clang does not allow a virtual function address to be a constexpr statement
+#if !defined(CONSTEXPR_SUPPORTED_ON_VIRTUAL_FN_ADDRESS)
+#if defined(__clang__)
+#define CONSTEXPR_SUPPORTED_ON_VIRTUAL_FN_ADDRESS
+#else
+#define CONSTEXPR_SUPPORTED_ON_VIRTUAL_FN_ADDRESS constexpr
+#endif
+#endif
+
 } // namespace winrt::Microsoft::ReactNative
 
 namespace React {

package/PropertySheets/Generated/PackageVersion.g.props

@@ -10,11 +10,11 @@
 -->
 <Project xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
   <PropertyGroup>
-    <ReactNativeWindowsVersion>0.74.36</ReactNativeWindowsVersion>
+    <ReactNativeWindowsVersion>0.74.37</ReactNativeWindowsVersion>
     <ReactNativeWindowsMajor>0</ReactNativeWindowsMajor>
     <ReactNativeWindowsMinor>74</ReactNativeWindowsMinor>
-    <ReactNativeWindowsPatch>36</ReactNativeWindowsPatch>
+    <ReactNativeWindowsPatch>37</ReactNativeWindowsPatch>
     <ReactNativeWindowsCanary>false</ReactNativeWindowsCanary>
-    <ReactNativeWindowsCommitId>a31e698ed4c308d9f1933ef2abed8bbc4c2bbc31</ReactNativeWindowsCommitId>
+    <ReactNativeWindowsCommitId>4ad063f22757b42a70478b2c145520e621fd2bf5</ReactNativeWindowsCommitId>
   </PropertyGroup>
 </Project>

package/Shared/Networking/WinRTWebSocketResource.cpp

@@ -21,16 +21,18 @@
 
 using Microsoft::Common::Utilities::CheckedReinterpretCast;
 
+using Mso::DispatchQueue;
+
 using std::function;
 using std::lock_guard;
 using std::mutex;
-using std::size_t;
 using std::string;
 using std::vector;
 
 using winrt::fire_and_forget;
 using winrt::hresult;
 using winrt::hresult_error;
+using winrt::hstring;
 using winrt::resume_background;
 using winrt::resume_on_signal;
 using winrt::Windows::Foundation::IAsyncAction;
@@ -38,6 +40,7 @@ using winrt::Windows::Foundation::Uri;
 using winrt::Windows::Networking::Sockets::IMessageWebSocket;
 using winrt::Windows::Networking::Sockets::IMessageWebSocketMessageReceivedEventArgs;
 using winrt::Windows::Networking::Sockets::IWebSocket;
+using winrt::Windows::Networking::Sockets::IWebSocketClosedEventArgs;
 using winrt::Windows::Networking::Sockets::MessageWebSocket;
 using winrt::Windows::Networking::Sockets::SocketMessageType;
 using winrt::Windows::Networking::Sockets::WebSocketClosedEventArgs;
@@ -54,9 +57,9 @@ namespace {
 ///
 /// Implements an awaiter for Mso::DispatchQueue
 ///
-auto resume_in_queue(const Mso::DispatchQueue &queue) noexcept {
+auto resume_in_queue(const DispatchQueue &queue) noexcept {
   struct awaitable {
-    awaitable(const Mso::DispatchQueue &queue) noexcept : m_queue{queue} {}
+    awaitable(const DispatchQueue &queue) noexcept : m_queue{queue} {}
 
     bool await_ready() const noexcept {
       return false;
@@ -79,10 +82,367 @@ auto resume_in_queue(const Mso::DispatchQueue &queue) noexcept {
   return awaitable{queue};
 } // resume_in_queue
 
+DispatchQueue GetCurrentOrSerialQueue() noexcept {
+  auto queue = DispatchQueue::CurrentQueue();
+  if (!queue)
+    queue = DispatchQueue::MakeSerialQueue();
+
+  return queue;
+}
+
 } // namespace
 
 namespace Microsoft::React::Networking {
 
+#pragma region WinRTWebSocketResource2
+
+WinRTWebSocketResource2::WinRTWebSocketResource2(
+    IMessageWebSocket &&socket,
+    IDataWriter &&writer,
+    vector<ChainValidationResult> &&certExceptions,
+    DispatchQueue callingQueue)
+    : m_socket{std::move(socket)},
+      m_writer(std::move(writer)),
+      m_readyState{ReadyState::Connecting},
+      m_connectPerformed{CreateEvent(/*attributes*/ nullptr, /*manual reset*/ true, /*state*/ false, /*name*/ nullptr)},
+      m_callingQueue{callingQueue} {
+  for (const auto &certException : certExceptions) {
+    m_socket.Control().IgnorableServerCertificateErrors().Append(certException);
+  }
+}
+
+// private
+WinRTWebSocketResource2::WinRTWebSocketResource2(
+    IMessageWebSocket &&socket,
+    vector<ChainValidationResult> &&certExceptions)
+    : WinRTWebSocketResource2(
+          std::move(socket),
+          DataWriter{socket.OutputStream()},
+          std::move(certExceptions),
+          GetCurrentOrSerialQueue()) {}
+
+WinRTWebSocketResource2::WinRTWebSocketResource2(vector<ChainValidationResult> &&certExceptions)
+    : WinRTWebSocketResource2(MessageWebSocket{}, std::move(certExceptions)) {}
+
+WinRTWebSocketResource2::~WinRTWebSocketResource2() noexcept /*override*/
+{}
+
+void WinRTWebSocketResource2::Fail(string &&message, ErrorType type) noexcept {
+  auto self = shared_from_this();
+
+  self->m_backgroundQueue.Post([self, message = std::move(message), type]() {
+    self->m_readyState = ReadyState::Closed;
+    self->m_callingQueue.Post([self, message = std::move(message), type]() {
+      if (self->m_errorHandler) {
+        self->m_errorHandler({std::move(message), type});
+      }
+    });
+  });
+}
+
+void WinRTWebSocketResource2::Fail(hresult &&error, ErrorType type) noexcept {
+  Fail(Utilities::HResultToString(std::move(error)), type);
+}
+
+void WinRTWebSocketResource2::Fail(hresult_error const &error, ErrorType type) noexcept {
+  Fail(Utilities::HResultToString(error), type);
+}
+
+void WinRTWebSocketResource2::OnMessageReceived(
+    IMessageWebSocket const &,
+    IMessageWebSocketMessageReceivedEventArgs const &args) {
+  auto self = shared_from_this();
+  string response;
+
+  IDataReader reader{nullptr};
+  // Use WinRT ABI to avoid throwing exceptions on expected code paths
+  HRESULT hr =
+      reinterpret_cast<ABI::Windows::Networking::Sockets::IMessageWebSocketMessageReceivedEventArgs *>(
+          winrt::get_abi(args))
+          ->GetDataReader(reinterpret_cast<ABI::Windows::Storage::Streams::IDataReader **>(winrt::put_abi(reader)));
+
+  if (FAILED(hr)) {
+    string errorMessage;
+    ErrorType errorType;
+    // See
+    // https://docs.microsoft.com/uwp/api/windows.networking.sockets.messagewebsocketmessagereceivedeventargs.getdatareader?view=winrt-22621#remarks
+    if (hr == WININET_E_CONNECTION_ABORTED) {
+      errorMessage = "[0x80072EFE] Underlying TCP connection suddenly terminated";
+      errorType = ErrorType::Connection;
+      // Note: It is not clear whether all read-related errors should close the socket.
+      Close(CloseCode::BadPayload, std::move(errorMessage));
+    } else {
+      errorMessage = Utilities::HResultToString(hr);
+      errorType = ErrorType::Receive;
+    }
+
+    self->Fail(std::move(errorMessage), errorType);
+
+    return;
+  }
+
+  try {
+    auto len = reader.UnconsumedBufferLength();
+    if (args.MessageType() == SocketMessageType::Utf8) {
+      reader.UnicodeEncoding(UnicodeEncoding::Utf8);
+      vector<uint8_t> data(len);
+      reader.ReadBytes(data);
+
+      response = string(CheckedReinterpretCast<char *>(data.data()), data.size());
+    } else {
+      auto buffer = reader.ReadBuffer(len);
+      auto data = CryptographicBuffer::EncodeToBase64String(buffer);
+
+      response = winrt::to_string(std::wstring_view(data));
+    }
+  } catch (hresult_error const &e) {
+    return self->Fail(e, ErrorType::Receive);
+  }
+
+  // Posting inside try-catch block causes errors.
+  self->m_callingQueue.Post([self, response = std::move(response), messageType = args.MessageType()]() {
+    if (self->m_readHandler) {
+      self->m_readHandler(response.length(), response, messageType == SocketMessageType::Binary);
+    }
+  });
+}
+
+void WinRTWebSocketResource2::OnClosed(IWebSocket const &sender, IWebSocketClosedEventArgs const &args) {
+  auto self = shared_from_this();
+
+  self->m_backgroundQueue.Post([self]() { self->m_readyState = ReadyState::Closed; });
+
+  self->m_callingQueue.Post([self]() {
+    if (self->m_closeHandler) {
+      self->m_closeHandler(self->m_closeCode, self->m_closeReason);
+    }
+  });
+}
+
+fire_and_forget WinRTWebSocketResource2::PerformConnect(Uri &&uri) noexcept {
+  auto self = shared_from_this();
+  auto coUri = std::move(uri);
+
+  co_await resume_in_queue(self->m_backgroundQueue);
+
+  auto async = self->m_socket.ConnectAsync(coUri);
+  co_await lessthrow_await_adapter<IAsyncAction>{async};
+
+  co_await resume_in_queue(self->m_callingQueue);
+
+  auto result = async.ErrorCode();
+
+  try {
+    if (result >= 0) { // Non-failing HRESULT
+      co_await resume_in_queue(self->m_backgroundQueue);
+      self->m_readyState = ReadyState::Open;
+
+      co_await resume_in_queue(self->m_callingQueue);
+      if (self->m_connectHandler) {
+        self->m_connectHandler();
+      }
+    } else {
+      self->Fail(std::move(result), ErrorType::Connection);
+    }
+  } catch (hresult_error const &e) {
+    self->Fail(e, ErrorType::Connection);
+  } catch (std::exception const &e) {
+    self->Fail(e.what(), ErrorType::Connection);
+  }
+
+  SetEvent(self->m_connectPerformed.get());
+}
+
+fire_and_forget WinRTWebSocketResource2::PerformClose() noexcept {
+  auto self = shared_from_this();
+
+  co_await resume_on_signal(self->m_connectPerformed.get());
+
+  co_await resume_in_queue(self->m_backgroundQueue);
+
+  // See https://developer.mozilla.org/en-US/docs/Web/API/WebSocket/close
+  co_await self->SendPendingMessages();
+
+  try {
+    self->m_socket.Close(static_cast<uint16_t>(m_closeCode), winrt::to_hstring(m_closeReason));
+    self->m_readyState = ReadyState::Closing;
+  } catch (winrt::hresult_invalid_argument const &e) {
+    Fail(e, ErrorType::Close);
+  } catch (hresult_error const &e) {
+    Fail(e, ErrorType::Close);
+  } catch (const std::exception &e) {
+    Fail(e.what(), ErrorType::Close);
+  }
+}
+
+fire_and_forget WinRTWebSocketResource2::PerformWrite(string &&message, bool isBinary) noexcept {
+  auto self = shared_from_this();
+  string coMessage = std::move(message);
+
+  co_await resume_in_queue(self->m_backgroundQueue); // Ensure writes happen sequentially
+  self->m_outgoingMessages.emplace(std::move(coMessage), isBinary);
+
+  co_await resume_on_signal(self->m_connectPerformed.get());
+
+  co_await resume_in_queue(self->m_backgroundQueue);
+
+  co_await self->SendPendingMessages();
+}
+
+IAsyncAction WinRTWebSocketResource2::SendPendingMessages() noexcept {
+  auto self = shared_from_this();
+
+  while (!self->m_outgoingMessages.empty()) {
+    if (self->m_readyState != ReadyState::Open) {
+      co_return;
+    }
+
+    size_t length = 0;
+    string messageLocal;
+    bool isBinaryLocal;
+    try {
+      std::tie(messageLocal, isBinaryLocal) = self->m_outgoingMessages.front();
+      self->m_outgoingMessages.pop();
+      if (isBinaryLocal) {
+        self->m_socket.Control().MessageType(SocketMessageType::Binary);
+
+        auto buffer = CryptographicBuffer::DecodeFromBase64String(winrt::to_hstring(messageLocal));
+        if (buffer) {
+          length = buffer.Length();
+          self->m_writer.WriteBuffer(buffer);
+        }
+      } else {
+        self->m_socket.Control().MessageType(SocketMessageType::Utf8);
+
+        length = messageLocal.size();
+        winrt::array_view<const uint8_t> view(
+            CheckedReinterpretCast<const uint8_t *>(messageLocal.c_str()),
+            CheckedReinterpretCast<const uint8_t *>(messageLocal.c_str()) + messageLocal.length());
+        self->m_writer.WriteBytes(view);
+      }
+    } catch (hresult_error const &e) { // TODO: Remove after fixing unit tests exceptions.
+      self->Fail(e, ErrorType::Send);
+      co_return;
+    } catch (const std::exception &e) {
+      self->Fail(e.what(), ErrorType::Send);
+      co_return;
+    }
+
+    auto async = self->m_writer.StoreAsync();
+    co_await lessthrow_await_adapter<DataWriterStoreOperation>{async};
+
+    auto result = async.ErrorCode();
+    if (result < 0) {
+      Fail(std::move(result), ErrorType::Send);
+    }
+  }
+}
+
+#pragma region IWebSocketResource
+
+void WinRTWebSocketResource2::Connect(string &&url, const Protocols &protocols, const Options &options) noexcept {
+  // Register MessageReceived BEFORE calling Connect
+  // https://learn.microsoft.com/en-us/uwp/api/windows.networking.sockets.messagewebsocket.messagereceived?view=winrt-22621
+  m_socket.MessageReceived([self = shared_from_this()](
+                               IMessageWebSocket const &sender, IMessageWebSocketMessageReceivedEventArgs const &args) {
+    self->OnMessageReceived(sender, args);
+  });
+
+  m_socket.Closed([self = shared_from_this()](IWebSocket const &sender, IWebSocketClosedEventArgs const &args) {
+    self->OnClosed(sender, args);
+  });
+
+  auto supportedProtocols = m_socket.Control().SupportedProtocols();
+  for (const auto &protocol : protocols) {
+    supportedProtocols.Append(winrt::to_hstring(protocol));
+  }
+
+  Uri uri{nullptr};
+  bool hasOriginHeader{false};
+  try {
+    uri = Uri{winrt::to_hstring(url)};
+
+    for (const auto &header : options) {
+      m_socket.SetRequestHeader(header.first, winrt::to_hstring(header.second));
+      if (boost::iequals(header.first, L"Origin")) {
+        hasOriginHeader = true;
+      }
+    }
+
+    // #12626 - If Origin header is not provided, set to connect endpoint.
+    if (!hasOriginHeader) {
+      auto scheme = uri.SchemeName();
+      auto host = uri.Host();
+      auto port = uri.Port();
+
+      if (scheme == L"ws") {
+        scheme = L"http";
+      } else if (scheme == L"wss") {
+        scheme = L"https";
+      }
+
+      // Only add a port if a port is defined.
+      hstring originPort = port != 0 ? L":" + winrt::to_hstring(port) : L"";
+      auto origin = hstring{scheme + L"://" + host + originPort};
+
+      m_socket.SetRequestHeader(L"Origin", std::move(origin));
+    }
+  } catch (hresult_error const &e) {
+    Fail(e, ErrorType::Connection);
+
+    SetEvent(m_connectPerformed.get());
+
+    return;
+  }
+
+  PerformConnect(std::move(uri));
+}
+
+void WinRTWebSocketResource2::Ping() noexcept {}
+
+void WinRTWebSocketResource2::Send(string &&message) noexcept {
+  PerformWrite(std::move(message), false);
+}
+
+void WinRTWebSocketResource2::SendBinary(string &&base64String) noexcept {
+  PerformWrite(std::move(base64String), true);
+}
+
+void WinRTWebSocketResource2::Close(CloseCode code, const string &reason) noexcept {
+  m_closeCode = code;
+  m_closeReason = reason;
+  PerformClose();
+}
+
+IWebSocketResource::ReadyState WinRTWebSocketResource2::GetReadyState() const noexcept {
+  return m_readyState;
+}
+
+void WinRTWebSocketResource2::SetOnConnect(function<void()> &&handler) noexcept {
+  m_connectHandler = std::move(handler);
+}
+
+void WinRTWebSocketResource2::SetOnPing(function<void()> && /*handler*/) noexcept {}
+
+void WinRTWebSocketResource2::SetOnSend(function<void(size_t)> && /*handler*/) noexcept {}
+
+void WinRTWebSocketResource2::SetOnMessage(function<void(size_t, const string &, bool isBinary)> &&handler) noexcept {
+  m_readHandler = std::move(handler);
+}
+
+void WinRTWebSocketResource2::SetOnClose(function<void(CloseCode, const string &)> &&handler) noexcept {
+  m_closeHandler = std::move(handler);
+}
+
+void WinRTWebSocketResource2::SetOnError(function<void(Error &&)> &&handler) noexcept {
+  m_errorHandler = std::move(handler);
+}
+
+#pragma endregion IWebSocketResource
+
+#pragma endregion WinRTWebSocketResource2
+
+#pragma region Legacy resource
 // private
 WinRTWebSocketResource::WinRTWebSocketResource(
     IMessageWebSocket &&socket,
@@ -331,7 +691,7 @@ void WinRTWebSocketResource::Connect(string &&url, const Protocols &protocols, c
         response = string(CheckedReinterpretCast<char *>(data.data()), data.size());
       } else {
         auto buffer = reader.ReadBuffer(len);
-        winrt::hstring data = CryptographicBuffer::EncodeToBase64String(buffer);
+        hstring data = CryptographicBuffer::EncodeToBase64String(buffer);
 
         response = winrt::to_string(std::wstring_view(data));
       }
@@ -360,7 +720,7 @@ void WinRTWebSocketResource::Connect(string &&url, const Protocols &protocols, c
     }
   }
 
-  winrt::Windows::Foundation::Collections::IVector<winrt::hstring> supportedProtocols =
+  winrt::Windows::Foundation::Collections::IVector<hstring> supportedProtocols =
       m_socket.Control().SupportedProtocols();
   for (const auto &protocol : protocols) {
     supportedProtocols.Append(winrt::to_hstring(protocol));
@@ -382,7 +742,10 @@ void WinRTWebSocketResource::Connect(string &&url, const Protocols &protocols, c
         scheme = L"https";
       }
 
-      auto origin = winrt::hstring{scheme + L"://" + host + L":" + winrt::to_hstring(port)};
+      // Only add a port if a port is defined
+      hstring originPort = port != 0 ? L":" + winrt::to_hstring(port) : L"";
+      auto origin = hstring{scheme + L"://" + host + originPort};
+
       m_socket.SetRequestHeader(L"Origin", std::move(origin));
     }
 
@@ -458,4 +821,6 @@ void WinRTWebSocketResource::SetOnError(function<void(Error &&)> &&handler) noex
 
 #pragma endregion IWebSocketResource
 
+#pragma endregion Legacy resource
+
 } // namespace Microsoft::React::Networking