DateField value should actively adjust to the set resolution. (#12183)7.7.23

4 files changed, 331 insertions, 0 deletions

diff --git a/uitest/src/main/java/com/vaadin/tests/components/datefield/DateFieldResolutionChange.java b/uitest/src/main/java/com/vaadin/tests/components/datefield/DateFieldResolutionChange.java
new file mode 100644
index 0000000000..a3635ea9a3
--- /dev/null
+++ b/uitest/src/main/java/com/vaadin/tests/components/datefield/DateFieldResolutionChange.java
@@ -0,0 +1,114 @@
+package com.vaadin.tests.components.datefield;
+
+import java.time.LocalDate;
+import java.time.format.DateTimeFormatter;
+import java.util.Locale;
+
+import com.vaadin.data.Binder;
+import com.vaadin.server.VaadinRequest;
+import com.vaadin.shared.ui.datefield.DateResolution;
+import com.vaadin.tests.components.AbstractTestUIWithLog;
+import com.vaadin.ui.Button;
+import com.vaadin.ui.DateField;
+import com.vaadin.ui.HorizontalLayout;
+
+public class DateFieldResolutionChange extends AbstractTestUIWithLog {
+
+    protected DateTimeFormatter DATE_FORMATTER = DateTimeFormatter
+            .ofPattern("yyyy-MM-dd", Locale.ROOT);
+
+    @Override
+    protected void setup(VaadinRequest request) {
+        Binder<Pojo> binder = new Binder<>(Pojo.class);
+
+        HorizontalLayout horizontalLayout = new HorizontalLayout();
+
+        final DateField monthField = new DateField() {
+            @Override
+            public void setValue(LocalDate value) {
+                if (value != null) {
+                    log("MonthField set value " + DATE_FORMATTER.format(value));
+                }
+                super.setValue(value);
+            }
+        };
+        monthField.setResolution(DateResolution.MONTH);
+        monthField.setId("MonthField");
+        monthField.addValueChangeListener(
+                event -> log("MonthField value change event: "
+                        + DATE_FORMATTER.format(event.getValue())));
+        binder.bind(monthField, "value1");
+
+        final DateField dayField = new DateField() {
+            @Override
+            public void setValue(LocalDate value) {
+                if (value != null) {
+                    log("DayField set value " + DATE_FORMATTER.format(value));
+                }
+                super.setValue(value);
+            }
+        };
+        dayField.setResolution(DateResolution.DAY);
+        dayField.setId("DayField");
+        dayField.addValueChangeListener(
+                event -> log("DayField value change event: "
+                        + DATE_FORMATTER.format(event.getValue())));
+        binder.bind(dayField, "value2");
+
+        Pojo pojo = new Pojo();
+        binder.setBean(pojo);
+
+        Button monthButton = new Button("month", e -> {
+            monthField.setResolution(DateResolution.MONTH);
+            dayField.setResolution(DateResolution.MONTH);
+        });
+
+        Button dayButton = new Button("day", e -> {
+            monthField.setResolution(DateResolution.DAY);
+            dayField.setResolution(DateResolution.DAY);
+        });
+
+        Button logButton = new Button("log", e -> {
+            log("MonthField current value: "
+                    + DATE_FORMATTER.format(pojo.getValue1()));
+            log("DayField current value: "
+                    + DATE_FORMATTER.format(pojo.getValue2()));
+        });
+
+        Button setButton = new Button("set", e -> {
+            LocalDate newDate = LocalDate.of(2021, 2, 14);
+            pojo.setValue1(newDate);
+            pojo.setValue2(newDate);
+            binder.setBean(pojo);
+        });
+
+        horizontalLayout.addComponents(monthField, dayField, monthButton,
+                dayButton, logButton, setButton);
+        addComponent(horizontalLayout);
+    }
+
+    public class Pojo {
+        private LocalDate value1, value2 = null;
+
+        public LocalDate getValue1() {
+            return value1;
+        }
+
+        public void setValue1(LocalDate value1) {
+            this.value1 = value1;
+        }
+
+        public LocalDate getValue2() {
+            return value2;
+        }
+
+        public void setValue2(LocalDate value2) {
+            this.value2 = value2;
+        }
+    }
+
+    @Override
+    protected String getTestDescription() {
+        return "Date field value should immediately update to match resolution.";
+    }
+}
diff --git a/uitest/src/main/java/com/vaadin/tests/components/datefield/DateTimeFieldResolutionChange.java b/uitest/src/main/java/com/vaadin/tests/components/datefield/DateTimeFieldResolutionChange.java
new file mode 100644
index 0000000000..c8066af75b
--- /dev/null
+++ b/uitest/src/main/java/com/vaadin/tests/components/datefield/DateTimeFieldResolutionChange.java
@@ -0,0 +1,114 @@
+package com.vaadin.tests.components.datefield;
+
+import java.time.LocalDateTime;
+import java.time.format.DateTimeFormatter;
+import java.util.Locale;
+
+import com.vaadin.data.Binder;
+import com.vaadin.server.VaadinRequest;
+import com.vaadin.shared.ui.datefield.DateTimeResolution;
+import com.vaadin.tests.components.AbstractTestUIWithLog;
+import com.vaadin.ui.Button;
+import com.vaadin.ui.DateTimeField;
+import com.vaadin.ui.HorizontalLayout;
+
+public class DateTimeFieldResolutionChange extends AbstractTestUIWithLog {
+
+    protected DateTimeFormatter DATE_FORMATTER = DateTimeFormatter
+            .ofPattern("yyyy-MM-dd HH:mm:ss", Locale.ROOT);
+
+    @Override
+    protected void setup(VaadinRequest request) {
+        Binder<Pojo> binder = new Binder<>(Pojo.class);
+
+        HorizontalLayout horizontalLayout = new HorizontalLayout();
+
+        final DateTimeField monthField = new DateTimeField() {
+            @Override
+            public void setValue(LocalDateTime value) {
+                if (value != null) {
+                    log("MonthField set value " + DATE_FORMATTER.format(value));
+                }
+                super.setValue(value);
+            }
+        };
+        monthField.setResolution(DateTimeResolution.MONTH);
+        monthField.setId("MonthField");
+        monthField.addValueChangeListener(
+                event -> log("MonthField value change event: "
+                        + DATE_FORMATTER.format(event.getValue())));
+        binder.bind(monthField, "value1");
+
+        final DateTimeField dayField = new DateTimeField() {
+            @Override
+            public void setValue(LocalDateTime value) {
+                if (value != null) {
+                    log("DayField set value " + DATE_FORMATTER.format(value));
+                }
+                super.setValue(value);
+            }
+        };
+        dayField.setResolution(DateTimeResolution.DAY);
+        dayField.setId("DayField");
+        dayField.addValueChangeListener(
+                event -> log("DayField value change event: "
+                        + DATE_FORMATTER.format(event.getValue())));
+        binder.bind(dayField, "value2");
+
+        Pojo pojo = new Pojo();
+        binder.setBean(pojo);
+
+        Button monthButton = new Button("month", e -> {
+            monthField.setResolution(DateTimeResolution.MONTH);
+            dayField.setResolution(DateTimeResolution.MONTH);
+        });
+
+        Button dayButton = new Button("day", e -> {
+            monthField.setResolution(DateTimeResolution.DAY);
+            dayField.setResolution(DateTimeResolution.DAY);
+        });
+
+        Button logButton = new Button("log", e -> {
+            log("MonthField current value: "
+                    + DATE_FORMATTER.format(pojo.getValue1()));
+            log("DayField current value: "
+                    + DATE_FORMATTER.format(pojo.getValue2()));
+        });
+
+        Button setButton = new Button("set", e -> {
+            LocalDateTime newDate = LocalDateTime.of(2021, 2, 14, 16, 17);
+            pojo.setValue1(newDate);
+            pojo.setValue2(newDate);
+            binder.setBean(pojo);
+        });
+
+        horizontalLayout.addComponents(monthField, dayField, monthButton,
+                dayButton, logButton, setButton);
+        addComponent(horizontalLayout);
+    }
+
+    public class Pojo {
+        private LocalDateTime value1, value2 = null;
+
+        public LocalDateTime getValue1() {
+            return value1;
+        }
+
+        public void setValue1(LocalDateTime value1) {
+            this.value1 = value1;
+        }
+
+        public LocalDateTime getValue2() {
+            return value2;
+        }
+
+        public void setValue2(LocalDateTime value2) {
+            this.value2 = value2;
+        }
+    }
+
+    @Override
+    protected String getTestDescription() {
+        return "Date field value should immediately update to match resolution.";
+    }
+}
diff --git a/uitest/src/test/java/com/vaadin/tests/components/datefield/DateFieldResolutionChangeTest.java b/uitest/src/test/java/com/vaadin/tests/components/datefield/DateFieldResolutionChangeTest.java
new file mode 100644
index 0000000000..c2a6b8ad12
--- /dev/null
+++ b/uitest/src/test/java/com/vaadin/tests/components/datefield/DateFieldResolutionChangeTest.java
@@ -0,0 +1,50 @@
+package com.vaadin.tests.components.datefield;
+
+import static org.junit.Assert.assertEquals;
+
+import org.junit.Test;
+
+import com.vaadin.testbench.elements.ButtonElement;
+import com.vaadin.tests.tb3.MultiBrowserTest;
+
+public class DateFieldResolutionChangeTest extends MultiBrowserTest {
+
+    @Test
+    public void testValueAndResolutionChange() {
+        openTestURL();
+
+        // set a fixed date
+        $(ButtonElement.class).caption("set").first().click();
+
+        // both fields should trigger a value change event but for MonthField
+        // the day value should be truncated to default
+        assertEquals("Unexpected log row", "1. MonthField set value 2021-02-14",
+                getLogRow(3));
+        assertEquals("Unexpected log row",
+                "2. MonthField value change event: 2021-02-01", getLogRow(2));
+        assertEquals("Unexpected log row", "3. DayField set value 2021-02-14",
+                getLogRow(1));
+        assertEquals("Unexpected log row",
+                "4. DayField value change event: 2021-02-14", getLogRow(0));
+
+        // change both to day resolution
+        $(ButtonElement.class).caption("day").first().click();
+
+        // DayField shouldn't react, MonthField should check that the value
+        // matches resolution but not trigger a ValueChangeEvent
+        assertEquals("Unexpected log row", "5. MonthField set value 2021-02-01",
+                getLogRow(0));
+
+        // change both to month resolution
+        $(ButtonElement.class).caption("month").first().click();
+
+        // both fields should check that the value matches resolution but only
+        // DayField should trigger a ValueChangeEvent
+        assertEquals("Unexpected log row", "6. MonthField set value 2021-02-01",
+                getLogRow(2));
+        assertEquals("Unexpected log row", "7. DayField set value 2021-02-01",
+                getLogRow(1));
+        assertEquals("Unexpected log row",
+                "8. DayField value change event: 2021-02-01", getLogRow(0));
+    }
+}
diff --git a/uitest/src/test/java/com/vaadin/tests/components/datefield/DateTimeFieldResolutionChangeTest.java b/uitest/src/test/java/com/vaadin/tests/components/datefield/DateTimeFieldResolutionChangeTest.java
new file mode 100644
index 0000000000..4fdd0a5ae9
--- /dev/null
+++ b/uitest/src/test/java/com/vaadin/tests/components/datefield/DateTimeFieldResolutionChangeTest.java
@@ -0,0 +1,53 @@
+package com.vaadin.tests.components.datefield;
+
+import static org.junit.Assert.assertEquals;
+
+import org.junit.Test;
+
+import com.vaadin.testbench.elements.ButtonElement;
+import com.vaadin.tests.tb3.MultiBrowserTest;
+
+public class DateTimeFieldResolutionChangeTest extends MultiBrowserTest {
+
+    @Test
+    public void testValueAndResolutionChange() {
+        openTestURL();
+
+        // set a fixed date
+        $(ButtonElement.class).caption("set").first().click();
+
+        // both fields should trigger a value change event but the value should
+        // be truncated according to each field's resolution
+        assertEquals("Unexpected log row",
+                "1. MonthField set value 2021-02-14 16:17:00", getLogRow(3));
+        assertEquals("Unexpected log row",
+                "2. MonthField value change event: 2021-02-01 00:00:00",
+                getLogRow(2));
+        assertEquals("Unexpected log row",
+                "3. DayField set value 2021-02-14 16:17:00", getLogRow(1));
+        assertEquals("Unexpected log row",
+                "4. DayField value change event: 2021-02-14 00:00:00",
+                getLogRow(0));
+
+        // change both to day resolution
+        $(ButtonElement.class).caption("day").first().click();
+
+        // DayField shouldn't react, MonthField should check that the value
+        // matches resolution but not trigger a ValueChangeEvent
+        assertEquals("Unexpected log row",
+                "5. MonthField set value 2021-02-01 00:00:00", getLogRow(0));
+
+        // change both to month resolution
+        $(ButtonElement.class).caption("month").first().click();
+
+        // both fields should check that the value matches resolution but only
+        // DayField should trigger a ValueChangeEvent
+        assertEquals("Unexpected log row",
+                "6. MonthField set value 2021-02-01 00:00:00", getLogRow(2));
+        assertEquals("Unexpected log row",
+                "7. DayField set value 2021-02-01 00:00:00", getLogRow(1));
+        assertEquals("Unexpected log row",
+                "8. DayField value change event: 2021-02-01 00:00:00",
+                getLogRow(0));
+    }
+}