[FIX] web: inconsistent daterange validation

SPECIFICATION:
In the daterange widget, if the second date field is required and left empty,
the field should be marked as invalid and be colored red.

Observed behavior:
if the second field is empty so that fields is not highlighted in red.

Expected behavior:
if the second field is empty so that fields should be highlighted in red.

Task-3786540

addons/web/static/src/views/fields/datetime/datetime_field.js

@@ -376,6 +376,17 @@ export const dateRangeField = {
         },
     ],
     supportedTypes: ["date", "datetime"],
+    isValid: (record, fieldname, fieldInfo) => {
+        if (fieldInfo.widget === "daterange") {
+            if (fieldInfo.options.end_date_field && (!record.data[fieldInfo.options.end_date_field] !== !record.data[fieldname])) {
+                return false;
+            }
+            if (fieldInfo.options.start_date_field && (!record.data[fieldInfo.options.start_date_field] !== !record.data[fieldname])) {
+                return false;
+            }
+        }
+        return !record.isFieldInvalid(fieldname);
+    }
 };
 
 registry

addons/web/static/src/views/fields/field.js

@@ -53,7 +53,7 @@ export function fieldVisualFeedback(field, record, fieldName, fieldInfo) {
     return {
         readonly,
         required,
-        invalid: record.isFieldInvalid(fieldName),
+        invalid: field.isValid ? !field.isValid(record, fieldName, fieldInfo) : record.isFieldInvalid(fieldName),
         empty,
     };
 }

addons/web/static/tests/views/fields/daterange_field_tests.js

@@ -1240,4 +1240,60 @@ QUnit.module("Fields", (hooks) => {
             assert.containsOnce(target, ".fa-long-arrow-right");
         }
     );
+
+    QUnit.test(
+        "date field should be highlighted if options of date_end is empty",
+        async (assert) => {
+            serverData.models.partner.fields.date_end = { string: "Date End", type: "date" };
+            serverData.models.partner.records[0].date_end = "2017-02-08";
+            await makeView({
+                type: "form",
+                resModel: "partner",
+                serverData,
+                arch: `
+                    <form>
+                        <label for="date" string="Daterange" />
+                        <field name="date" widget="daterange" options="{'end_date_field': 'date_end'}" string="Planned Date" required="date or date_end"/>
+                        <field name="date_end" invisible="1" required="date"/>
+                    </form>`,
+                resId: 1,
+            });
+            await editInput(target, "input[data-field=date_end]", "");
+            await click(target);
+            assert.hasClass(
+                target.querySelector(".o_field_daterange"),
+                "o_field_invalid",
+                "date field should be displayed as invalid"
+            );
+            await editInput(target, "input[data-field=date_end]", "2017-02-08");
+        }
+    );
+
+    QUnit.test(
+        "date field should be highlighted if options of date_start is empty",
+        async (assert) => {
+            serverData.models.partner.fields.date_end = { string: "Date End", type: "date" };
+            serverData.models.partner.records[0].date_end = "2017-02-08";
+            await makeView({
+                type: "form",
+                resModel: "partner",
+                serverData,
+                arch: `
+                    <form>
+                        <label for="date" string="Daterange" />
+                        <field name="date" widget="daterange" options="{'start_date_field': 'date_end'}" string="Planned Date" required="date or date_end"/>
+                        <field name="date_end" invisible="1" required="date"/>
+                    </form>`,
+                resId: 1,
+            });
+            await editInput(target, "input[data-field=date_end]", "");
+            await click(target);
+            assert.hasClass(
+                target.querySelector(".o_field_daterange"),
+                "o_field_invalid",
+                "date field should be displayed as invalid"
+            );
+            await editInput(target, "input[data-field=date_end]", "2017-02-08");
+        }
+    );
 });