Hacktoberfest 2026: the issues maintainers tagged for October, open and beginner-friendly. Browse Hacktoberfest issues

fix: `OverflowChangedItem` deserialization failure for trimmed WASM standalone apps in `FluentOverflow`

Closed Beginner friendly
#5,427 0 comments 0 reactions 0 assignees View on GitHub

Maintainers usually reply within 1 day

Nobody has claimed this yet.

Assessment

Difficulty
2/5
Estimated time
1-3 hours
Newbie friendliness
72/100
Issue type
Bug
Clarity
Clearly specified
Activity status
Active
Tech stack
csharp, wasm
Domain
frontend

Research direction

Start from the OverflowChangedItem class and the OverflowChangedEventArgs it is deserialized into, both in the Fluent UI Blazor library, and check how FluentUIJsonSerializerContext lists them. Run the linked DL444/DL444.EventDeserializationRepro with a trimmed or AOT WASM publish to reproduce the DeserializeNoConstructor error. Done means the overflow badge shows the correct count and the tooltip lists hidden items in a published build.

Written by the indexing model from the issue text.

Description

🐛 Bug Report

The OverflowChangedItem class is not annotated with [DynamicallyAccessedMembers(DynamicallyAccessedMemberTypes.PublicParameterlessConstructor)] so its default constructor will be trimmed away in a WASM standalone app published with trimming (or AOT) enabled.

This causes deserialization failure for OverflowChangedEventArgs when the @onoverflowchange event fires from the JS side of FluentOverflow, so the .NET side never receives the event, breaking overflow functionalities.

💻 Repro or Code Sample

Check out a minimal reproducible sample at DL444/DL444.EventDeserializationRepro.

  1. Run the app in Debug mode locally. Adjust the window size and see that FluentOverflow works normally.
  2. Publish the app in release mode, and run the published standalone app with dotnet serve tool or other equivalents. Again, adjust the window size and check the behavior.

🤔 Expected Behavior

Overflowing works normally, and a badge with "+X" appears when items overflow the window width. Hovering on the badge reveals hidden items.

😯 Current Behavior

The badge always shows "+0", and hovering on it shows an empty tooltip. Open the console to see that the following error is logged:

Uncaught (in promise) Error: System.InvalidOperationException: There was an error parsing the event arguments. EventId: '1'.
---> System.NotSupportedException: DeserializeNoConstructor, JsonConstructorAttribute, Microsoft.FluentUI.AspNetCore.Components.OverflowChangedItem Path: $.items[0] | LineNumber: 0 | BytePositionInLine: 27.

💁 Possible Solution

Annotate the class with [DynamicallyAccessedMembers(DynamicallyAccessedMemberTypes.PublicParameterlessConstructor)].

I'm willing to contribute if desired.

A workaround in the meantime is to override build-time class binding to a local, annotated class by adding the following file:

using System.Diagnostics.CodeAnalysis;

namespace Microsoft.FluentUI.AspNetCore.Components;

public class OverflowChangedEventArgs : EventArgs
{
    public string? Id { get; set; }
    public IReadOnlyList<OverflowChangedItem>? Items { get; set; }
    public int OverflowCount { get; set; }
}

[DynamicallyAccessedMembers(DynamicallyAccessedMemberTypes.PublicParameterlessConstructor)]
public class OverflowChangedItem
{
    public string? Id { get; set; }
    public string? Text { get; set; }
    public int Index { get; set; }
}

The compiler should automatically bind to this annotated class instead. Of course, this introduces a type conflict and should not be relied on for the long run.

🔦 Context

This issue prevents me from using FluentOverflow in a trimmed WASM standalone app without a workaround.

Checking all the classes listed for FluentUIJsonSerializerContext (not seen being used except for tests), I think the KeyPress class might have the same issue. But I have not tested this.

🌍 Your Environment

  • OS & Device: Windows PC
  • Browser: Microsoft Edge
  • .NET and Fluent UI Blazor library Version: Fluent Blazor 5.0.0 on .NET 10.0.12
Dominant language
C#
Stars
4.9k
Forks
493
Avg merge
21h 50m
Merged PRs (30d)
74

Getting set up

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from microsoft/fluentui-blazor

All issues in microsoft/fluentui-blazor

Similar issues

More C# issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.