Add some tests for invalid data

src/Components/test/E2ETest/Tests/BindTest.cs

@@ -2,7 +2,6 @@
 // Licensed under the Apache License, Version 2.0. See License.txt in the project root for license information.
 
 using System;
-using System.Globalization;
 using BasicTestApp;
 using Microsoft.AspNetCore.Components.E2ETest.Infrastructure;
 using Microsoft.AspNetCore.Components.E2ETest.Infrastructure.ServerFixtures;
@@ -877,5 +876,147 @@ namespace Microsoft.AspNetCore.Components.E2ETest.Tests
             Browser.Equal(string.Empty, () => boundValue.Text);
             Assert.Equal(string.Empty, mirrorValue.GetAttribute("value"));
         }
+
+        // For date comparisons, we parse (non-formatted) values to compare them. Client-side and server-side
+        // Blazor have different formatting behaviour by default.
+        [Fact]
+        public void CanBindTextboxNullableDateTime_InvalidValue()
+        {
+            var target = Browser.FindElement(By.Id("textbox-nullable-datetime-invalid"));
+            var boundValue = Browser.FindElement(By.Id("textbox-nullable-datetime-invalid-value"));
+            var mirrorValue = Browser.FindElement(By.Id("textbox-nullable-datetime-invalid-mirror"));
+            Assert.Equal(string.Empty, target.GetAttribute("value"));
+            Assert.Equal(string.Empty, boundValue.Text);
+            Assert.Equal(string.Empty, mirrorValue.GetAttribute("value"));
+
+            // Modify target; verify value is updated and that textboxes linked to the same data are updated
+            var expected = new DateTime(2000, 1, 2);
+            target.SendKeys("01/02/2000 00:00:00\t");
+            Browser.Equal(expected, () => DateTime.Parse(boundValue.Text));
+            Assert.Equal(expected, DateTime.Parse(mirrorValue.GetAttribute("value")));
+
+            // Modify target to something invalid - the invalid change is reverted
+            // back to the last valid value
+            target.SendKeys(Keys.Control + "a"); // select all
+            target.SendKeys("05/06A");
+            Browser.Equal("05/06A", () => target.GetAttribute("value"));
+            target.SendKeys("\t");
+            Browser.Equal(expected, () => DateTime.Parse(target.GetAttribute("value")));
+            Assert.Equal(expected, DateTime.Parse(boundValue.Text));
+            Assert.Equal(expected, DateTime.Parse(mirrorValue.GetAttribute("value")));
+
+            // Now change it to something valid
+            target.SendKeys(Keys.Control + "a"); // select all
+            target.SendKeys("05/06\t");
+            expected = new DateTime(DateTime.Now.Year, 5, 6);
+            Browser.Equal(expected, () => DateTime.Parse(boundValue.Text));
+            Assert.Equal(expected, DateTime.Parse(mirrorValue.GetAttribute("value")));
+        }
+
+        // For date comparisons, we parse (non-formatted) values to compare them. Client-side and server-side
+        // Blazor have different formatting behaviour by default.
+        [Fact]
+        public void CanBindTextboxDateTimeOffset_InvalidValue()
+        {
+            var target = Browser.FindElement(By.Id("textbox-datetimeoffset-invalid"));
+            var boundValue = Browser.FindElement(By.Id("textbox-datetimeoffset-invalid-value"));
+            var mirrorValue = Browser.FindElement(By.Id("textbox-datetimeoffset-invalid-mirror"));
+            var expected = new DateTimeOffset(new DateTime(1985, 3, 4), TimeSpan.FromHours(8));
+            Assert.Equal(expected, DateTimeOffset.Parse(target.GetAttribute("value")));
+            Assert.Equal(expected, DateTimeOffset.Parse(boundValue.Text));
+            Assert.Equal(expected, DateTimeOffset.Parse(mirrorValue.GetAttribute("value")));
+
+            // Modify target; verify value is updated and that textboxes linked to the same data are updated
+            expected = new DateTime(2000, 1, 2);
+            target.SendKeys(Keys.Control + "a"); // select all
+            target.SendKeys("01/02/2000 00:00:00\t");
+            Browser.Equal(expected.DateTime, () => DateTimeOffset.Parse(boundValue.Text).DateTime);
+            Assert.Equal(expected.DateTime, DateTimeOffset.Parse(mirrorValue.GetAttribute("value")).DateTime);
+
+            // Modify target to something invalid - the invalid change is reverted
+            // back to the last valid value
+            target.SendKeys(Keys.Control + "a"); // select all
+            target.SendKeys("05/06A");
+            Browser.Equal("05/06A", () => target.GetAttribute("value"));
+            target.SendKeys("\t");
+            Browser.Equal(expected.DateTime, () => DateTimeOffset.Parse(target.GetAttribute("value")).DateTime);
+            Assert.Equal(expected.DateTime, DateTimeOffset.Parse(boundValue.Text).DateTime);
+            Assert.Equal(expected.DateTime, DateTimeOffset.Parse(mirrorValue.GetAttribute("value")).DateTime);
+
+            // Now change it to something valid
+            target.SendKeys(Keys.Control + "a"); // select all
+            target.SendKeys("05/06\t");
+            expected = new DateTime(DateTime.Now.Year, 5, 6);
+            Browser.Equal(expected.DateTime, () => DateTimeOffset.Parse(boundValue.Text).DateTime);
+            Assert.Equal(expected.DateTime, DateTimeOffset.Parse(mirrorValue.GetAttribute("value")).DateTime);
+        }
+
+        // For date comparisons, we parse (non-formatted) values to compare them. Client-side and server-side
+        // Blazor have different formatting behaviour by default.
+        [Fact]
+        public void CanBindTextboxDateTimeWithFormat_InvalidValue()
+        {
+            var target = Browser.FindElement(By.Id("textbox-datetime-format-invalid"));
+            var boundValue = Browser.FindElement(By.Id("textbox-datetime-format-invalid-value"));
+            var mirrorValue = Browser.FindElement(By.Id("textbox-datetime-format-invalid-mirror"));
+            var expected = new DateTime(1985, 3, 4);
+            Assert.Equal("03-04", target.GetAttribute("value"));
+            Assert.Equal(expected, DateTime.Parse(boundValue.Text));
+            Assert.Equal(expected, DateTime.Parse(mirrorValue.GetAttribute("value")));
+
+            // Modify target to something invalid - the invalid change is reverted
+            // back to the last valid value
+            target.SendKeys(Keys.Control + "a"); // select all
+            target.SendKeys("05/06");
+            Browser.Equal("05/06", () => target.GetAttribute("value"));
+            target.SendKeys("\t");
+            Browser.Equal("03-04", () => target.GetAttribute("value"));
+            Assert.Equal(expected, DateTime.Parse(boundValue.Text));
+            Assert.Equal(expected, DateTime.Parse(mirrorValue.GetAttribute("value")));
+
+            // Now change it to something valid
+            target.SendKeys(Keys.Control + "a"); // select all
+            target.SendKeys("05-06\t");
+            expected = new DateTime(DateTime.Now.Year, 5, 6);
+            Browser.Equal(expected, () => DateTime.Parse(boundValue.Text));
+            Assert.Equal(expected, DateTime.Parse(mirrorValue.GetAttribute("value")));
+        }
+
+        // For date comparisons, we parse (non-formatted) values to compare them. Client-side and server-side
+        // Blazor have different formatting behaviour by default.
+        [Fact]
+        public void CanBindTextboxNullableDateTimeOffsetWithFormat_InvalidValue()
+        {
+            var target = Browser.FindElement(By.Id("textbox-nullable-datetimeoffset-format-invalid"));
+            var boundValue = Browser.FindElement(By.Id("textbox-nullable-datetimeoffset-format-invalid-value"));
+            var mirrorValue = Browser.FindElement(By.Id("textbox-nullable-datetimeoffset-format-invalid-mirror"));
+            Assert.Equal(string.Empty, target.GetAttribute("value"));
+            Assert.Equal(string.Empty, boundValue.Text);
+            Assert.Equal(string.Empty, mirrorValue.GetAttribute("value"));
+
+            // Modify target; verify value is updated and that textboxes linked to the same data are updated
+            var expected = new DateTimeOffset(new DateTime(DateTime.Now.Year, 1, 2));
+            target.SendKeys(Keys.Control + "a"); // select all
+            target.SendKeys("01-02\t");
+            Browser.Equal(expected.DateTime, () => DateTimeOffset.Parse(boundValue.Text).DateTime);
+            Assert.Equal(expected.DateTime, DateTimeOffset.Parse(mirrorValue.GetAttribute("value")).DateTime);
+
+            // Modify target to something invalid - the invalid change is reverted
+            // back to the last valid value
+            target.SendKeys(Keys.Control + "a"); // select all
+            target.SendKeys("05/06");
+            Browser.Equal("05/06", () => target.GetAttribute("value"));
+            target.SendKeys("\t");
+            Browser.Equal(expected.DateTime, () => DateTimeOffset.Parse(target.GetAttribute("value")).DateTime);
+            Assert.Equal(expected.DateTime, DateTimeOffset.Parse(boundValue.Text).DateTime);
+            Assert.Equal(expected.DateTime, DateTimeOffset.Parse(mirrorValue.GetAttribute("value")).DateTime);
+
+            // Now change it to something valid
+            target.SendKeys(Keys.Control + "a"); // select all
+            target.SendKeys("05-06\t");
+            expected = new DateTime(DateTime.Now.Year, 5, 6);
+            Browser.Equal(expected.DateTime, () => DateTimeOffset.Parse(boundValue.Text).DateTime);
+            Assert.Equal(expected.DateTime, DateTimeOffset.Parse(mirrorValue.GetAttribute("value")).DateTime);
+        }
     }
 }

src/Components/test/testassets/BasicTestApp/BindCasesComponent.razor

@@ -123,12 +123,24 @@
     <span id="textbox-nullable-datetime-value">@textboxNullableDateTimeValue</span>
     <input id="textbox-nullable-datetime-mirror" @bind="textboxNullableDateTimeValue" readonly />
 </p>
+<p>
+    Nullable DateTime (invalid input):
+    <input id="textbox-nullable-datetime-invalid" @bind="textboxNullableDateTimeInvalidValue" type="text" />
+    <span id="textbox-nullable-datetime-invalid-value">@textboxNullableDateTimeInvalidValue</span>
+    <input id="textbox-nullable-datetime-invalid-mirror" @bind="textboxNullableDateTimeInvalidValue" readonly />
+</p>
 <p>
     DateTimeOffset:
     <input id="textbox-datetimeoffset" @bind="textboxDateTimeOffsetValue" type="text" />
     <span id="textbox-datetimeoffset-value">@textboxDateTimeOffsetValue</span>
     <input id="textbox-datetimeoffset-mirror" @bind="textboxDateTimeOffsetValue" readonly />
 </p>
+<p>
+    DateTimeOffset (invalid input):
+    <input id="textbox-datetimeoffset-invalid" @bind="textboxDateTimeOffsetInvalidValue" type="text" />
+    <span id="textbox-datetimeoffset-invalid-value">@textboxDateTimeOffsetInvalidValue</span>
+    <input id="textbox-datetimeoffset-invalid-mirror" @bind="textboxDateTimeOffsetInvalidValue" readonly />
+</p>
 <p>
     Nullable DateTimeOffset:
     <input id="textbox-nullable-datetimeoffset" @bind="textboxNullableDateTimeOffsetValue" type="text" />
@@ -141,6 +153,18 @@
     <span id="textbox-datetime-format-value">@textboxDateTimeFormatValue</span>
     <input id="textbox-datetime-format-mirror" @bind="textboxDateTimeFormatValue" readonly />
 </p>
+<p>
+    DateTime (format):
+    <input id="textbox-datetime-format-invalid" @bind="textboxDateTimeFormatValue" type="text" @bind:format="MM-dd" />
+    <span id="textbox-datetime-format-invalid-value">@textboxDateTimeFormatValue</span>
+    <input id="textbox-datetime-format-invalid-mirror" @bind="textboxDateTimeFormatValue" readonly />
+</p>
+<p>
+    DateTime (format / invalid value):
+    <input id="textbox-datetime-format-invalid" @bind="textboxDateTimeFormatInvalidValue" type="text" @bind:format="MM-dd" />
+    <span id="textbox-datetime-format-invalid-value">@textboxDateTimeFormatInvalidValue</span>
+    <input id="textbox-datetime-format-invalid-mirror" @bind="textboxDateTimeFormatInvalidValue" readonly />
+</p>
 <p>
     Nullable DateTime (format):
     <input id="textbox-nullable-datetime-format" @bind="textboxNullableDateTimeFormatValue" type="text" @bind:format="MM-dd" />
@@ -159,6 +183,12 @@
     <span id="textbox-nullable-datetimeoffset-format-value">@textboxNullableDateTimeOffsetFormatValue</span>
     <input id="textbox-nullable-datetimeoffset-format-mirror" @bind="textboxNullableDateTimeOffsetFormatValue" readonly />
 </p>
+<p>
+    Nullable DateTimeOffset (format / invalid value):
+    <input id="textbox-nullable-datetimeoffset-format-invalid" @bind="textboxNullableDateTimeOffsetFormatInvalidValue" type="text" @bind:format="MM-dd" />
+    <span id="textbox-nullable-datetimeoffset-format-invalid-value">@textboxNullableDateTimeOffsetFormatInvalidValue</span>
+    <input id="textbox-nullable-datetimeoffset-format-invalid-mirror" @bind="textboxNullableDateTimeOffsetFormatInvalidValue" readonly />
+</p>
 
 <h2>Text Area</h2>
 <p>
@@ -254,11 +284,17 @@
     DateTimeOffset textboxDateTimeOffsetValue = new DateTimeOffset(new DateTime(1985, 3, 4), TimeSpan.FromHours(8));
     DateTimeOffset? textboxNullableDateTimeOffsetValue = null;
 
+    DateTime? textboxNullableDateTimeInvalidValue = null;
+    DateTimeOffset textboxDateTimeOffsetInvalidValue = new DateTimeOffset(new DateTime(1985, 3, 4), TimeSpan.FromHours(8));
+
     DateTime textboxDateTimeFormatValue = new DateTime(1985, 3, 4);
     DateTime? textboxNullableDateTimeFormatValue = null;
     DateTimeOffset textboxDateTimeOffsetFormatValue = new DateTimeOffset(new DateTime(1985, 3, 4), TimeSpan.FromHours(8));
     DateTimeOffset? textboxNullableDateTimeOffsetFormatValue = null;
 
+    DateTime textboxDateTimeFormatInvalidValue = new DateTime(1985, 3, 4);
+    DateTimeOffset? textboxNullableDateTimeOffsetFormatInvalidValue = null;
+
     bool includeFourthOption = false;
     enum SelectableValue { First, Second, Third, Fourth }
     SelectableValue selectValue = SelectableValue.Second;