Hi!
I am using a thrid party libary for blazor components. When i try to load a .razor file with a specific component inside it the RBS crash when rendering.
If you want to I can specify what compnonent it is but here is the error log.
[2023-06-21 14:26:46.768] [info] Checking for update
[2023-06-21 14:26:47.281] [info] Found version 1.11.2 (url: Radzen Blazor Studio Setup 1.11.2.exe)
[2023-06-21 14:27:54.436] [error] TypeError: Cannot read properties of undefined (reading 'endsWith')
After this RBS looks like this and you cannot do anything.
I am afraid the provided information is insufficient. What is the third party component? Can we get it from nuget.org? How is it configured?
From the top of my head you can exclude this component from design time via preprocessor.
1 Like
Yes!
Here is the nuget.
The Component is .
Example code:
<div class="d-flex">
<MudButton OnClick="OpenDialog" Variant="Variant.Filled" Color="Color.Primary">
Edit rating
</MudButton>
<MudRating SelectedValue="rating" Disabled="true" Class="mt-1 ml-3" />
</div>
<MudDialog @bind-IsVisible="visible" Options="dialogOptions">
<TitleContent>
<MudText Typo="Typo.h6">
<MudIcon Icon="@Icons.Material.Filled.Edit" Class="mr-3" /> Edit rating
</MudText>
</TitleContent>
<DialogContent>
<p>How awesome are inline dialogs?</p>
<MudRating @bind-SelectedValue="rating" Class="mt-3" />
</DialogContent>
<DialogActions>
<MudButton Variant="Variant.Filled" Color="Color.Primary" OnClick="Submit" Class="px-10">Close</MudButton>
</DialogActions>
</MudDialog>
@code {
private bool visible;
private int rating;
private void OpenDialog() => visible = true;
void Submit() => visible = false;
private DialogOptions dialogOptions = new() { FullWidth = true };
}
Hi @Gottegubben,
We will test and report our findings.
Can you tell us why you have chosen to use a third party library for that? Radzen Blazor Studio provides all the components out of the box already.
I got it to work as expected (it wasn't a crash though - just a compilation error):
There are a few caveats. MudBlazor uses similar types as Radzen.Blazor which leads to errors such as
error CS0104: 'Orientation' is an ambiguous reference between 'MudBlazor.Orientation' and 'Radzen.Orientation'
This is probably what happened in your application. The fix is to not add using MudBlazor; to _Imports.cshtml and add it in the page itself:
@using MudBlazor
@page "/test"
<div class="d-flex">
<MudButton OnClick="OpenDialog" Variant="MudBlazor.Variant.Filled" Color="Color.Primary">
Edit rating
</MudButton>
<MudRating SelectedValue="rating" Disabled="true" Class="mt-1 ml-3" />
</div>
<MudDialog @bind-IsVisible="visible" Options="dialogOptions">
<TitleContent>
<MudText Typo="Typo.h6">Text
</MudText>
</TitleContent>
<DialogContent>
<p>How awesome are inline dialogs?</p>
<MudRating @bind-SelectedValue="rating" Class="mt-3" />
</DialogContent>
<DialogActions>
<MudButton Variant="MudBlazor.Variant.Filled" Color="Color.Primary" OnClick="Submit" Class="px-10">Close</MudButton>
</DialogActions>
</MudDialog>
@code {
private bool visible;
private int rating;
private void OpenDialog() => visible = true;
void Submit() => visible = false;
private MudBlazor.DialogOptions dialogOptions = new() { FullWidth = true };
}
In cases when components should coexist you can either fully qualify MudBlazor components:
<MudBlazor.MudThemeProvider/>
Or fully qualify the ambiguous types:
<RadzenRow JustifyContent="Radzen.JustifyContent.Start" AlignItems="Radzen.AlignItems.Center" Gap="0">
Things work quite nicely after that - you can change properties of MudBlazor components and get visual feedback as expected.
2 Likes
I love Radzen, no doubt about that. The thing that got me to change component libary in this application was that i needed a carousel component and daterange picker. For me that was 2 dealbreaks.
Thanks alot for the testing, i really love RBS. I will test in my application now.
I reproduced the endsWith issue when trying to display the dialog in design time as well. We will add a fix for that with the very next release (in a few minutes).
1 Like
I tested with an application that already had Radzen.Blazor. If you don't have it then you won't hit the ambiguous reference error. For now you can just use preprocessor around the <MudDialog> until we release the new version of RBS.
1 Like
Thanks for the fast help! It is working as expected now.
