Troubleshooting

  • 7 minutes to read

This topic describes common issues and steps you can follow to diagnose and resolve these issues. If the solutions listed here do not help, create a ticket in our Support Center.

Common Issues

Update to a New Version

If an error occurs after you upgraded DevExpress Blazor components to a newer version, review the list of breaking changes and update your project accordingly. Also make sure that you configure the project as described in this section: Install Components and Create an Application.

An unhandled exception on the current circuit

You may see the following error message about an exception on the current circuit:

There was an unhandled exception on the current circuit, so this circuit will be terminated. For more information, turn on detailed exceptions in 'CircuitOptions.DetailedErrors'.

To get more information about the error, add the following code to the ConfigureServices method declared in the Startup.cs file:

services.AddServerSideBlazor().AddCircuitOptions(options => { options.DetailedErrors = true; });

System.ArgumentNullException: 'X' requires a value for the 'Expression' property

This is a common Blazor exception that occurs if an EditForm's editor does not use two-way binding.

DevExpress.Blazor.DxComboBox requires a value for the 'ValueExpression' property. It is specified automatically when you use two-way binding ('bind-Value').

To fix the issue, do one of the following:

  • Specify the Expression property for the properties you use. For example, if you use the Value property and the ValueChanged event separately, also specify the ValueExpression property.
    <DxComboBox Data="@Strings"
        Value="@Value" 
        ValueChanged="@ValueChanged"
        ValueExpression="@(() => Value )">
    </DxComboBox>
    
  • Implement the two-way binding in the EditForm.

Could not find 'X' in 'window.DxBlazor'.

In the previous versions of Blazor components, users had to add the client scripts. In the latest versions, we distribute the scripts via the NuGet Package in the _content/DevExpress.Blazor folder. If you reference an older version of our static files, you may encounter a similar issue:

Error: Microsoft.JSInterop.JSException: Could not find 'FormLayout' in 'window.DxBlazor'.
Error: Could not find 'FormLayout' in 'window.DxBlazor'.

We recommend that you use the latest versions of our components distributed from NuGet Packages.

Failed to load resource

DevExpress Blazor components use an RCL (Razor class library) with static assets to share resources. The following exception occurs if your application does not load client-side resources correctly:

Failed to load resource: the server responded with a status of 404 () - dx-blazor.js
Failed to load resource: the server responded with a status of 404 () - dx-blazor.css

To fix this issue, review the following topic: Consume content from a referenced RCL.

.NET 5.0: Operation is not valid due to the current state of the object

When you use .NET 5.0 RC 1 and try to publish a Blazor project, the following exception can occur:

System.InvalidOperationException: Operation is not valid due to the current state of the object

This issue relates to the internal code of .NET 5.0. For more information, refer to the following issue in the linker's repository: Generic type array causes InvalidOperationException in ReflectionMethodBodyScanner.GetValueNodeFromGenericArgument.

To resolve this issue, try to disable the trimming feature. In your *.csproj file, disable the PublishTrimmed flag.

<Project Sdk="Microsoft.NET.Sdk.BlazorWebAssembly">
    <PropertyGroup>
        <TargetFramework>net5.0</TargetFramework>
        ...
        <PublishTrimmed>false</PublishTrimmed>
    </PropertyGroup>
    ...
</Project>

The child content element 'ChildContent' of component 'X' uses the same parameter name ('context') ...

When you nest DevExpress Blazor components that contain RenderFragment<TValue> properties, a Razor error can occur. For example, the following code nests a DxButton component within a DxFormLayoutItem component.

<DxFormLayoutItem>
    <Template>
        <DxButton>OK</DxButton>
    </Template>
</DxFormLayoutItem>

Both components include properties that specify render fragments: DxFormLayoutItem's Template and DxButton's ChildContent. This means that Blazor adds Context implicit parameters to each component:

<DxFormLayoutItem>
    <Template Context="context">
        <DxButton Context="context">OK</DxButton>
    </Template>
</DxFormLayoutItem>

The Context parameters have the same default value. This causes the following error:

Error RZ9999 The child content element 'ChildContent' of component 'DxButton' uses the same parameter name ('context') as enclosing child content element 'Template' of component 'DxFormLayoutItem'. Specify the parameter name like: '<ChildContent Context="another_name">' to resolve the ambiguity.

To fix the issue, specify the Context parameter explicitly in one of the components:

<DxFormLayoutItem>
    <Template>
        <DxButton Context="buttonCtx">OK</DxButton>
    </Template>
</DxFormLayoutItem>

Run Demo: Data Grid - Edit Form Template with Validation

Duplicate @key values in the if/else statement

If you use the same @key value for different HTML elements in the if/else statement, your code can produce incorrect behavior (for instance, styles and classes assigned to these elements are lost). For more information, refer to the following issue: Duplicate @key values don't throw clear exception in if/else case.

The following code snippet creates the EditTemplate for the Data Grid's Availability column. A user can change the initial checkbox state in the edit form, but if the user clicks the checkbox again, it is replaced with the standard column editor.

<DxDataGrid Data="@DataSource" ...>
    <DxDataGridColumn Field="@nameof(Product.Availability)" Caption="Availability" Width="150px">
        <EditTemplate>
            @{
                var dataItem = ((CellEditContext)context).DataItem;
                var inStock = (bool)((CellEditContext)context).CellValue;
                if (inStock)
                {
                    <input @key="@dataItem" type="checkbox" @onchange=@(args => 
                      { ((CellEditContext)context).OnChanged(args.Value); }) checked />
                }
                else
                {
                    <input @key="@dataItem" type="checkbox" @onchange=@(args => 
                      { ((CellEditContext)context).OnChanged(args.Value); }) />
                }
            }
          </EditTemplate>
    </DxDataGridColumn>            
</DxDataGrid>

To fix the issue, use unique @key values within the same if/else statement.

InvalidOperationException

If you use Blazor WebAssemly Data Grid, you may see the following exception in a browser:

System.InvalidOperationException: No generic method 'Take' on type 'System.Linq.Queryable' is compatible with the supplied type arguments and arguments.

To resolve this issue, do one of the following:

  • Set the BlazorWebAssemblyEnableLinking property to false in the project file to disable the link with an MSBuild property.
    <PropertyGroup>
    ...
      <BlazorWebAssemblyEnableLinking>false</BlazorWebAssemblyEnableLinking>
    </PropertyGroup>
    
  • Add the LinkerConfig.xml file and include the following code:
    <?xml version="1.0" encoding="UTF-8" ?>
    ...
    <linker>
      <assembly fullname="mscorlib">
      ...
        <type fullname="System.Threading.WasmRuntime" />
      </assembly>
      <assembly fullname="System.Core">
      ...
        <type fullname="System.Linq.Expressions*" />
        <type fullname="System.Linq.Queryable*" />
        <type fullname="System.Linq.Enumerable*" />
        <type fullname="System.Linq.EnumerableRewriter*" />
      </assembly>
      ...
      <assembly fullname="[PUT YOUR ASSEMBLY NAME HERE]" />
    </linker>
    
    Then specify this file as an MSBuild item in the project file.
    <ItemGroup>
      ...
      <BlazorLinkerDescriptor Include="LinkerConfig.xml" />
    </ItemGroup>
    

See the following topic for more information: Configure the Linker for ASP.NET Core Blazor.

The type arguments cannot be inferred from the usage

The DataAsync property allows you to bind the Data Grid to a strongly typed collection that is loaded asynchronously (for instance, from an HTTP request). This property specifies an asynchronous function that loads data. The following exception occurs if you declare a function with an incorrect signature:

The type arguments for method 'TypeInference.CreateDxDataGrid_0<T>' cannot be inferred from the usage. Try specifying the type arguments explicitly.

To resolve the issue, ensure that the function signature meets the following requirements:

  • The type of the returned value is Task<IEnumerable<T>>.
  • The function has a parameter of the CancellationToken type.
@using System.Threading

<DxDataGrid DataAsync="@GetForecastAsync">
</DxDataGrid>

@code {
    public class WeatherForecast {
        // ...
    }

    public Task<IEnumerable<WeatherForecast>> GetForecastAsync(CancellationToken ct = default) {
        // ...
    }
}

MissingMethodException

You may see the following exception in a browser when you use Blazor WebAssembly Scheduler:

System.MissingMethodException: Constructor on type 'System.ComponentModel.Int32Converter' not found.

To resolve this issue, do one of the following:

  • Set the BlazorWebAssemblyEnableLinking property to false in the project file to disable the link with an MSBuild property.
    <PropertyGroup>
    ...
      <BlazorWebAssemblyEnableLinking>false</BlazorWebAssemblyEnableLinking>
    </PropertyGroup>
    
  • Add the LinkerConfig.xml file and include the following code:
    <?xml version="1.0" encoding="UTF-8" ?>
    ...
    <linker>
      ...
      <assembly fullname="System">
          <!-- Use this line to include the entire assembly. -->
          <type fullname="System.ComponentModel*" />
          <!-- Uncomment the following lines to include individual types. -->
          <!-- <type fullname="System.ComponentModel.Int32Converter*" />
          <type fullname="System.ComponentModel.BooleanConverter*" />
          <type fullname="System.ComponentModel.DateTimeConverter*" />
          <type fullname="System.ComponentModel.StringConverter*" /> -->
          ...
      </assembly>
    </linker>
    
    Then specify this file as an MSBuild item in the project file.
    <ItemGroup>
      ...
      <BlazorLinkerDescriptor Include="LinkerConfig.xml" />
    </ItemGroup>
    

See the following topic for more information: Configure the Linker for ASP.NET Core Blazor.

Tabs are rendered incorrectly when the default Microsoft template is applied

If you create a new Blazor project based on the default Microsoft project template, the first tab of the DxTabs component can be rendered incorrectly.

See the following Microsoft issues that cause this behavior:

To resolve the issue, specify strict style rules in the site.css file to apply .navbar templates only.