The fix work in a demo project, but not in the test.

In test, ElementReferenceExtensions.MudGetBoundingClientRectAsync return always null for HeaderCell.
I don't know why.

I just see a difference in the tag of the header :

In the demo (where it works) :

<th scope="col" class="mud-table-cell" style="" colspan="1" _bl_4cb3ad82-3a91-4780-838d-12652c54752e="">

In the demo (where it don't work) :

<th scope="col" class="mud-table-cell" style="" colspan="1" blazor:elementReference="">

Sound like blazor:elementReference isn't translated in the test.

Does anyone have any hints?

The test display a data grid with 3 columns. When a column is hidden, the element reference on <th> disappears :

...
// Open column menu
var columnMenu = comp.FindAll("th .mud-menu button").ElementAt(1);
columnMenu.Click();

// Click on 'Hide' menu item
comp.WaitForAssertion(() => comp.FindAll(".mud-list-item").ElementAt(1));
var hideMenuItem = comp.FindAll(".mud-list-item").ElementAt(1);
hideMenuItem.InnerHtml.Contains("Hidde");

var thBeforeHidde = comp.Find("th").OuterHtml;
// <th scope="col" class="mud-table-cell" style="" colspan="1" blazor:elementreference="101ba4cb-9363-4b36-bfe1-7a904c3349a8">
hideMenuItem.Click();
var thAfterHidde = comp.Find("th").OuterHtml;
// <th scope="col" class="mud-table-cell" style="" colspan="1" blazor:elementreference="">

In test, ElementReferenceExtensions.MudGetBoundingClientRectAsync return always null for HeaderCell.
I don't know why.

MudGetBoundingClientRectAsync calls a JavaScript method mudElementRef.getBoundingClientRect, since bUnit doesn't support Js invocation, you need to mock it to return whatever you desire:

Context.JSInterop.Setup<int>("mudElementRef.getBoundingClientRect").SetResult(new BoundingClientRect(...?));

More info here: https://bunit.dev/docs/test-doubles/emulating-ijsruntime.html

@ScarletKuro, thank. It's worked and it progress.

Now, I need to simulate the mouse move.
The datagrid listen the global event document.pointermove by EventListener.

Have you a hint/example to mock it?

I don't think you can really simulate the pointer* events in bUnit: bUnit-dev/bUnit#1497

You need to do it on a different level, either on the DataGridColumnResizeService or the IEventListener level.

As I understand the datagrid subscribes to event:

And then the EventListener fires the OnEventOccur when the even acquires:

And it invokes this lambda OnApplicationPointerMove(eventArgs, rightToLeft).
Technically you could just simulate the OnEventOccur similarly on how I'm doing it with the IBrowserViewportObserver:

I'm just invoking the method directly in the test and the RaiseOnResized is also an [JSInvokable].

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 90.63%. Comparing base (28bc599) to head (b8eb58a).
Report is 436 commits behind head on dev.

@@            Coverage Diff             @@
##              dev    #9643      +/-   ##
==========================================
+ Coverage   89.82%   90.63%   +0.80%     
==========================================
  Files         412      406       -6     
  Lines       11878    12786     +908     
  Branches     2364     2474     +110     
==========================================
+ Hits        10670    11588     +918     
+ Misses        681      640      -41     
- Partials      527      558      +31     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

I think last commit contains things that it shouldn't.
I see you have a separate project for testing, I think in future you can use the MudBlazor.UnitTests.Viewer directly, if you add a test component with XYZTest naming, you can start this project and find this test and play with it.

I think last commit contains things that it shouldn't.

My mistake... I forget to select files before commit... so demo projects were pushed. It's cleaned.

you can use the MudBlazor.UnitTests.Viewer directly

Thank for the tip.

Finally, the test reproduces the bug.
@ScarletKuro, thank for the help.

@ScarletKuro, thank for the help.

Thanks for the fix. That fix makes sense, all read and writes should be done via the hidden state not the parameter, and apparently there is one more place where parameter is used instead of the state.

@ScarletKuro, nice catch.

Column.Hidden is also used in SelectColumn.razor and HierarchyColumn.razor.
The razor template need to use the parameter property or the parameter state field?

Column.Hidden is also used in SelectColumn.razor and HierarchyColumn.razor.

This ones are fine.

Thanks.

It's interesting that EventListener is transient. I would make it a singleton so that if two components subscribe on same event, you could have one subscription on the JavaScript side and two on the C# side, rather than a 1:1 ratio. Something similar does the IBrowserViewportObserver.
It would allow to use:

var eventListener = (EventListener)Context.Services.GetRequiredService<IEventListener>();

in tests.
But that's a totally different topic.