[FIX] web: Not hide daterange if scrolling on mobile + unit test

Issue

	- Install "Field Service" app
	- Create new task
	- Try to select Planned start/end date and valid

	Daterange picker is hiding when trying to scroll down to valid selection.

Cause

	The daterange picker is closed when ev.target is not inside the picker,
	however ev.target always return the document element.

Solution

	Do not hide daterange picker on scrolling if on mobile.

	Note : It will only apply if scrolling on the daterange picker and
	       will still hide if scrolling outside this last one.

opw-2428099

closes odoo/odoo#65435

X-original-commit: 1d9b6f56e70faee13cda0ccb9893ed49904ab319
Signed-off-by: Adrien Dieudonné (adr) <adr@odoo.com>

addons/web/static/src/js/fields/basic_fields.js

@@ -802,7 +802,7 @@ var FieldDateRange = InputField.extend({
      */
     _onDateRangePickerShow() {
         this._onScroll = ev => {
-            if (!this.$pickerContainer.get(0).contains(ev.target)) {
+            if (!config.device.isMobile && !this.$pickerContainer.get(0).contains(ev.target)) {
                 this.$el.data('daterangepicker').hide();
             }
         };

addons/web/static/tests/fields/basic_fields_mobile_tests.js

@@ -173,6 +173,55 @@ QUnit.module('basic_fields', {
 
         form.destroy();
     });
+
+    QUnit.module('FieldDateRange');
+
+    QUnit.test('date field: toggle daterangepicker then scroll', async function (assert) {
+        assert.expect(4);
+        const scrollEvent = new UIEvent('scroll');
+
+        function scrollAtHeight(height) {
+            window.scrollTo(0, height);
+            document.dispatchEvent(scrollEvent);
+        }
+        this.data.partner.fields.date_end = {string: 'Date End', type: 'date'};
+
+        var form = await createView({
+            View: FormView,
+            model: 'partner',
+            data: this.data,
+            arch: '<form>' +
+                    '<field name="date" widget="daterange" options="{\'related_end_date\': \'date_end\'}"/>' +
+                    '<field name="date_end" widget="daterange" options="{\'related_start_date\': \'date\'}"/>' +
+                '</form>',
+            session: {
+                getTZOffset: function () {
+                    return 330;
+                },
+            },
+        });
+
+        // Check date range picker initialization
+        assert.containsN(document.body, '.daterangepicker', 2,
+            "should initialize 2 date range picker");
+
+        // Open date range picker
+        await testUtils.dom.click("input[name=date]");
+        assert.isVisible($('.daterangepicker:first'),
+            "date range picker should be opened");
+
+        // Scroll
+        scrollAtHeight(50);
+        assert.isVisible($('.daterangepicker:first'),
+            "date range picker should be opened");
+
+        // Close picker
+        await testUtils.dom.click($('.daterangepicker:first .cancelBtn'));
+        assert.isNotVisible($('.daterangepicker:first'),
+            "date range picker should be closed");
+
+        form.destroy();
+    });
 });
 });
 });