[DatePicker, Calendar] Fix not updating correctly when used with EditContext

[msb-incom]

Pull Request

📖 Description

When using a FluentDatePicker or FluentCalender inside an EditContext, there are issues with selecting a new value in the Year-view of the calendar. My diagnosis suggests that this comes down to a race condition-like issue between invoking ValueChanged and also notifying the EditContext about changes which will propagate the "old" value to the component through the parameters being updated.

The changes I propose changes the approach for updating value of the FluentCalendar (and thus FluentDatePicker) by utilizing SetCurrentValueAsync available on FluentInputBase. This approach is similar to other components where SetCurrentValueAsync is called as part of ChangeHandlerAsync.

The changes proposed fixes the issue.

🎫 Issues

https://github.com/microsoft/fluentui-blazor/issues/2046

👩‍💻 Reviewer Notes

📑 Test Plan

I tested all the DatePicker/Calendar examples in the sample project.

✅ Checklist

General

• [ ] I have added tests for my changes.
• [x] I have tested my changes.
• [ ] I have updated the project documentation to reflect my changes.
• [x] I have read the CONTRIBUTING documentation and followed the standards for this project.

Component-specific

• [ ] I have added a new component
• [ ] I have added Unit Tests for my new compontent
• [x] I have modified an existing component
• [x] I have validated the Unit Tests for an existing component

⏭ Next Steps

[msb-incom]

@microsoft-github-policy-service agree

@microsoft-github-policy-service agree

[dvoituron]

That sounds about right. Give me time to check all this before approving the PR. Good work!

[msb-incom]

It seems it is in fact not passing tests. The reason seems to be that selecting the same month after going to month view will give the same value causing SetCurrentValueAsync to return early without notifying about the field change. I'll look into alternative options 🙂

[msb-incom]

I fixed above mentioned problem by extending and utilizing OnSelectedDateHandlerAsync rather than using SetCurrentValueAsync. This is now more similar to how it was before my change. However, an alternative could be to extend FluentInputBase with the CheckIfSelectedValueHasChanged from FluentCalendarBase and use that parameter when checking for value change. However this only seemed to be a requirement for the FluentCalendar, so it didn't seem appropriate to let that requirement go all the way up and mess with the design of the FluentInputBase 🙂

[vnbaaij]

However, an alternative could be to extend FluentInputBase with the CheckIfSelectedValueHasChanged from FluentCalendarBase and use that parameter when checking for value change. However this only seemed to be a requirement for the FluentCalendar, so it didn't seem appropriate to let that requirement go all the way up and mess with the design of the FluentInputBase 🙂

Yes, let's not do that. 😀

[msb-incom]

@dvoituron Thanks for taking the time to review the PR! And let me also use this opportunity to thank you and the other collaborators for providing an incredibly useful library that makes for very swift Blazor development 💪