DateBox: Fix floating label overlapping date format hint for native picker (T1328901) (#33707)

Co-authored-by: Ruslan Farkhutdinov <ruslan.farkhutdinov@devexpress.com>

Author: r-farkhutdinov

packages/devextreme/js/__internal/ui/date_box/date_box.base.ts

@@ -501,6 +501,16 @@ class DateBox extends DropDownEditor<DateBoxBaseProperties> {
     return super._isClearButtonVisible() && !this._isNativeType();
   }
 
+  _toggleEmptinessEventHandler(): void {
+    if (this._isNativeType()) {
+      this._toggleEmptiness(false);
+
+      return;
+    }
+
+    super._toggleEmptinessEventHandler();
+  }
+
   _renderValue(): DeferredObj<unknown> {
     const value = this.getDateOption('value');
 

packages/devextreme/testing/tests/DevExpress.ui.widgets.editors/datebox.tests.js

@@ -62,6 +62,8 @@ const CANCEL_BUTTON_SELECTOR = '.dx-popup-cancel.dx-button';
 const TODAY_BUTTON_SELECTOR = `.${TODAY_BUTTON_CLASS}.${BUTTON_CLASS}`;
 const BUTTON_SELECTOR = '.dx-button';
 const TEXTBOX_SELECTOR = '.dx-textbox';
+const TEXTEDITOR_EMPTY_INPUT_CLASS = 'dx-texteditor-empty';
+
 
 const widgetName = 'dxDateBox';
 const { module: testModule, test } = QUnit;
@@ -3059,6 +3061,25 @@ testModule('native picker', function() {
             }
         });
     });
+
+    test('empty class should not be attached for native picker with null value (T1328901)', function(assert) {
+        const $dateBox = $('#dateBox').dxDateBox({
+            pickerType: 'native',
+            type: 'date',
+            value: null,
+            labelMode: 'floating',
+            label: 'Label',
+        });
+        const dateBox = $dateBox.dxDateBox('instance');
+
+        assert.strictEqual($dateBox.hasClass(TEXTEDITOR_EMPTY_INPUT_CLASS), false,
+            'empty class is not attached so floating label does not overlap with browser-rendered date format hint');
+
+        dateBox.option('value', new Date());
+
+        assert.strictEqual($dateBox.hasClass(TEXTEDITOR_EMPTY_INPUT_CLASS), false,
+            'empty class remains absent after value is set');
+    });
 });
 
 QUnit.module('valueChanged handler should receive correct event', {