Skip to content

Conversation

Copilot
Copy link
Contributor

@Copilot Copilot AI commented Sep 25, 2025

Fixes hot reload functionality for Blazor applications running inside iframes by allowing Sec-Fetch-Dest: frame and Sec-Fetch-Dest: iframe requests to trigger browser refresh script injection.

Problem

Hot Reload on Blazor apps doesn't work inside iframes because the BrowserRefreshMiddleware.IsBrowserDocumentRequest() method only accepts requests with Sec-Fetch-Dest: document. Requests from iframes use Sec-Fetch-Dest: frame or Sec-Fetch-Dest: iframe, causing the middleware to reject them and skip script injection.

This prevents hot reload from working in scenarios like:

  • Blazing Story (Storybook clone for Blazor) which hosts component previews in iframes
  • Any other tooling that embeds Blazor apps within iframe contexts

Solution

Updated the IsBrowserDocumentRequest method to also accept "frame" and "iframe" values for the Sec-Fetch-Dest header, in addition to the existing "document" value. This allows the browser refresh middleware to inject hot reload scripts into iframe-embedded Blazor applications.

The change is minimal and surgical - it only adds two additional string comparisons to the existing validation logic without affecting any other functionality.

Testing

  • Updated existing tests to reflect the new behavior
  • Split the test case to validate that frame/iframe requests now return true while other values like "serviceworker" still return false
  • All 104 tests in the BrowserRefresh test suite pass

Addresses the "escape hatch" API request mentioned in the original issue for enabling hot reloading in iframe scenarios.

Original prompt

This section details on the original issue you should resolve

<issue_title>[Hot Reload] Enable hot reloading for Blazor inside an iframe</issue_title>
<issue_description>## Description

Hot Reload on a Blazor app doesn't work inside an iframe. See the attached video and sample code.

2024-02-29_08h08_22.mp4

Sample code: 📦BlazorWasmApp1.zip

The solution I'd like

I know this is intentional by design, as mentioned in the pull request: #21954. However, some edge cases exist where hot reloading support inside an iframe is essential. For instance, the clone of Storybook for Blazor, "Blazing Story" (https://github.com/jsakamoto/BlazingStory), requires such ability because it has to host a preview of the story using an iframe.

image

Therefore, I hope we have a public "escape hatch" API allowing developers to explicitly enable hot reloading inside an iframe for such a particular scenario.</issue_description>

<agent_instructions>
Update

!string.Equals(values[0], "document", StringComparison.OrdinalIgnoreCase))
to include the "frame" and "iframe" values for the Sec-Fetch-Dest header.</agent_instructions>

Comments on the Issue (you are @copilot in this section)

@MackinnonBuck We might be able to address this in one of two ways: 1. Update [this line](https://github.com/dotnet/sdk/blob/92f29cd70039b793cdcaf2321fa9bff95afc3ec1/src/BuiltInTools/BrowserRefresh/BrowserRefreshMiddleware.cs#L72) to include the "frame" and "iframe" values for the `Sec-Fetch-Dest` header. 2. Address this as part of https://github.com/dotnet/aspnetcore/issues/45213
Fixes #51005

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

@Copilot Copilot AI changed the title [WIP] [Hot Reload] Enable hot reloading for Blazor inside an iframe Enable hot reloading for Blazor inside an iframe Sep 25, 2025
@Copilot Copilot AI requested a review from javiercn September 25, 2025 11:01
Copilot finished work on behalf of javiercn September 25, 2025 11:01
Co-authored-by: javiercn <6995051+javiercn@users.noreply.github.com>
@javiercn javiercn force-pushed the copilot/fix-37a732d4-400a-4c31-b3ca-a17bd2f7abcf branch from b5cd38b to 738eccb Compare September 26, 2025 14:38
@lewing lewing marked this pull request as ready for review October 7, 2025 10:54
@lewing lewing requested a review from a team as a code owner October 7, 2025 10:54
@Copilot Copilot AI review requested due to automatic review settings October 7, 2025 10:54
Copy link
Contributor

@Copilot Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull Request Overview

This PR enables hot reload functionality for Blazor applications running inside iframes by expanding the accepted Sec-Fetch-Dest header values in the browser refresh middleware. Previously, only "document" requests would trigger script injection, but iframe contexts use "frame" or "iframe" values, preventing hot reload from working in tools like Blazing Story.

  • Updated IsBrowserDocumentRequest method to accept "frame" and "iframe" Sec-Fetch-Dest header values
  • Added comprehensive test coverage for the new frame/iframe functionality
  • Maintained existing behavior for all other header values

Reviewed Changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated no comments.

File Description
src/BuiltInTools/BrowserRefresh/BrowserRefreshMiddleware.cs Modified header validation logic to include frame and iframe requests
test/Microsoft.AspNetCore.Watch.BrowserRefresh.Tests/BrowserRefreshMiddlewareTest.cs Added new test case to verify frame/iframe requests return true

@lewing lewing merged commit b9f441a into main Oct 7, 2025
28 checks passed
@lewing lewing deleted the copilot/fix-37a732d4-400a-4c31-b3ca-a17bd2f7abcf branch October 7, 2025 10:55
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Hot Reload] Enable hot reloading for Blazor inside an iframe

4 participants