Fix selecting empty values in dropdown. Fixes #17735 (#17838)

This commit is contained in:
Steve Sanderson 2019-12-13 10:22:51 +00:00 committed by GitHub
parent fde783911b
commit 4310fa72f7
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 18 additions and 6 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -372,7 +372,7 @@ export class BrowserRenderer {
}
case 'OPTION': {
const value = attributeFrame ? frameReader.attributeValue(attributeFrame) : null;
if (value) {
if (value || value === '') {
element.setAttribute('value', value);
} else {
element.removeAttribute('value');

View File

@ -214,6 +214,11 @@ namespace Microsoft.AspNetCore.Components.E2ETest.Tests
Browser.FindElement(By.Id("select-box-add-option")).Click();
Browser.Equal("Fourth", () => boundValue.Text);
Assert.Equal("Fourth choice", target.SelectedOption.Text);
// Verify we can select options whose value is empty
// https://github.com/aspnet/AspNetCore/issues/17735
target.SelectByText("Empty value");
Browser.Equal(string.Empty, () => boundValue.Text);
}
[Fact]
@ -227,6 +232,11 @@ namespace Microsoft.AspNetCore.Components.E2ETest.Tests
// Modify target; verify value is updated
target.SelectByText("Third choice");
Browser.Equal("Third", () => boundValue.Text);
// Verify we can select options whose value is empty
// https://github.com/aspnet/AspNetCore/issues/17735
target.SelectByText("Empty value");
Browser.Equal(string.Empty, () => boundValue.Text);
}
[Fact]

View File

@ -229,6 +229,7 @@
<select id="select-box" @bind="selectValue">
<optgroup label="Some choices">
<!-- Show it also works with optgroup -->
<option value="">Empty value</option>
<option value=@SelectableValue.First>First choice</option>
<option value=@SelectableValue.Second>Second choice</option>
<option value=@SelectableValue.Third>Third choice</option>
@ -246,6 +247,7 @@
<p>
<select id="select-markup-box" @bind="selectMarkupValue">
<optgroup label="Some choices">
<option value="">Empty value</option>
<option value="First">First choice</option>
<option value="Second">Second choice</option>
<option value="Third">Third choice</option>
@ -368,8 +370,8 @@
bool includeFourthOption = false;
enum SelectableValue { First, Second, Third, Fourth }
SelectableValue selectValue = SelectableValue.Second;
SelectableValue selectMarkupValue = SelectableValue.Second;
SelectableValue? selectValue = SelectableValue.Second;
SelectableValue? selectMarkupValue = SelectableValue.Second;
void AddAndSelectNewSelectOption()
{