DevExpress · juleari · Oct 13, 2025 · Oct 13, 2025
diff --git a/e2e/testcafe-devextreme/tests/editors/dateBox/common.ts b/e2e/testcafe-devextreme/tests/editors/dateBox/common.ts
@@ -1,4 +1,6 @@
 /* eslint-disable no-restricted-syntax */
+import type { DatePickerType, DateType, Properties } from 'devextreme/ui/date_box.d';
+import { EditorStyle } from 'devextreme/common';
 import { Selector } from 'testcafe';
 import { createScreenshotsComparer } from 'devextreme-screenshot-comparer';
 import Guid from 'devextreme/core/guid';
@@ -15,65 +17,71 @@ const DATEBOX_CLASS = 'dx-datebox';
 const DROP_DOWN_EDITOR_ACTIVE_CLASS = 'dx-dropdowneditor-active';
 const FOCUSED_STATE_CLASS = 'dx-state-focused';
 
-const stylingModes = ['outlined', 'underlined', 'filled'];
-const pickerTypes = ['calendar', 'list', 'native', 'rollers'];
-const labelModes = ['static', 'floating', 'hidden', 'outside'];
-const types = ['date', 'datetime', 'time'];
+const stylingModes: EditorStyle[] = ['outlined', 'underlined', 'filled'];
+const pickerTypes: DatePickerType[] = ['calendar', 'list', 'native', 'rollers'];
+const types: DateType[] = ['date', 'datetime', 'time'];
 
 fixture.disablePageReloads`DateBox render`
   .page(url(__dirname, '../../container.html'));
 
-stylingModes.forEach((stylingMode) => {
-  labelModes.forEach((labelMode) => {
-    test(`DateBox styles, stylingMode=${stylingMode}, labelMode=${labelMode}`, async (t) => {
-      const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
+const createDateBox = async (options?: Properties, state?: string): Promise<string> => {
+  const id = `${`dx${new Guid()}`}`;
 
-      await testScreenshot(t, takeScreenshot, `Datebox stylingMode=${stylingMode}, labelMode=${labelMode}.png`, { shouldTestInCompact: true });
+  await appendElementTo('#container', 'div', id, {});
+  await createWidget('dxDateBox', {
+    width: 220,
+    label: 'label text',
+    showClearButton: true,
+    value: new Date(2021, 9, 17, 16, 34),
+    ...options,
+  }, `#${id}`);
 
-      for (const state of [DROP_DOWN_EDITOR_ACTIVE_CLASS, FOCUSED_STATE_CLASS] as any[]) {
-        for (const id of t.ctx.ids) {
-          await setClassAttribute(Selector(`#${id}`), state);
-        }
+  if (state) {
+    await setClassAttribute(Selector(`#${id}`), state);
+  }
 
-        await testScreenshot(t, takeScreenshot, `Datebox ${state.replaceAll('dx-', '').replaceAll('dropdowneditor-', '').replaceAll('state-', '')} stylingMode=${stylingMode}, labelMode=${labelMode}.png`, { shouldTestInCompact: true });
+  return id;
+};
 
-        for (const id of t.ctx.ids) {
-          await removeClassAttribute(Selector(`#${id}`), state);
-        }
-      }
+test('DateBox styles', async (t) => {
+  const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
+
+  await testScreenshot(t, takeScreenshot, 'Datebox.png');
+
+  for (const state of [DROP_DOWN_EDITOR_ACTIVE_CLASS, FOCUSED_STATE_CLASS] as any[]) {
+    for (const id of t.ctx.ids) {
+      await setClassAttribute(Selector(`#${id}`), state);
+    }
+
+    await testScreenshot(t, takeScreenshot, `Datebox ${state.replaceAll('dx-', '').replaceAll('dropdowneditor-', '').replaceAll('state-', '')}.png`);
+
+    for (const id of t.ctx.ids) {
+      await removeClassAttribute(Selector(`#${id}`), state);
+    }
+  }
 
-      await t
-        .expect(compareResults.isValid())
-        .ok(compareResults.errorMessages());
-    }).before(async (t) => {
-      t.ctx.ids = [];
-
-      await insertStylesheetRulesToPage(`.${DATEBOX_CLASS} { display: inline-block; margin: 5px; }`);
-
-      for (const rtlEnabled of [true, false]) {
-        for (const type of types) {
-          for (const pickerType of pickerTypes) {
-            const id = `${`dx${new Guid()}`}`;
-
-            t.ctx.ids.push(id);
-            await appendElementTo('#container', 'div', id, { });
-
-            const options: any = {
-              width: 220,
-              label: 'label text',
-              labelMode,
-              stylingMode,
-              showClearButton: true,
-              pickerType,
-              type,
-              rtlEnabled,
-              value: new Date(2021, 9, 17, 16, 34),
-            };
-
-            await createWidget('dxDateBox', options, `#${id}`);
-          }
-        }
+  await t
+    .expect(compareResults.isValid())
+    .ok(compareResults.errorMessages());
+}).before(async (t) => {
+  t.ctx.ids = [];
+
+  await insertStylesheetRulesToPage(`.${DATEBOX_CLASS} { display: inline-block; margin: 5px; }`);
+
+  for (const stylingMode of stylingModes) {
+    for (const type of types) {
+      const options = {
+        stylingMode,
+        type,
+      };
+      for (const pickerType of pickerTypes) {
+        const id = await createDateBox({ ...options, pickerType });
+
+        t.ctx.ids.push(id);
       }
-    });
-  });
+
+      const id = await createDateBox({ ...options, rtlEnabled: true });
+      t.ctx.ids.push(id);
+    }
+  }
 });
diff --git a/...s/dateBox/etalons/DateBox render with buttons container (fluent-blue-light).png b/...s/dateBox/etalons/DateBox render with buttons container (fluent-blue-light).png
diff --git a/...itors/dateBox/etalons/DateBox render with buttons container (generic-light).png b/...itors/dateBox/etalons/DateBox render with buttons container (generic-light).png
diff --git a/...dateBox/etalons/DateBox render with buttons container (material-blue-light).png b/...dateBox/etalons/DateBox render with buttons container (material-blue-light).png
diff --git a/...ns/DateBox render with buttons container, isValid=false (fluent-blue-light).png b/...ns/DateBox render with buttons container, isValid=false (fluent-blue-light).png
diff --git a/...ox render with buttons container, isValid=false (fluent-blue-light-compact).png b/...ox render with buttons container, isValid=false (fluent-blue-light-compact).png
diff --git a/...talons/DateBox render with buttons container, isValid=false (generic-light).png b/...talons/DateBox render with buttons container, isValid=false (generic-light).png
diff --git a/...ateBox render with buttons container, isValid=false (generic-light-compact).png b/...ateBox render with buttons container, isValid=false (generic-light-compact).png
diff --git a/.../DateBox render with buttons container, isValid=false (material-blue-light).png b/.../DateBox render with buttons container, isValid=false (material-blue-light).png
diff --git a/... render with buttons container, isValid=false (material-blue-light-compact).png b/... render with buttons container, isValid=false (material-blue-light-compact).png
diff --git a/...ons/DateBox render with buttons container, isValid=true (fluent-blue-light).png b/...ons/DateBox render with buttons container, isValid=true (fluent-blue-light).png
diff --git a/...Box render with buttons container, isValid=true (fluent-blue-light-compact).png b/...Box render with buttons container, isValid=true (fluent-blue-light-compact).png
diff --git a/...etalons/DateBox render with buttons container, isValid=true (generic-light).png b/...etalons/DateBox render with buttons container, isValid=true (generic-light).png
diff --git a/...DateBox render with buttons container, isValid=true (generic-light-compact).png b/...DateBox render with buttons container, isValid=true (generic-light-compact).png
diff --git a/...s/DateBox render with buttons container, isValid=true (material-blue-light).png b/...s/DateBox render with buttons container, isValid=true (material-blue-light).png
diff --git a/...x render with buttons container, isValid=true (material-blue-light-compact).png b/...x render with buttons container, isValid=true (material-blue-light-compact).png
diff --git a/...stcafe-devextreme/tests/editors/dateBox/etalons/Datebox (fluent-blue-light).png b/...stcafe-devextreme/tests/editors/dateBox/etalons/Datebox (fluent-blue-light).png
diff --git a/e2e/testcafe-devextreme/tests/editors/dateBox/etalons/Datebox (generic-light).png b/e2e/testcafe-devextreme/tests/editors/dateBox/etalons/Datebox (generic-light).png
diff --git a/...cafe-devextreme/tests/editors/dateBox/etalons/Datebox (material-blue-light).png b/...cafe-devextreme/tests/editors/dateBox/etalons/Datebox (material-blue-light).png
diff --git a/...devextreme/tests/editors/dateBox/etalons/Datebox active (fluent-blue-light).png b/...devextreme/tests/editors/dateBox/etalons/Datebox active (fluent-blue-light).png
diff --git a/...afe-devextreme/tests/editors/dateBox/etalons/Datebox active (generic-light).png b/...afe-devextreme/tests/editors/dateBox/etalons/Datebox active (generic-light).png
diff --git a/...vextreme/tests/editors/dateBox/etalons/Datebox active (material-blue-light).png b/...vextreme/tests/editors/dateBox/etalons/Datebox active (material-blue-light).png
diff --git a/...s/Datebox active stylingMode=filled, labelMode=floating (fluent-blue-light).png b/...s/Datebox active stylingMode=filled, labelMode=floating (fluent-blue-light).png
diff --git a/...x active stylingMode=filled, labelMode=floating (fluent-blue-light-compact).png b/...x active stylingMode=filled, labelMode=floating (fluent-blue-light-compact).png
diff --git a/...alons/Datebox active stylingMode=filled, labelMode=floating (generic-light).png b/...alons/Datebox active stylingMode=filled, labelMode=floating (generic-light).png
diff --git a/...tebox active stylingMode=filled, labelMode=floating (generic-light-compact).png b/...tebox active stylingMode=filled, labelMode=floating (generic-light-compact).png
diff --git a/...Datebox active stylingMode=filled, labelMode=floating (material-blue-light).png b/...Datebox active stylingMode=filled, labelMode=floating (material-blue-light).png
diff --git a/...active stylingMode=filled, labelMode=floating (material-blue-light-compact).png b/...active stylingMode=filled, labelMode=floating (material-blue-light-compact).png
diff --git a/...ons/Datebox active stylingMode=filled, labelMode=hidden (fluent-blue-light).png b/...ons/Datebox active stylingMode=filled, labelMode=hidden (fluent-blue-light).png
diff --git a/...box active stylingMode=filled, labelMode=hidden (fluent-blue-light-compact).png b/...box active stylingMode=filled, labelMode=hidden (fluent-blue-light-compact).png
diff --git a/...etalons/Datebox active stylingMode=filled, labelMode=hidden (generic-light).png b/...etalons/Datebox active stylingMode=filled, labelMode=hidden (generic-light).png
diff --git a/...Datebox active stylingMode=filled, labelMode=hidden (generic-light-compact).png b/...Datebox active stylingMode=filled, labelMode=hidden (generic-light-compact).png
diff --git a/...s/Datebox active stylingMode=filled, labelMode=hidden (material-blue-light).png b/...s/Datebox active stylingMode=filled, labelMode=hidden (material-blue-light).png
diff --git a/...x active stylingMode=filled, labelMode=hidden (material-blue-light-compact).png b/...x active stylingMode=filled, labelMode=hidden (material-blue-light-compact).png
diff --git a/...ns/Datebox active stylingMode=filled, labelMode=outside (fluent-blue-light).png b/...ns/Datebox active stylingMode=filled, labelMode=outside (fluent-blue-light).png
diff --git a/...ox active stylingMode=filled, labelMode=outside (fluent-blue-light-compact).png b/...ox active stylingMode=filled, labelMode=outside (fluent-blue-light-compact).png
diff --git a/...talons/Datebox active stylingMode=filled, labelMode=outside (generic-light).png b/...talons/Datebox active stylingMode=filled, labelMode=outside (generic-light).png
diff --git a/...atebox active stylingMode=filled, labelMode=outside (generic-light-compact).png b/...atebox active stylingMode=filled, labelMode=outside (generic-light-compact).png
diff --git a/.../Datebox active stylingMode=filled, labelMode=outside (material-blue-light).png b/.../Datebox active stylingMode=filled, labelMode=outside (material-blue-light).png
diff --git a/... active stylingMode=filled, labelMode=outside (material-blue-light-compact).png b/... active stylingMode=filled, labelMode=outside (material-blue-light-compact).png
diff --git a/...ons/Datebox active stylingMode=filled, labelMode=static (fluent-blue-light).png b/...ons/Datebox active stylingMode=filled, labelMode=static (fluent-blue-light).png
diff --git a/...box active stylingMode=filled, labelMode=static (fluent-blue-light-compact).png b/...box active stylingMode=filled, labelMode=static (fluent-blue-light-compact).png
diff --git a/...etalons/Datebox active stylingMode=filled, labelMode=static (generic-light).png b/...etalons/Datebox active stylingMode=filled, labelMode=static (generic-light).png
diff --git a/...Datebox active stylingMode=filled, labelMode=static (generic-light-compact).png b/...Datebox active stylingMode=filled, labelMode=static (generic-light-compact).png
diff --git a/...s/Datebox active stylingMode=filled, labelMode=static (material-blue-light).png b/...s/Datebox active stylingMode=filled, labelMode=static (material-blue-light).png
diff --git a/...x active stylingMode=filled, labelMode=static (material-blue-light-compact).png b/...x active stylingMode=filled, labelMode=static (material-blue-light-compact).png
diff --git a/...Datebox active stylingMode=outlined, labelMode=floating (fluent-blue-light).png b/...Datebox active stylingMode=outlined, labelMode=floating (fluent-blue-light).png
diff --git a/...active stylingMode=outlined, labelMode=floating (fluent-blue-light-compact).png b/...active stylingMode=outlined, labelMode=floating (fluent-blue-light-compact).png
diff --git a/...ons/Datebox active stylingMode=outlined, labelMode=floating (generic-light).png b/...ons/Datebox active stylingMode=outlined, labelMode=floating (generic-light).png
diff --git a/...box active stylingMode=outlined, labelMode=floating (generic-light-compact).png b/...box active stylingMode=outlined, labelMode=floating (generic-light-compact).png
diff --git a/...tebox active stylingMode=outlined, labelMode=floating (material-blue-light).png b/...tebox active stylingMode=outlined, labelMode=floating (material-blue-light).png
diff --git a/...tive stylingMode=outlined, labelMode=floating (material-blue-light-compact).png b/...tive stylingMode=outlined, labelMode=floating (material-blue-light-compact).png
diff --git a/...s/Datebox active stylingMode=outlined, labelMode=hidden (fluent-blue-light).png b/...s/Datebox active stylingMode=outlined, labelMode=hidden (fluent-blue-light).png
diff --git a/...x active stylingMode=outlined, labelMode=hidden (fluent-blue-light-compact).png b/...x active stylingMode=outlined, labelMode=hidden (fluent-blue-light-compact).png
diff --git a/...alons/Datebox active stylingMode=outlined, labelMode=hidden (generic-light).png b/...alons/Datebox active stylingMode=outlined, labelMode=hidden (generic-light).png
diff --git a/...tebox active stylingMode=outlined, labelMode=hidden (generic-light-compact).png b/...tebox active stylingMode=outlined, labelMode=hidden (generic-light-compact).png
diff --git a/...Datebox active stylingMode=outlined, labelMode=hidden (material-blue-light).png b/...Datebox active stylingMode=outlined, labelMode=hidden (material-blue-light).png
diff --git a/...active stylingMode=outlined, labelMode=hidden (material-blue-light-compact).png b/...active stylingMode=outlined, labelMode=hidden (material-blue-light-compact).png
diff --git a/.../Datebox active stylingMode=outlined, labelMode=outside (fluent-blue-light).png b/.../Datebox active stylingMode=outlined, labelMode=outside (fluent-blue-light).png
diff --git a/... active stylingMode=outlined, labelMode=outside (fluent-blue-light-compact).png b/... active stylingMode=outlined, labelMode=outside (fluent-blue-light-compact).png
diff --git a/...lons/Datebox active stylingMode=outlined, labelMode=outside (generic-light).png b/...lons/Datebox active stylingMode=outlined, labelMode=outside (generic-light).png
diff --git a/...ebox active stylingMode=outlined, labelMode=outside (generic-light-compact).png b/...ebox active stylingMode=outlined, labelMode=outside (generic-light-compact).png
diff --git a/...atebox active stylingMode=outlined, labelMode=outside (material-blue-light).png b/...atebox active stylingMode=outlined, labelMode=outside (material-blue-light).png
diff --git a/...ctive stylingMode=outlined, labelMode=outside (material-blue-light-compact).png b/...ctive stylingMode=outlined, labelMode=outside (material-blue-light-compact).png
diff --git a/...s/Datebox active stylingMode=outlined, labelMode=static (fluent-blue-light).png b/...s/Datebox active stylingMode=outlined, labelMode=static (fluent-blue-light).png
diff --git a/...x active stylingMode=outlined, labelMode=static (fluent-blue-light-compact).png b/...x active stylingMode=outlined, labelMode=static (fluent-blue-light-compact).png
diff --git a/...alons/Datebox active stylingMode=outlined, labelMode=static (generic-light).png b/...alons/Datebox active stylingMode=outlined, labelMode=static (generic-light).png
diff --git a/...tebox active stylingMode=outlined, labelMode=static (generic-light-compact).png b/...tebox active stylingMode=outlined, labelMode=static (generic-light-compact).png
diff --git a/...Datebox active stylingMode=outlined, labelMode=static (material-blue-light).png b/...Datebox active stylingMode=outlined, labelMode=static (material-blue-light).png
diff --git a/...active stylingMode=outlined, labelMode=static (material-blue-light-compact).png b/...active stylingMode=outlined, labelMode=static (material-blue-light-compact).png
diff --git a/...tebox active stylingMode=underlined, labelMode=floating (fluent-blue-light).png b/...tebox active stylingMode=underlined, labelMode=floating (fluent-blue-light).png
diff --git a/...tive stylingMode=underlined, labelMode=floating (fluent-blue-light-compact).png b/...tive stylingMode=underlined, labelMode=floating (fluent-blue-light-compact).png
diff --git a/...s/Datebox active stylingMode=underlined, labelMode=floating (generic-light).png b/...s/Datebox active stylingMode=underlined, labelMode=floating (generic-light).png
diff --git a/...x active stylingMode=underlined, labelMode=floating (generic-light-compact).png b/...x active stylingMode=underlined, labelMode=floating (generic-light-compact).png
diff --git a/...box active stylingMode=underlined, labelMode=floating (material-blue-light).png b/...box active stylingMode=underlined, labelMode=floating (material-blue-light).png
diff --git a/...ve stylingMode=underlined, labelMode=floating (material-blue-light-compact).png b/...ve stylingMode=underlined, labelMode=floating (material-blue-light-compact).png
diff --git a/...Datebox active stylingMode=underlined, labelMode=hidden (fluent-blue-light).png b/...Datebox active stylingMode=underlined, labelMode=hidden (fluent-blue-light).png
diff --git a/...active stylingMode=underlined, labelMode=hidden (fluent-blue-light-compact).png b/...active stylingMode=underlined, labelMode=hidden (fluent-blue-light-compact).png
diff --git a/...ons/Datebox active stylingMode=underlined, labelMode=hidden (generic-light).png b/...ons/Datebox active stylingMode=underlined, labelMode=hidden (generic-light).png
diff --git a/...box active stylingMode=underlined, labelMode=hidden (generic-light-compact).png b/...box active stylingMode=underlined, labelMode=hidden (generic-light-compact).png
diff --git a/...tebox active stylingMode=underlined, labelMode=hidden (material-blue-light).png b/...tebox active stylingMode=underlined, labelMode=hidden (material-blue-light).png
diff --git a/...tive stylingMode=underlined, labelMode=hidden (material-blue-light-compact).png b/...tive stylingMode=underlined, labelMode=hidden (material-blue-light-compact).png
diff --git a/...atebox active stylingMode=underlined, labelMode=outside (fluent-blue-light).png b/...atebox active stylingMode=underlined, labelMode=outside (fluent-blue-light).png
diff --git a/...ctive stylingMode=underlined, labelMode=outside (fluent-blue-light-compact).png b/...ctive stylingMode=underlined, labelMode=outside (fluent-blue-light-compact).png
diff --git a/...ns/Datebox active stylingMode=underlined, labelMode=outside (generic-light).png b/...ns/Datebox active stylingMode=underlined, labelMode=outside (generic-light).png
diff --git a/...ox active stylingMode=underlined, labelMode=outside (generic-light-compact).png b/...ox active stylingMode=underlined, labelMode=outside (generic-light-compact).png
diff --git a/...ebox active stylingMode=underlined, labelMode=outside (material-blue-light).png b/...ebox active stylingMode=underlined, labelMode=outside (material-blue-light).png
diff --git a/...ive stylingMode=underlined, labelMode=outside (material-blue-light-compact).png b/...ive stylingMode=underlined, labelMode=outside (material-blue-light-compact).png
diff --git a/...Datebox active stylingMode=underlined, labelMode=static (fluent-blue-light).png b/...Datebox active stylingMode=underlined, labelMode=static (fluent-blue-light).png
diff --git a/...active stylingMode=underlined, labelMode=static (fluent-blue-light-compact).png b/...active stylingMode=underlined, labelMode=static (fluent-blue-light-compact).png
diff --git a/...ons/Datebox active stylingMode=underlined, labelMode=static (generic-light).png b/...ons/Datebox active stylingMode=underlined, labelMode=static (generic-light).png
diff --git a/...box active stylingMode=underlined, labelMode=static (generic-light-compact).png b/...box active stylingMode=underlined, labelMode=static (generic-light-compact).png
diff --git a/...tebox active stylingMode=underlined, labelMode=static (material-blue-light).png b/...tebox active stylingMode=underlined, labelMode=static (material-blue-light).png
diff --git a/...tive stylingMode=underlined, labelMode=static (material-blue-light-compact).png b/...tive stylingMode=underlined, labelMode=static (material-blue-light-compact).png
diff --git a/...evextreme/tests/editors/dateBox/etalons/Datebox focused (fluent-blue-light).png b/...evextreme/tests/editors/dateBox/etalons/Datebox focused (fluent-blue-light).png
diff --git a/...fe-devextreme/tests/editors/dateBox/etalons/Datebox focused (generic-light).png b/...fe-devextreme/tests/editors/dateBox/etalons/Datebox focused (generic-light).png
diff --git a/...extreme/tests/editors/dateBox/etalons/Datebox focused (material-blue-light).png b/...extreme/tests/editors/dateBox/etalons/Datebox focused (material-blue-light).png
diff --git a/.../Datebox focused stylingMode=filled, labelMode=floating (fluent-blue-light).png b/.../Datebox focused stylingMode=filled, labelMode=floating (fluent-blue-light).png
diff --git a/... focused stylingMode=filled, labelMode=floating (fluent-blue-light-compact).png b/... focused stylingMode=filled, labelMode=floating (fluent-blue-light-compact).png
diff --git a/...lons/Datebox focused stylingMode=filled, labelMode=floating (generic-light).png b/...lons/Datebox focused stylingMode=filled, labelMode=floating (generic-light).png
diff --git a/...ebox focused stylingMode=filled, labelMode=floating (generic-light-compact).png b/...ebox focused stylingMode=filled, labelMode=floating (generic-light-compact).png
diff --git a/...atebox focused stylingMode=filled, labelMode=floating (material-blue-light).png b/...atebox focused stylingMode=filled, labelMode=floating (material-blue-light).png
diff --git a/...ocused stylingMode=filled, labelMode=floating (material-blue-light-compact).png b/...ocused stylingMode=filled, labelMode=floating (material-blue-light-compact).png
diff --git a/...ns/Datebox focused stylingMode=filled, labelMode=hidden (fluent-blue-light).png b/...ns/Datebox focused stylingMode=filled, labelMode=hidden (fluent-blue-light).png
diff --git a/...ox focused stylingMode=filled, labelMode=hidden (fluent-blue-light-compact).png b/...ox focused stylingMode=filled, labelMode=hidden (fluent-blue-light-compact).png
diff --git a/...talons/Datebox focused stylingMode=filled, labelMode=hidden (generic-light).png b/...talons/Datebox focused stylingMode=filled, labelMode=hidden (generic-light).png
diff --git a/...atebox focused stylingMode=filled, labelMode=hidden (generic-light-compact).png b/...atebox focused stylingMode=filled, labelMode=hidden (generic-light-compact).png
diff --git a/.../Datebox focused stylingMode=filled, labelMode=hidden (material-blue-light).png b/.../Datebox focused stylingMode=filled, labelMode=hidden (material-blue-light).png
diff --git a/... focused stylingMode=filled, labelMode=hidden (material-blue-light-compact).png b/... focused stylingMode=filled, labelMode=hidden (material-blue-light-compact).png
diff --git a/...s/Datebox focused stylingMode=filled, labelMode=outside (fluent-blue-light).png b/...s/Datebox focused stylingMode=filled, labelMode=outside (fluent-blue-light).png
diff --git a/...x focused stylingMode=filled, labelMode=outside (fluent-blue-light-compact).png b/...x focused stylingMode=filled, labelMode=outside (fluent-blue-light-compact).png
diff --git a/...alons/Datebox focused stylingMode=filled, labelMode=outside (generic-light).png b/...alons/Datebox focused stylingMode=filled, labelMode=outside (generic-light).png
diff --git a/...tebox focused stylingMode=filled, labelMode=outside (generic-light-compact).png b/...tebox focused stylingMode=filled, labelMode=outside (generic-light-compact).png
diff --git a/...Datebox focused stylingMode=filled, labelMode=outside (material-blue-light).png b/...Datebox focused stylingMode=filled, labelMode=outside (material-blue-light).png
diff --git a/...focused stylingMode=filled, labelMode=outside (material-blue-light-compact).png b/...focused stylingMode=filled, labelMode=outside (material-blue-light-compact).png
diff --git a/...ns/Datebox focused stylingMode=filled, labelMode=static (fluent-blue-light).png b/...ns/Datebox focused stylingMode=filled, labelMode=static (fluent-blue-light).png
diff --git a/...ox focused stylingMode=filled, labelMode=static (fluent-blue-light-compact).png b/...ox focused stylingMode=filled, labelMode=static (fluent-blue-light-compact).png
diff --git a/...talons/Datebox focused stylingMode=filled, labelMode=static (generic-light).png b/...talons/Datebox focused stylingMode=filled, labelMode=static (generic-light).png
diff --git a/...atebox focused stylingMode=filled, labelMode=static (generic-light-compact).png b/...atebox focused stylingMode=filled, labelMode=static (generic-light-compact).png
diff --git a/.../Datebox focused stylingMode=filled, labelMode=static (material-blue-light).png b/.../Datebox focused stylingMode=filled, labelMode=static (material-blue-light).png
diff --git a/... focused stylingMode=filled, labelMode=static (material-blue-light-compact).png b/... focused stylingMode=filled, labelMode=static (material-blue-light-compact).png
diff --git a/...atebox focused stylingMode=outlined, labelMode=floating (fluent-blue-light).png b/...atebox focused stylingMode=outlined, labelMode=floating (fluent-blue-light).png
diff --git a/...ocused stylingMode=outlined, labelMode=floating (fluent-blue-light-compact).png b/...ocused stylingMode=outlined, labelMode=floating (fluent-blue-light-compact).png
diff --git a/...ns/Datebox focused stylingMode=outlined, labelMode=floating (generic-light).png b/...ns/Datebox focused stylingMode=outlined, labelMode=floating (generic-light).png
diff --git a/...ox focused stylingMode=outlined, labelMode=floating (generic-light-compact).png b/...ox focused stylingMode=outlined, labelMode=floating (generic-light-compact).png
diff --git a/...ebox focused stylingMode=outlined, labelMode=floating (material-blue-light).png b/...ebox focused stylingMode=outlined, labelMode=floating (material-blue-light).png
diff --git a/...used stylingMode=outlined, labelMode=floating (material-blue-light-compact).png b/...used stylingMode=outlined, labelMode=floating (material-blue-light-compact).png
diff --git a/.../Datebox focused stylingMode=outlined, labelMode=hidden (fluent-blue-light).png b/.../Datebox focused stylingMode=outlined, labelMode=hidden (fluent-blue-light).png
diff --git a/... focused stylingMode=outlined, labelMode=hidden (fluent-blue-light-compact).png b/... focused stylingMode=outlined, labelMode=hidden (fluent-blue-light-compact).png
diff --git a/...lons/Datebox focused stylingMode=outlined, labelMode=hidden (generic-light).png b/...lons/Datebox focused stylingMode=outlined, labelMode=hidden (generic-light).png
diff --git a/...ebox focused stylingMode=outlined, labelMode=hidden (generic-light-compact).png b/...ebox focused stylingMode=outlined, labelMode=hidden (generic-light-compact).png
diff --git a/...atebox focused stylingMode=outlined, labelMode=hidden (material-blue-light).png b/...atebox focused stylingMode=outlined, labelMode=hidden (material-blue-light).png
diff --git a/...ocused stylingMode=outlined, labelMode=hidden (material-blue-light-compact).png b/...ocused stylingMode=outlined, labelMode=hidden (material-blue-light-compact).png
diff --git a/...Datebox focused stylingMode=outlined, labelMode=outside (fluent-blue-light).png b/...Datebox focused stylingMode=outlined, labelMode=outside (fluent-blue-light).png
diff --git a/...focused stylingMode=outlined, labelMode=outside (fluent-blue-light-compact).png b/...focused stylingMode=outlined, labelMode=outside (fluent-blue-light-compact).png
diff --git a/...ons/Datebox focused stylingMode=outlined, labelMode=outside (generic-light).png b/...ons/Datebox focused stylingMode=outlined, labelMode=outside (generic-light).png
diff --git a/...box focused stylingMode=outlined, labelMode=outside (generic-light-compact).png b/...box focused stylingMode=outlined, labelMode=outside (generic-light-compact).png
diff --git a/...tebox focused stylingMode=outlined, labelMode=outside (material-blue-light).png b/...tebox focused stylingMode=outlined, labelMode=outside (material-blue-light).png
diff --git a/...cused stylingMode=outlined, labelMode=outside (material-blue-light-compact).png b/...cused stylingMode=outlined, labelMode=outside (material-blue-light-compact).png
diff --git a/.../Datebox focused stylingMode=outlined, labelMode=static (fluent-blue-light).png b/.../Datebox focused stylingMode=outlined, labelMode=static (fluent-blue-light).png
diff --git a/... focused stylingMode=outlined, labelMode=static (fluent-blue-light-compact).png b/... focused stylingMode=outlined, labelMode=static (fluent-blue-light-compact).png
diff --git a/...lons/Datebox focused stylingMode=outlined, labelMode=static (generic-light).png b/...lons/Datebox focused stylingMode=outlined, labelMode=static (generic-light).png
diff --git a/...ebox focused stylingMode=outlined, labelMode=static (generic-light-compact).png b/...ebox focused stylingMode=outlined, labelMode=static (generic-light-compact).png
diff --git a/...atebox focused stylingMode=outlined, labelMode=static (material-blue-light).png b/...atebox focused stylingMode=outlined, labelMode=static (material-blue-light).png
diff --git a/...ocused stylingMode=outlined, labelMode=static (material-blue-light-compact).png b/...ocused stylingMode=outlined, labelMode=static (material-blue-light-compact).png
diff --git a/...ebox focused stylingMode=underlined, labelMode=floating (fluent-blue-light).png b/...ebox focused stylingMode=underlined, labelMode=floating (fluent-blue-light).png
diff --git a/...used stylingMode=underlined, labelMode=floating (fluent-blue-light-compact).png b/...used stylingMode=underlined, labelMode=floating (fluent-blue-light-compact).png
diff --git a/.../Datebox focused stylingMode=underlined, labelMode=floating (generic-light).png b/.../Datebox focused stylingMode=underlined, labelMode=floating (generic-light).png
diff --git a/... focused stylingMode=underlined, labelMode=floating (generic-light-compact).png b/... focused stylingMode=underlined, labelMode=floating (generic-light-compact).png
diff --git a/...ox focused stylingMode=underlined, labelMode=floating (material-blue-light).png b/...ox focused stylingMode=underlined, labelMode=floating (material-blue-light).png
diff --git a/...ed stylingMode=underlined, labelMode=floating (material-blue-light-compact).png b/...ed stylingMode=underlined, labelMode=floating (material-blue-light-compact).png
diff --git a/...atebox focused stylingMode=underlined, labelMode=hidden (fluent-blue-light).png b/...atebox focused stylingMode=underlined, labelMode=hidden (fluent-blue-light).png
diff --git a/...ocused stylingMode=underlined, labelMode=hidden (fluent-blue-light-compact).png b/...ocused stylingMode=underlined, labelMode=hidden (fluent-blue-light-compact).png
diff --git a/...ns/Datebox focused stylingMode=underlined, labelMode=hidden (generic-light).png b/...ns/Datebox focused stylingMode=underlined, labelMode=hidden (generic-light).png
diff --git a/...ox focused stylingMode=underlined, labelMode=hidden (generic-light-compact).png b/...ox focused stylingMode=underlined, labelMode=hidden (generic-light-compact).png
diff --git a/...ebox focused stylingMode=underlined, labelMode=hidden (material-blue-light).png b/...ebox focused stylingMode=underlined, labelMode=hidden (material-blue-light).png
diff --git a/...used stylingMode=underlined, labelMode=hidden (material-blue-light-compact).png b/...used stylingMode=underlined, labelMode=hidden (material-blue-light-compact).png
diff --git a/...tebox focused stylingMode=underlined, labelMode=outside (fluent-blue-light).png b/...tebox focused stylingMode=underlined, labelMode=outside (fluent-blue-light).png
diff --git a/...cused stylingMode=underlined, labelMode=outside (fluent-blue-light-compact).png b/...cused stylingMode=underlined, labelMode=outside (fluent-blue-light-compact).png
diff --git a/...s/Datebox focused stylingMode=underlined, labelMode=outside (generic-light).png b/...s/Datebox focused stylingMode=underlined, labelMode=outside (generic-light).png
diff --git a/...x focused stylingMode=underlined, labelMode=outside (generic-light-compact).png b/...x focused stylingMode=underlined, labelMode=outside (generic-light-compact).png
diff --git a/...box focused stylingMode=underlined, labelMode=outside (material-blue-light).png b/...box focused stylingMode=underlined, labelMode=outside (material-blue-light).png
diff --git a/...sed stylingMode=underlined, labelMode=outside (material-blue-light-compact).png b/...sed stylingMode=underlined, labelMode=outside (material-blue-light-compact).png
diff --git a/...atebox focused stylingMode=underlined, labelMode=static (fluent-blue-light).png b/...atebox focused stylingMode=underlined, labelMode=static (fluent-blue-light).png
diff --git a/...ocused stylingMode=underlined, labelMode=static (fluent-blue-light-compact).png b/...ocused stylingMode=underlined, labelMode=static (fluent-blue-light-compact).png
diff --git a/...ns/Datebox focused stylingMode=underlined, labelMode=static (generic-light).png b/...ns/Datebox focused stylingMode=underlined, labelMode=static (generic-light).png
diff --git a/...ox focused stylingMode=underlined, labelMode=static (generic-light-compact).png b/...ox focused stylingMode=underlined, labelMode=static (generic-light-compact).png
diff --git a/...ebox focused stylingMode=underlined, labelMode=static (material-blue-light).png b/...ebox focused stylingMode=underlined, labelMode=static (material-blue-light).png
diff --git a/...used stylingMode=underlined, labelMode=static (material-blue-light-compact).png b/...used stylingMode=underlined, labelMode=static (material-blue-light-compact).png
diff --git a/...eme/tests/editors/dateBox/etalons/Datebox label symbols (fluent-blue-light).png b/...eme/tests/editors/dateBox/etalons/Datebox label symbols (fluent-blue-light).png
diff --git a/...extreme/tests/editors/dateBox/etalons/Datebox label symbols (generic-light).png b/...extreme/tests/editors/dateBox/etalons/Datebox label symbols (generic-light).png
diff --git a/...e/tests/editors/dateBox/etalons/Datebox label symbols (material-blue-light).png b/...e/tests/editors/dateBox/etalons/Datebox label symbols (material-blue-light).png
diff --git a/...x/etalons/Datebox label symbols with stylingMode=filled (fluent-blue-light).png b/...x/etalons/Datebox label symbols with stylingMode=filled (fluent-blue-light).png
diff --git a/...teBox/etalons/Datebox label symbols with stylingMode=filled (generic-light).png b/...teBox/etalons/Datebox label symbols with stylingMode=filled (generic-light).png
diff --git a/...etalons/Datebox label symbols with stylingMode=filled (material-blue-light).png b/...etalons/Datebox label symbols with stylingMode=filled (material-blue-light).png
diff --git a/...etalons/Datebox label symbols with stylingMode=outlined (fluent-blue-light).png b/...etalons/Datebox label symbols with stylingMode=outlined (fluent-blue-light).png
diff --git a/...Box/etalons/Datebox label symbols with stylingMode=outlined (generic-light).png b/...Box/etalons/Datebox label symbols with stylingMode=outlined (generic-light).png
diff --git a/...alons/Datebox label symbols with stylingMode=outlined (material-blue-light).png b/...alons/Datebox label symbols with stylingMode=outlined (material-blue-light).png
diff --git a/...alons/Datebox label symbols with stylingMode=underlined (fluent-blue-light).png b/...alons/Datebox label symbols with stylingMode=underlined (fluent-blue-light).png
diff --git a/...x/etalons/Datebox label symbols with stylingMode=underlined (generic-light).png b/...x/etalons/Datebox label symbols with stylingMode=underlined (generic-light).png
diff --git a/...ons/Datebox label symbols with stylingMode=underlined (material-blue-light).png b/...ons/Datebox label symbols with stylingMode=underlined (material-blue-light).png
diff --git a/.../etalons/Datebox stylingMode=filled, labelMode=floating (fluent-blue-light).png b/.../etalons/Datebox stylingMode=filled, labelMode=floating (fluent-blue-light).png
diff --git a/.../Datebox stylingMode=filled, labelMode=floating (fluent-blue-light-compact).png b/.../Datebox stylingMode=filled, labelMode=floating (fluent-blue-light-compact).png
diff --git a/...eBox/etalons/Datebox stylingMode=filled, labelMode=floating (generic-light).png b/...eBox/etalons/Datebox stylingMode=filled, labelMode=floating (generic-light).png
diff --git a/...lons/Datebox stylingMode=filled, labelMode=floating (generic-light-compact).png b/...lons/Datebox stylingMode=filled, labelMode=floating (generic-light-compact).png
diff --git a/...talons/Datebox stylingMode=filled, labelMode=floating (material-blue-light).png b/...talons/Datebox stylingMode=filled, labelMode=floating (material-blue-light).png
diff --git a/...atebox stylingMode=filled, labelMode=floating (material-blue-light-compact).png b/...atebox stylingMode=filled, labelMode=floating (material-blue-light-compact).png
diff --git a/...ox/etalons/Datebox stylingMode=filled, labelMode=hidden (fluent-blue-light).png b/...ox/etalons/Datebox stylingMode=filled, labelMode=hidden (fluent-blue-light).png
diff --git a/...ns/Datebox stylingMode=filled, labelMode=hidden (fluent-blue-light-compact).png b/...ns/Datebox stylingMode=filled, labelMode=hidden (fluent-blue-light-compact).png
diff --git a/...ateBox/etalons/Datebox stylingMode=filled, labelMode=hidden (generic-light).png b/...ateBox/etalons/Datebox stylingMode=filled, labelMode=hidden (generic-light).png
diff --git a/...talons/Datebox stylingMode=filled, labelMode=hidden (generic-light-compact).png b/...talons/Datebox stylingMode=filled, labelMode=hidden (generic-light-compact).png
diff --git a/.../etalons/Datebox stylingMode=filled, labelMode=hidden (material-blue-light).png b/.../etalons/Datebox stylingMode=filled, labelMode=hidden (material-blue-light).png
diff --git a/.../Datebox stylingMode=filled, labelMode=hidden (material-blue-light-compact).png b/.../Datebox stylingMode=filled, labelMode=hidden (material-blue-light-compact).png
diff --git a/...x/etalons/Datebox stylingMode=filled, labelMode=outside (fluent-blue-light).png b/...x/etalons/Datebox stylingMode=filled, labelMode=outside (fluent-blue-light).png
diff --git a/...s/Datebox stylingMode=filled, labelMode=outside (fluent-blue-light-compact).png b/...s/Datebox stylingMode=filled, labelMode=outside (fluent-blue-light-compact).png
diff --git a/...teBox/etalons/Datebox stylingMode=filled, labelMode=outside (generic-light).png b/...teBox/etalons/Datebox stylingMode=filled, labelMode=outside (generic-light).png
diff --git a/...alons/Datebox stylingMode=filled, labelMode=outside (generic-light-compact).png b/...alons/Datebox stylingMode=filled, labelMode=outside (generic-light-compact).png
diff --git a/...etalons/Datebox stylingMode=filled, labelMode=outside (material-blue-light).png b/...etalons/Datebox stylingMode=filled, labelMode=outside (material-blue-light).png
diff --git a/...Datebox stylingMode=filled, labelMode=outside (material-blue-light-compact).png b/...Datebox stylingMode=filled, labelMode=outside (material-blue-light-compact).png
diff --git a/...ox/etalons/Datebox stylingMode=filled, labelMode=static (fluent-blue-light).png b/...ox/etalons/Datebox stylingMode=filled, labelMode=static (fluent-blue-light).png
diff --git a/...ns/Datebox stylingMode=filled, labelMode=static (fluent-blue-light-compact).png b/...ns/Datebox stylingMode=filled, labelMode=static (fluent-blue-light-compact).png
diff --git a/...ateBox/etalons/Datebox stylingMode=filled, labelMode=static (generic-light).png b/...ateBox/etalons/Datebox stylingMode=filled, labelMode=static (generic-light).png
diff --git a/...talons/Datebox stylingMode=filled, labelMode=static (generic-light-compact).png b/...talons/Datebox stylingMode=filled, labelMode=static (generic-light-compact).png
diff --git a/.../etalons/Datebox stylingMode=filled, labelMode=static (material-blue-light).png b/.../etalons/Datebox stylingMode=filled, labelMode=static (material-blue-light).png
diff --git a/.../Datebox stylingMode=filled, labelMode=static (material-blue-light-compact).png b/.../Datebox stylingMode=filled, labelMode=static (material-blue-light-compact).png
diff --git a/...talons/Datebox stylingMode=outlined, labelMode=floating (fluent-blue-light).png b/...talons/Datebox stylingMode=outlined, labelMode=floating (fluent-blue-light).png
diff --git a/...atebox stylingMode=outlined, labelMode=floating (fluent-blue-light-compact).png b/...atebox stylingMode=outlined, labelMode=floating (fluent-blue-light-compact).png
diff --git a/...ox/etalons/Datebox stylingMode=outlined, labelMode=floating (generic-light).png b/...ox/etalons/Datebox stylingMode=outlined, labelMode=floating (generic-light).png
diff --git a/...ns/Datebox stylingMode=outlined, labelMode=floating (generic-light-compact).png b/...ns/Datebox stylingMode=outlined, labelMode=floating (generic-light-compact).png
diff --git a/...lons/Datebox stylingMode=outlined, labelMode=floating (material-blue-light).png b/...lons/Datebox stylingMode=outlined, labelMode=floating (material-blue-light).png
diff --git a/...ebox stylingMode=outlined, labelMode=floating (material-blue-light-compact).png b/...ebox stylingMode=outlined, labelMode=floating (material-blue-light-compact).png
diff --git a/.../etalons/Datebox stylingMode=outlined, labelMode=hidden (fluent-blue-light).png b/.../etalons/Datebox stylingMode=outlined, labelMode=hidden (fluent-blue-light).png
diff --git a/.../Datebox stylingMode=outlined, labelMode=hidden (fluent-blue-light-compact).png b/.../Datebox stylingMode=outlined, labelMode=hidden (fluent-blue-light-compact).png
diff --git a/...eBox/etalons/Datebox stylingMode=outlined, labelMode=hidden (generic-light).png b/...eBox/etalons/Datebox stylingMode=outlined, labelMode=hidden (generic-light).png
diff --git a/...lons/Datebox stylingMode=outlined, labelMode=hidden (generic-light-compact).png b/...lons/Datebox stylingMode=outlined, labelMode=hidden (generic-light-compact).png
diff --git a/...talons/Datebox stylingMode=outlined, labelMode=hidden (material-blue-light).png b/...talons/Datebox stylingMode=outlined, labelMode=hidden (material-blue-light).png
diff --git a/...atebox stylingMode=outlined, labelMode=hidden (material-blue-light-compact).png b/...atebox stylingMode=outlined, labelMode=hidden (material-blue-light-compact).png
diff --git a/...etalons/Datebox stylingMode=outlined, labelMode=outside (fluent-blue-light).png b/...etalons/Datebox stylingMode=outlined, labelMode=outside (fluent-blue-light).png
diff --git a/...Datebox stylingMode=outlined, labelMode=outside (fluent-blue-light-compact).png b/...Datebox stylingMode=outlined, labelMode=outside (fluent-blue-light-compact).png
diff --git a/...Box/etalons/Datebox stylingMode=outlined, labelMode=outside (generic-light).png b/...Box/etalons/Datebox stylingMode=outlined, labelMode=outside (generic-light).png
diff --git a/...ons/Datebox stylingMode=outlined, labelMode=outside (generic-light-compact).png b/...ons/Datebox stylingMode=outlined, labelMode=outside (generic-light-compact).png
diff --git a/...alons/Datebox stylingMode=outlined, labelMode=outside (material-blue-light).png b/...alons/Datebox stylingMode=outlined, labelMode=outside (material-blue-light).png
diff --git a/...tebox stylingMode=outlined, labelMode=outside (material-blue-light-compact).png b/...tebox stylingMode=outlined, labelMode=outside (material-blue-light-compact).png
diff --git a/.../etalons/Datebox stylingMode=outlined, labelMode=static (fluent-blue-light).png b/.../etalons/Datebox stylingMode=outlined, labelMode=static (fluent-blue-light).png
diff --git a/.../Datebox stylingMode=outlined, labelMode=static (fluent-blue-light-compact).png b/.../Datebox stylingMode=outlined, labelMode=static (fluent-blue-light-compact).png
diff --git a/...eBox/etalons/Datebox stylingMode=outlined, labelMode=static (generic-light).png b/...eBox/etalons/Datebox stylingMode=outlined, labelMode=static (generic-light).png
diff --git a/...lons/Datebox stylingMode=outlined, labelMode=static (generic-light-compact).png b/...lons/Datebox stylingMode=outlined, labelMode=static (generic-light-compact).png
diff --git a/...talons/Datebox stylingMode=outlined, labelMode=static (material-blue-light).png b/...talons/Datebox stylingMode=outlined, labelMode=static (material-blue-light).png
diff --git a/...atebox stylingMode=outlined, labelMode=static (material-blue-light-compact).png b/...atebox stylingMode=outlined, labelMode=static (material-blue-light-compact).png
diff --git a/...lons/Datebox stylingMode=underlined, labelMode=floating (fluent-blue-light).png b/...lons/Datebox stylingMode=underlined, labelMode=floating (fluent-blue-light).png
diff --git a/...ebox stylingMode=underlined, labelMode=floating (fluent-blue-light-compact).png b/...ebox stylingMode=underlined, labelMode=floating (fluent-blue-light-compact).png
diff --git a/.../etalons/Datebox stylingMode=underlined, labelMode=floating (generic-light).png b/.../etalons/Datebox stylingMode=underlined, labelMode=floating (generic-light).png
diff --git a/.../Datebox stylingMode=underlined, labelMode=floating (generic-light-compact).png b/.../Datebox stylingMode=underlined, labelMode=floating (generic-light-compact).png
diff --git a/...ns/Datebox stylingMode=underlined, labelMode=floating (material-blue-light).png b/...ns/Datebox stylingMode=underlined, labelMode=floating (material-blue-light).png
diff --git a/...ox stylingMode=underlined, labelMode=floating (material-blue-light-compact).png b/...ox stylingMode=underlined, labelMode=floating (material-blue-light-compact).png
diff --git a/...talons/Datebox stylingMode=underlined, labelMode=hidden (fluent-blue-light).png b/...talons/Datebox stylingMode=underlined, labelMode=hidden (fluent-blue-light).png
diff --git a/...atebox stylingMode=underlined, labelMode=hidden (fluent-blue-light-compact).png b/...atebox stylingMode=underlined, labelMode=hidden (fluent-blue-light-compact).png
diff --git a/...ox/etalons/Datebox stylingMode=underlined, labelMode=hidden (generic-light).png b/...ox/etalons/Datebox stylingMode=underlined, labelMode=hidden (generic-light).png
diff --git a/...ns/Datebox stylingMode=underlined, labelMode=hidden (generic-light-compact).png b/...ns/Datebox stylingMode=underlined, labelMode=hidden (generic-light-compact).png
diff --git a/...lons/Datebox stylingMode=underlined, labelMode=hidden (material-blue-light).png b/...lons/Datebox stylingMode=underlined, labelMode=hidden (material-blue-light).png
diff --git a/...ebox stylingMode=underlined, labelMode=hidden (material-blue-light-compact).png b/...ebox stylingMode=underlined, labelMode=hidden (material-blue-light-compact).png
diff --git a/...alons/Datebox stylingMode=underlined, labelMode=outside (fluent-blue-light).png b/...alons/Datebox stylingMode=underlined, labelMode=outside (fluent-blue-light).png
diff --git a/...tebox stylingMode=underlined, labelMode=outside (fluent-blue-light-compact).png b/...tebox stylingMode=underlined, labelMode=outside (fluent-blue-light-compact).png
diff --git a/...x/etalons/Datebox stylingMode=underlined, labelMode=outside (generic-light).png b/...x/etalons/Datebox stylingMode=underlined, labelMode=outside (generic-light).png
diff --git a/...s/Datebox stylingMode=underlined, labelMode=outside (generic-light-compact).png b/...s/Datebox stylingMode=underlined, labelMode=outside (generic-light-compact).png
diff --git a/...ons/Datebox stylingMode=underlined, labelMode=outside (material-blue-light).png b/...ons/Datebox stylingMode=underlined, labelMode=outside (material-blue-light).png
diff --git a/...box stylingMode=underlined, labelMode=outside (material-blue-light-compact).png b/...box stylingMode=underlined, labelMode=outside (material-blue-light-compact).png
diff --git a/...talons/Datebox stylingMode=underlined, labelMode=static (fluent-blue-light).png b/...talons/Datebox stylingMode=underlined, labelMode=static (fluent-blue-light).png
diff --git a/...atebox stylingMode=underlined, labelMode=static (fluent-blue-light-compact).png b/...atebox stylingMode=underlined, labelMode=static (fluent-blue-light-compact).png
diff --git a/...ox/etalons/Datebox stylingMode=underlined, labelMode=static (generic-light).png b/...ox/etalons/Datebox stylingMode=underlined, labelMode=static (generic-light).png
diff --git a/...ns/Datebox stylingMode=underlined, labelMode=static (generic-light-compact).png b/...ns/Datebox stylingMode=underlined, labelMode=static (generic-light-compact).png
diff --git a/...lons/Datebox stylingMode=underlined, labelMode=static (material-blue-light).png b/...lons/Datebox stylingMode=underlined, labelMode=static (material-blue-light).png
diff --git a/...ebox stylingMode=underlined, labelMode=static (material-blue-light-compact).png b/...ebox stylingMode=underlined, labelMode=static (material-blue-light-compact).png
diff --git a/...ests/editors/dateBox/etalons/Datebox validation message (fluent-blue-light).png b/...ests/editors/dateBox/etalons/Datebox validation message (fluent-blue-light).png
diff --git a/...me/tests/editors/dateBox/etalons/Datebox validation message (generic-light).png b/...me/tests/editors/dateBox/etalons/Datebox validation message (generic-light).png
diff --git a/...ts/editors/dateBox/etalons/Datebox validation message (material-blue-light).png b/...ts/editors/dateBox/etalons/Datebox validation message (material-blue-light).png
diff --git a/...etalons/Datebox validation message with position=bottom (fluent-blue-light).png b/...etalons/Datebox validation message with position=bottom (fluent-blue-light).png
diff --git a/...Datebox validation message with position=bottom (fluent-blue-light-compact).png b/...Datebox validation message with position=bottom (fluent-blue-light-compact).png
diff --git a/...Box/etalons/Datebox validation message with position=bottom (generic-light).png b/...Box/etalons/Datebox validation message with position=bottom (generic-light).png
diff --git a/...ons/Datebox validation message with position=bottom (generic-light-compact).png b/...ons/Datebox validation message with position=bottom (generic-light-compact).png
diff --git a/...alons/Datebox validation message with position=bottom (material-blue-light).png b/...alons/Datebox validation message with position=bottom (material-blue-light).png
diff --git a/...tebox validation message with position=bottom (material-blue-light-compact).png b/...tebox validation message with position=bottom (material-blue-light-compact).png
diff --git a/...x/etalons/Datebox validation message with position=left (fluent-blue-light).png b/...x/etalons/Datebox validation message with position=left (fluent-blue-light).png
diff --git a/...s/Datebox validation message with position=left (fluent-blue-light-compact).png b/...s/Datebox validation message with position=left (fluent-blue-light-compact).png
diff --git a/...teBox/etalons/Datebox validation message with position=left (generic-light).png b/...teBox/etalons/Datebox validation message with position=left (generic-light).png
diff --git a/...alons/Datebox validation message with position=left (generic-light-compact).png b/...alons/Datebox validation message with position=left (generic-light-compact).png
diff --git a/...etalons/Datebox validation message with position=left (material-blue-light).png b/...etalons/Datebox validation message with position=left (material-blue-light).png
diff --git a/...Datebox validation message with position=left (material-blue-light-compact).png b/...Datebox validation message with position=left (material-blue-light-compact).png
diff --git a/.../etalons/Datebox validation message with position=right (fluent-blue-light).png b/.../etalons/Datebox validation message with position=right (fluent-blue-light).png
diff --git a/.../Datebox validation message with position=right (fluent-blue-light-compact).png b/.../Datebox validation message with position=right (fluent-blue-light-compact).png
diff --git a/...eBox/etalons/Datebox validation message with position=right (generic-light).png b/...eBox/etalons/Datebox validation message with position=right (generic-light).png
diff --git a/...lons/Datebox validation message with position=right (generic-light-compact).png b/...lons/Datebox validation message with position=right (generic-light-compact).png
diff --git a/...talons/Datebox validation message with position=right (material-blue-light).png b/...talons/Datebox validation message with position=right (material-blue-light).png
diff --git a/...atebox validation message with position=right (material-blue-light-compact).png b/...atebox validation message with position=right (material-blue-light-compact).png
diff --git a/...ox/etalons/Datebox validation message with position=top (fluent-blue-light).png b/...ox/etalons/Datebox validation message with position=top (fluent-blue-light).png
diff --git a/...ns/Datebox validation message with position=top (fluent-blue-light-compact).png b/...ns/Datebox validation message with position=top (fluent-blue-light-compact).png
diff --git a/...ateBox/etalons/Datebox validation message with position=top (generic-light).png b/...ateBox/etalons/Datebox validation message with position=top (generic-light).png
diff --git a/...talons/Datebox validation message with position=top (generic-light-compact).png b/...talons/Datebox validation message with position=top (generic-light-compact).png
diff --git a/.../etalons/Datebox validation message with position=top (material-blue-light).png b/.../etalons/Datebox validation message with position=top (material-blue-light).png
diff --git a/.../Datebox validation message with position=top (material-blue-light-compact).png b/.../Datebox validation message with position=top (material-blue-light-compact).png
diff --git a/e2e/testcafe-devextreme/tests/editors/dateBox/label.ts b/e2e/testcafe-devextreme/tests/editors/dateBox/label.ts
@@ -12,71 +12,73 @@ import {
 const DATEBOX_CLASS = 'dx-datebox';
 
 const stylingModes = ['outlined', 'underlined', 'filled'];
+const visibleLabelModes = ['floating', 'static', 'outside'];
 
 fixture.disablePageReloads`DateBox_Label`
   .page(url(__dirname, '../../container.html'));
 
-stylingModes.forEach((stylingMode) => {
-  test(`Symbol parts in label should not be cropped with stylingMode=${stylingMode}`, async (t) => {
-    const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
-
-    await testScreenshot(t, takeScreenshot, `Datebox label symbols with stylingMode=${stylingMode}.png`, { element: '#container' });
-
-    await t
-      .expect(compareResults.isValid())
-      .ok(compareResults.errorMessages());
-  }).before(async () => {
-    await appendElementTo('#container', 'div', 'dateBox');
-    await setStyleAttribute(Selector('#container'), 'box-sizing: border-box; width: 300px; height: 400px; padding: 8px;');
-
-    return createWidget('dxDateBox', {
-      label: 'qwerty QWERTY 1234567890',
-      stylingMode,
-      value: new Date(1900, 0, 1),
-    }, '#dateBox');
-  });
+test('Symbol parts in label should not be cropped', async (t) => {
+  const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
+
+  await testScreenshot(t, takeScreenshot, 'Datebox label symbols.png', { element: '#container' });
+
+  await t
+    .expect(compareResults.isValid())
+    .ok(compareResults.errorMessages());
+}).before(async () => {
+  await appendElementTo('#container', 'div', 'dateBox');
+  await setStyleAttribute(Selector('#container'), 'box-sizing: border-box; width: 300px; height: 600px; padding: 8px;');
+
+  for (const stylingMode of stylingModes) {
+    for (const labelMode of visibleLabelModes) {
+      const id = `${`dx${new Guid()}`}`;
+
+      await appendElementTo('#container', 'div', id, { });
+
+      await createWidget('dxDateBox', {
+        label: 'qwerty QWERTY 1234567890',
+        stylingMode,
+        labelMode,
+        value: new Date(1900, 0, 1),
+      }, `#${id}`);
+    }
+  }
 });
 
-[true, false].forEach((isValid) => {
-  test(`DateBox with buttons container, isValid=${isValid}`, async (t) => {
-    const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
-
-    await insertStylesheetRulesToPage(`#container { display: flex; flex-wrap: wrap; } .${DATEBOX_CLASS} { width: 220px; margin: 2px; }`);
-
-    await testScreenshot(t, takeScreenshot, `DateBox render with buttons container, isValid=${isValid}.png`, { shouldTestInCompact: true });
-
-    await removeStylesheetRulesFromPage();
-
-    await t
-      .expect(compareResults.isValid())
-      .ok(compareResults.errorMessages());
-  }).before(async () => {
-    for (const stylingMode of stylingModes) {
-      for (const buttons of [
-        ['clear'],
-        ['clear', 'dropDown'],
-        [{ name: 'custom', location: 'after', options: { icon: 'home' } }, 'clear', 'dropDown'],
-        ['clear', { name: 'custom', location: 'after', options: { icon: 'home' } }, 'dropDown'],
-        ['clear', 'dropDown', { name: 'custom', location: 'after', options: { icon: 'home' } }],
-        [{ name: 'custom', location: 'before', options: { icon: 'home' } }, 'clear', 'dropDown'],
-        ['clear', { name: 'custom', location: 'before', options: { icon: 'home' } }, 'dropDown'],
-        ['clear', 'dropDown', { name: 'custom', location: 'before', options: { icon: 'home' } }],
-      ]) {
-        for (const rtlEnabled of [true, false]) {
-          const id = `${`dx${new Guid()}`}`;
-
-          await appendElementTo('#container', 'div', id, { });
-
-          await createWidget('dxDateBox', {
-            value: new Date(2021, 9, 17),
-            stylingMode,
-            rtlEnabled,
-            buttons,
-            showClearButton: true,
-            isValid,
-          }, `#${id}`);
-        }
+test('DateBox with buttons container', async (t) => {
+  const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
+
+  await insertStylesheetRulesToPage(`#container { display: flex; flex-wrap: wrap; } .${DATEBOX_CLASS} { width: 220px; margin: 2px; }`);
+
+  await testScreenshot(t, takeScreenshot, 'DateBox render with buttons container.png');
+
+  await removeStylesheetRulesFromPage();
+
+  await t
+    .expect(compareResults.isValid())
+    .ok(compareResults.errorMessages());
+}).before(async () => {
+  for (const stylingMode of stylingModes) {
+    for (const buttons of [
+      ['clear'],
+      ['clear', 'dropDown'],
+      [{ name: 'custom', location: 'after', options: { icon: 'home' } }, 'clear', 'dropDown'],
+      ['clear', { name: 'custom', location: 'after', options: { icon: 'home' } }, 'dropDown'],
+      ['clear', 'dropDown', { name: 'custom', location: 'after', options: { icon: 'home' } }],
+    ]) {
+      for (const isValid of [true, false]) {
+        const id = `${`dx${new Guid()}`}`;
+
+        await appendElementTo('#container', 'div', id, { });
+
+        await createWidget('dxDateBox', {
+          value: new Date(2021, 9, 17),
+          stylingMode,
+          buttons,
+          showClearButton: true,
+          isValid,
+        }, `#${id}`);
       }
     }
-  });
+  }
 });
diff --git a/e2e/testcafe-devextreme/tests/editors/dateBox/validationMessage.ts b/e2e/testcafe-devextreme/tests/editors/dateBox/validationMessage.ts
@@ -1,45 +1,55 @@
 import { createScreenshotsComparer } from 'devextreme-screenshot-comparer';
 import DateBox from 'devextreme-testcafe-models/dateBox';
+import Guid from 'devextreme/core/guid';
 import { safeSizeTest } from '../../../helpers/safeSizeTest';
 import url from '../../../helpers/getPageUrl';
 import { createWidget } from '../../../helpers/createWidget';
 import { testScreenshot } from '../../../helpers/themeUtils';
+import { appendElementTo } from '../../../helpers/domUtils';
 
 fixture.disablePageReloads`DateBox ValidationMessagePosition`
   .page(url(__dirname, '../../container.html'));
 
 const positions = ['top', 'right', 'bottom', 'left'];
 
-positions.forEach((position) => {
-  safeSizeTest(`DateBox ValidationMessage position is correct (${position})`, async (t) => {
-    const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
+safeSizeTest('DateBox ValidationMessage position is correct', async (t) => {
+  const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
-    const dateBox = new DateBox('#container');
+  // eslint-disable-next-line no-restricted-syntax
+  for (const id of t.ctx.ids) {
+    const dateBox = new DateBox(`#${id}`);
     await dateBox.option('value', new Date(2022, 6, 14));
+  }
 
-    await testScreenshot(t, takeScreenshot, `Datebox validation message with position=${position}.png`, {
-      shouldTestInCompact: true,
-      compactCallBack: async () => dateBox.option('value', new Date(2022, 6, 15)),
-    });
+  await testScreenshot(t, takeScreenshot, 'Datebox validation message.png');
 
-    await t
-      .expect(compareResults.isValid())
-      .ok(compareResults.errorMessages());
-  }, [300, 200]).before(async () => {
+  await t
+    .expect(compareResults.isValid())
+    .ok(compareResults.errorMessages());
+}, [600, 400]).before(async (t) => {
+  t.ctx.ids = [];
+
+  // eslint-disable-next-line no-restricted-syntax
+  for (const position of positions) {
+    const id = `${`dx${new Guid()}`}`;
+
+    await appendElementTo('#container', 'div', id, {});
+
+    t.ctx.ids.push(id);
     await createWidget('dxDateBox', {
-      elementAttr: { style: 'margin: 50px 0 0 100px;' },
-      width: 100,
+      elementAttr: { style: 'display: inline-block; margin: 50px 100px 0 0;' },
+      width: 150,
       height: 40,
       validationMessageMode: 'always',
       validationMessagePosition: position,
-    });
+    }, `#${id}`);
 
-    return createWidget('dxValidator', {
+    await createWidget('dxValidator', {
       validationRules: [{
         type: 'range',
         max: new Date(1),
         message: 'out of range',
       }],
-    });
-  });
+    }, `#${id}`);
+  }
 });