Scheduler: use testScreenshot utility in e2e tests 2 (#31628)

Author: anna-shakhova

e2e/testcafe-devextreme/tests/scheduler/common/a11y/contrast.ts

@@ -7,6 +7,10 @@ import { testScreenshot } from '../../../../helpers/themeUtils';
 fixture.disablePageReloads`a11y - contrast`
   .page(url(__dirname, '../../../container.html'));
 
+// visual: generic.light
+// visual: generic.dark
+// visual: fluent.light
+// visual: fluent.dark
 test('Scheduler a11y: Insufficient contrast of day numbers in the MonthView', async (t) => {
   const scheduler = new Scheduler('#container');
   const { takeScreenshot, compareResults } = createScreenshotsComparer(t);

e2e/testcafe-devextreme/tests/scheduler/common/appointmentForm/form.visual.ts

@@ -59,6 +59,9 @@ const getResources = (withIcons = false) => ([
   },
 ]);
 
+// visual: generic.light
+// visual: fluent.blue.light
+// visual: material.blue.light
 [
   { isRecurringAppointment: false, isAllDay: true },
   { isRecurringAppointment: false, isAllDay: false },

e2e/testcafe-devextreme/tests/scheduler/common/header/etalons/scheduler-toolbar-menu (fluent.blue.light).png

@@ -20,7 +20,7 @@ test('items inside toolbar menu should stretch', async (t) => {
 
   await t.click(scheduler.toolbar.menuButton);
 
-  await takeScreenshot('scheduler-toolbar-menu.png');
+  await testScreenshot(t, takeScreenshot, 'scheduler-toolbar-menu.png');
 
   await t
     .expect(compareResults.isValid())
@@ -37,6 +37,9 @@ test('items inside toolbar menu should stretch', async (t) => {
   },
 }));
 
+// visual: generic.light
+// visual: fluent.blue.light
+// visual: material.blue.light
 test('Scheduler header should have correct sizes', async (t) => {
   const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
   const scheduler = new Scheduler('#container');

…eader/etalons/scheduler-toolbar-menu.png …heduler-toolbar-menu (generic.light).pnge2e/testcafe-devextreme/tests/scheduler/common/header/etalons/scheduler-toolbar-menu.png renamed to e2e/testcafe-devextreme/tests/scheduler/common/header/etalons/scheduler-toolbar-menu (generic.light).png e2e/testcafe-devextreme/tests/scheduler/common/header/etalons/scheduler-toolbar-menu.png renamed to e2e/testcafe-devextreme/tests/scheduler/common/header/etalons/scheduler-toolbar-menu (generic.light).png

@@ -26,6 +26,9 @@ const createScheduler = async (
   });
 };
 
+// visual: generic.light
+// visual: fluent.blue.light
+// visual: material.blue.light
 [false, true].forEach((rtlEnabled) => {
   [false, true].forEach((crossScrollingEnabled) => {
     test.meta({ browserSize: ADAPTIVE_SIZE })(`Adaptive views layout test, crossScrollingEnabled=${crossScrollingEnabled}${rtlEnabled ? 'in RTL' : ''}`, async (t) => {

e2e/testcafe-devextreme/tests/scheduler/common/header/sizes.ts

@@ -62,6 +62,9 @@ const getSchedulerBaseOptions = (view: string) => {
   };
 };
 
+// visual: generic.light
+// visual: fluent.blue.light
+// visual: material.blue.light
 generateOptionMatrix({
   view: ['week', 'month', 'timelineWeek'],
   adaptivityEnabled: [true, false],
@@ -86,6 +89,9 @@ generateOptionMatrix({
   }));
 });
 
+// visual: generic.light
+// visual: fluent.blue.light
+// visual: material.blue.light
 test('Appointment collector has correct offset when month view with double interval', async (t) => {
   const scheduler = new Scheduler('#container');
 

e2e/testcafe-devextreme/tests/scheduler/common/layout/adaptive/adaptive.ts

@@ -7,6 +7,9 @@ import { testScreenshot } from '../../../../../helpers/themeUtils';
 fixture.disablePageReloads`AppointmentForm screenshot tests`
   .page(url(__dirname, '../../../../container.html'));
 
+// visual: generic.light
+// visual: fluent.blue.light
+// visual: material.blue.light
 ['day', 'week', 'workWeek', 'month', 'timelineDay', 'timelineWeek', 'timelineWorkWeek', 'timelineMonth', 'agenda'].forEach((currentView) => {
   [true, false].forEach((rtlEnabled) => {
     test('Appointemt form tests', async (t) => {

e2e/testcafe-devextreme/tests/scheduler/common/layout/appointments/collector.ts

@@ -7,6 +7,9 @@ import { testScreenshot } from '../../../../../helpers/themeUtils';
 fixture.disablePageReloads`AppointmentForm screenshot tests`
   .page(url(__dirname, '../../../../container.html'));
 
+// visual: generic.light
+// visual: fluent.blue.light
+// visual: material.blue.light
 test('Appointemt form tests', async (t) => {
   const scheduler = new Scheduler('#container');
   const { legacyAppointmentPopup: appointmentPopup } = scheduler;

e2e/testcafe-devextreme/tests/scheduler/common/layout/appointments/recurrence.ts

@@ -19,6 +19,9 @@ const createScheduler = async (view: string, resourcesValue?: unknown[]): Promis
   });
 };
 
+// visual: generic.light
+// visual: fluent.blue.light
+// visual: material.blue.light
 [undefined, resourceDataSource].forEach((resourcesValue) => {
   ['agenda', 'day', 'week', 'month', 'workWeek'].forEach((view) => {
     test(`Base views layout test with resources(view='${view})', resource=${!!resourcesValue}`, async (t) => {
@@ -38,6 +41,9 @@ const createScheduler = async (view: string, resourcesValue?: unknown[]): Promis
   });
 });
 
+// visual: generic.light
+// visual: fluent.blue.light
+// visual: material.blue.light
 [undefined, resourceDataSource].forEach((resourcesValue) => {
   ['timelineDay', 'timelineWeek', 'timelineMonth', 'timelineWorkWeek'].forEach((view) => {
     test(`Timeline views layout test with resources(view='${view})', resource=${!!resourcesValue}`, async (t) => {
@@ -62,6 +68,9 @@ const createScheduler = async (view: string, resourcesValue?: unknown[]): Promis
   });
 });
 
+// visual: generic.light
+// visual: fluent.blue.light
+// visual: material.blue.light
 test('Scheduler should have correct height in month view (T927862)', async (t) => {
   const scheduler = new Scheduler('#container');