Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix/date picker ok button #2531

Merged

Conversation

Alexbits
Copy link
Contributor

@Alexbits Alexbits commented Jun 19, 2022

🤔 This is a ...

  • New feature
  • Bug fix
  • Site / documentation update
  • Demo update
  • Component style update
  • Bundle size optimization
  • Performance optimization
  • Refactoring
  • Code style optimization
  • Test Case
  • Branch merge
  • Other (about what?)

🔗 Related issue link

#2496
#2481
#2441
#1990

💡 Background and solution

This PR Makes Ok button behavior closer to the ant.design

📝 Changelog

Language Changelog
🇺🇸 English
🇨🇳 Chinese

☑️ Self Check before Merge

⚠️ Please check all items below before review. ⚠️

  • Doc is updated/provided or not needed
  • Demo is updated/provided or not needed
  • Changelog is provided or not needed

@github-actions
Copy link

github-actions bot commented Jun 19, 2022

@codecov
Copy link

codecov bot commented Jun 19, 2022

Codecov Report

Merging #2531 (8eb7d13) into feature (3df40f2) will increase coverage by 1.72%.
The diff coverage is 25.84%.

@@             Coverage Diff             @@
##           feature    #2531      +/-   ##
===========================================
+ Coverage    27.62%   29.34%   +1.72%     
===========================================
  Files          498      536      +38     
  Lines        33688    26018    -7670     
  Branches         0      260     +260     
===========================================
- Hits          9305     7636    -1669     
+ Misses       24383    18342    -6041     
- Partials         0       40      +40     
Impacted Files Coverage Δ
components/date-picker/DatePicker.razor 66.66% <0.00%> (ø)
components/date-picker/RangePicker.razor 0.00% <0.00%> (ø)
components/date-picker/RangePicker.razor.cs 0.00% <0.00%> (ø)
...date-picker/internal/DatePickerDatetimePanel.razor 0.00% <ø> (ø)
...e-picker/internal/DatePickerDatetimePanel.razor.cs 0.00% <0.00%> (ø)
components/date-picker/internal/DatePickerBase.cs 44.58% <27.65%> (-0.51%) ⬇️
components/date-picker/DatePicker.Razor.cs 63.75% <54.54%> (-4.47%) ⬇️
...omponents/date-picker/internal/DatePickerStatus.cs 75.00% <75.00%> (-25.00%) ⬇️
...ponents/date-picker/internal/DatePickerInput.razor 78.37% <100.00%> (+17.08%) ⬆️
components/core/Helpers/MemberPath/PathNode.cs 46.15% <0.00%> (-8.85%) ⬇️
... and 447 more

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 3df40f2...8eb7d13. Read the comment docs.

@Alexbits
Copy link
Contributor Author

Added fix for #2441, #1990

@Alexbits
Copy link
Contributor Author

Hey @ElderJames I have a question regarding the unit test below. The code it covers prevents manually entered values from being applied. So when you manually enter a time value for example it always reverted back. Why?

[Fact]
public void DefaultValue_applied_to_value_on_blur()
{
//Arrange
JSInterop.SetupVoid(JSInteropConstants.AddPreventKeys, _ => true);
DateTime value = DateTime.MinValue;
DateTime defaultValue = new DateTime(2020,1,1);
string defaultValueAsString = defaultValue.ToString("yyyy-MM-dd");
var cut = Render<AntDesign.DatePicker<DateTime>>(
@<DatePicker @bind-Value="@value" DefaultValue="@defaultValue" />
);
//Act
var input = cut.Find("input");
input.Input(defaultValue.AddDays(1).ToString("yyyy-MM-dd"));
input.Blur();
//Assert
cut.Instance.Value.Should().Be(defaultValue);
value.Should().Be(defaultValue);
input.GetAttribute("value").Should().Be(defaultValueAsString);

The code it covers

protected void OnInput(ChangeEventArgs args, int index = 0)
{
if (index != 0)
{
throw new ArgumentOutOfRangeException("DatePicker should have only single picker.");
}
if (args == null)
{
return;
}
if (!_duringManualInput)
{
_duringManualInput = true;
_cacheDuringInput = Value;
}
if (FormatAnalyzer.TryPickerStringConvert(args.Value.ToString(), out TValue changeValue, IsNullable))
{
CurrentValue = changeValue;
GetIfNotNull(changeValue, (notNullValue) =>
{
PickerValues[0] = notNullValue;
});
StateHasChanged();
}
}
protected override async Task OnBlur(int index)
{
if (_openingOverlay)
return;
if (_duringManualInput)
{
if (!Value.Equals(_cacheDuringInput))
{
//reset picker to Value
CurrentValue = _cacheDuringInput;
_pickerStatus[0]._hadSelectValue = !(Value is null && (DefaultValue is not null || DefaultPickerValue is not null));
GetIfNotNull(Value ?? DefaultValue ?? DefaultPickerValue, (notNullValue) =>
{
PickerValues[0] = notNullValue;
});
}
_duringManualInput = false;
}
AutoFocus = false;
return;
}

I believe it should only be reverted when parsing fails and if this is not the case the _cacheDuringInput should be set to the parsed value so it will not be reverted during OnBlur

@ElderJames
Copy link
Member

I believe it should only be reverted when parsing fails and if this is not the case the _cacheDuringInput should be set to the parsed value so it will not be reverted during OnBlur

Hi @Alexbits , I agree with you.

@Alexbits Alexbits changed the title Fix/date picker ok button fix/date picker ok button Jun 29, 2022
@ElderJames ElderJames merged commit 26ff941 into ant-design-blazor:feature Jun 29, 2022
ElderJames pushed a commit that referenced this pull request Sep 6, 2022
…ue (#2531)

* fix(module: datepicker): Ok button does not confirm selected time value

* fix(module: datepicker): value stays in the input after clear clicked

* fix(module: datepicker): suffix icon click does not open input panel

* fix(module: datepicker): manual input reverted on blur

* fix(module: datepicker): wrong behavior when Open is set to true
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
2 participants