Merge pull request #2528 from dvkruchinin/dkru/fix-cypress-test-case23

Fix cypress test case 23.

tests/cypress/integration/actions_tasks_objects/case_23_canvas_grid_feature.js

@@ -10,7 +10,15 @@ context('Canvas grid feature', () => {
     const caseId = '23';
     const settingsGridSize = 50;
     const gridColor = 'Black';
-    const gridOpacity = 49;
+    const gridOpacity = 80;
+
+    function generateString(countPointsToMove) {
+        let action = '';
+        for (let i = 0; i < countPointsToMove; i++) {
+            action += '{leftarrow}';
+        }
+        return action;
+    }
 
     before(() => {
         cy.openTaskJob(taskName);
@@ -35,14 +43,13 @@ context('Canvas grid feature', () => {
                 .contains(new RegExp(`^${gridColor}$`, 'g'))
                 .click();
         });
-        it('Set "Grid opacity" to 49%.', () => {
+        it('Set "Grid opacity" to 80%.', () => {
-            cy.get('.cvat-player-settings-grid-opacity-input')
+            cy.get('.cvat-player-settings-grid-opacity-input').within(() => {
-                .click()
+                cy.get('[role="slider"]').type(generateString(20)); // Moving the slider to the left up to 80.
-                .within(() => {
+                cy.get('[role="slider"]').should('have.attr', 'aria-valuenow', gridOpacity);
-                    cy.get('[role="slider"]').should('have.attr', 'aria-valuenow', gridOpacity);
+            });
-                });
         });
-        it('Canvas has grid drawn, it is black, cells are 50x50px and it has 49% opacity.', () => {
+        it('Canvas has grid drawn, it is black, cells are 50x50px and it has 80% opacity.', () => {
             cy.get('#cvat_canvas_grid')
                 .should('be.visible') // expected <svg#cvat_canvas_grid> to be visible
                 .within(() => {
@@ -53,7 +60,7 @@ context('Canvas grid feature', () => {
                             'have.attr',
                             'style',
                             `stroke: ${gridColor.toLowerCase()}; opacity: ${gridOpacity / 100};`,
-                        ); // expected to have attribute style with the value stroke: black; opacity: 0.49;
+                        ); // expected to have attribute style with the value stroke: black; opacity: 0.8;
                 });
         });
     });