I've created a new blazor server app (default Microsoft example template in Visual studio for Mac). Then in the Page folder, I've created a new subfolder "Test". Within the subfolder "Test" I've created the following files:
_Imports.razor
@layout TestTemplate
TestTemplate.razor
@inherits LayoutComponentBase
<h1>Test layout</h1>
@Body
Index.razor
@page "/test"
<h3>Hello test layout</h3>
@code {
}
When I build the solution, no errors are found. But when I open a browser and go the the url http://localhost:portnr/test, my browser keeps on rendering/hangs (infinite loop I think).
According to this document from Microsoft https://learn.microsoft.com/en-us/aspnet/core/blazor/components/layouts?view=aspnetcore-6.0 The above steps should work (see section "Apply layout to a folder".
I've checked the _Imports.razor file at the root of the project to see if there is an other reference to @layout because according to the above link this would result in an infinite loop. And the App.razor contains a reference to the MainLayout:
<Router AppAssembly="@typeof(App).Assembly">
<Found Context="routeData">
<RouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)" />
<FocusOnNavigate RouteData="@routeData" Selector="h1" />
</Found>
<NotFound>
<PageTitle>Not found</PageTitle>
<LayoutView Layout="@typeof(MainLayout)">
<p role="alert">Sorry, there's nothing at this address.</p>
</LayoutView>
</NotFound>
</Router>
Found the solution. Although it seems like an old topic, it still applies to .net core 6: https://github.com/dotnet/aspnetcore/issues/11406
So if you put the layout file in the same folder as the _Imports.razor file, it goes wrong. I've moved my TestLayout.razor to the Shared folder and it all started working.