From 24027931f91e87223241f26cd71045ed4a4c9304 Mon Sep 17 00:00:00 2001
From: Boris Sekachev <boris.sekachev@yandex.ru>
Date: Fri, 18 Sep 2020 12:18:45 +0300
Subject: [PATCH] Added more css selectors to cypress testing (#2197)

---
 .../controls-side-bar/cursor-control.tsx               |  2 +-
 .../controls-side-bar/fit-control.tsx                  | 10 ++++++----
 .../controls-side-bar/group-control.tsx                |  3 ++-
 .../controls-side-bar/merge-control.tsx                |  3 ++-
 .../controls-side-bar/move-control.tsx                 |  2 +-
 .../controls-side-bar/resize-control.tsx               |  7 ++-----
 .../controls-side-bar/rotate-control.tsx               |  8 ++------
 .../controls-side-bar/setup-tag-control.tsx            |  8 ++------
 .../controls-side-bar/split-control.tsx                |  3 ++-
 9 files changed, 20 insertions(+), 26 deletions(-)

diff --git a/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/cursor-control.tsx b/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/cursor-control.tsx
index e4f0ec15..b3ba38ca 100644
--- a/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/cursor-control.tsx
+++ b/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/cursor-control.tsx
@@ -28,7 +28,7 @@ function CursorControl(props: Props): JSX.Element {
             <Icon
                 component={CursorIcon}
                 className={activeControl === ActiveControl.CURSOR
-                    ? 'cvat-active-canvas-control' : ''}
+                    ? 'cvat-active-canvas-control cvat-cursor-control' : 'cvat-cursor-control'}
                 onClick={
                     activeControl !== ActiveControl.CURSOR
                         ? (): void => canvasInstance.cancel()
diff --git a/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/fit-control.tsx b/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/fit-control.tsx
index 0ad4e788..84034525 100644
--- a/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/fit-control.tsx
+++ b/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/fit-control.tsx
@@ -14,13 +14,15 @@ interface Props {
 }
 
 function FitControl(props: Props): JSX.Element {
-    const {
-        canvasInstance,
-    } = props;
+    const { canvasInstance } = props;
 
     return (
         <Tooltip title='Fit the image [Double Click]' placement='right' mouseLeaveDelay={0}>
-            <Icon component={FitIcon} onClick={(): void => canvasInstance.fit()} />
+            <Icon
+                className='cvat-fit-control'
+                component={FitIcon}
+                onClick={(): void => canvasInstance.fit()}
+            />
         </Tooltip>
     );
 }
diff --git a/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/group-control.tsx b/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/group-control.tsx
index 15cf9be1..1432be7c 100644
--- a/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/group-control.tsx
+++ b/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/group-control.tsx
@@ -29,12 +29,13 @@ function GroupControl(props: Props): JSX.Element {
 
     const dynamicIconProps = activeControl === ActiveControl.GROUP
         ? {
-            className: 'cvat-active-canvas-control',
+            className: 'cvat-group-control cvat-active-canvas-control',
             onClick: (): void => {
                 canvasInstance.group({ enabled: false });
                 groupObjects(false);
             },
         } : {
+            className: 'cvat-group-control',
             onClick: (): void => {
                 canvasInstance.cancel();
                 canvasInstance.group({ enabled: true });
diff --git a/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/merge-control.tsx b/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/merge-control.tsx
index 2ac9f432..3b3fdd0a 100644
--- a/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/merge-control.tsx
+++ b/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/merge-control.tsx
@@ -27,12 +27,13 @@ function MergeControl(props: Props): JSX.Element {
 
     const dynamicIconProps = activeControl === ActiveControl.MERGE
         ? {
-            className: 'cvat-active-canvas-control',
+            className: 'cvat-merge-control cvat-active-canvas-control',
             onClick: (): void => {
                 canvasInstance.merge({ enabled: false });
                 mergeObjects(false);
             },
         } : {
+            className: 'cvat-merge-control',
             onClick: (): void => {
                 canvasInstance.cancel();
                 canvasInstance.merge({ enabled: true });
diff --git a/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/move-control.tsx b/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/move-control.tsx
index 1a25f2bf..fadb2142 100644
--- a/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/move-control.tsx
+++ b/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/move-control.tsx
@@ -23,7 +23,7 @@ function MoveControl(props: Props): JSX.Element {
             <Icon
                 component={MoveIcon}
                 className={activeControl === ActiveControl.DRAG_CANVAS
-                    ? 'cvat-active-canvas-control' : ''}
+                    ? 'cvat-move-control cvat-active-canvas-control' : 'cvat-move-control'}
                 onClick={(): void => {
                     if (activeControl === ActiveControl.DRAG_CANVAS) {
                         canvasInstance.dragCanvas(false);
diff --git a/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/resize-control.tsx b/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/resize-control.tsx
index beec7e02..2e923307 100644
--- a/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/resize-control.tsx
+++ b/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/resize-control.tsx
@@ -16,17 +16,14 @@ interface Props {
 }
 
 function ResizeControl(props: Props): JSX.Element {
-    const {
-        activeControl,
-        canvasInstance,
-    } = props;
+    const { activeControl, canvasInstance } = props;
 
     return (
         <Tooltip title='Select a region of interest' placement='right' mouseLeaveDelay={0}>
             <Icon
                 component={ZoomIcon}
                 className={activeControl === ActiveControl.ZOOM_CANVAS
-                    ? 'cvat-active-canvas-control' : ''}
+                    ? 'cvat-resize-control cvat-active-canvas-control' : 'cvat-resize-control'}
                 onClick={(): void => {
                     if (activeControl === ActiveControl.ZOOM_CANVAS) {
                         canvasInstance.zoomCanvas(false);
diff --git a/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/rotate-control.tsx b/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/rotate-control.tsx
index e5aa8691..c5504430 100644
--- a/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/rotate-control.tsx
+++ b/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/rotate-control.tsx
@@ -17,11 +17,7 @@ interface Props {
 }
 
 function RotateControl(props: Props): JSX.Element {
-    const {
-        anticlockwiseShortcut,
-        clockwiseShortcut,
-        rotateFrame,
-    } = props;
+    const { anticlockwiseShortcut, clockwiseShortcut, rotateFrame } = props;
 
     return (
         <Popover
@@ -47,7 +43,7 @@ function RotateControl(props: Props): JSX.Element {
             )}
             trigger='hover'
         >
-            <Icon component={RotateIcon} />
+            <Icon className='cvat-rotate-canvas-control' component={RotateIcon} />
         </Popover>
     );
 }
diff --git a/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/setup-tag-control.tsx b/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/setup-tag-control.tsx
index 0d580da7..a2b97084 100644
--- a/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/setup-tag-control.tsx
+++ b/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/setup-tag-control.tsx
@@ -17,9 +17,7 @@ interface Props {
 }
 
 function SetupTagControl(props: Props): JSX.Element {
-    const {
-        isDrawing,
-    } = props;
+    const { isDrawing } = props;
 
     const dynamcPopoverPros = isDrawing ? {
         overlayStyle: {
@@ -36,9 +34,7 @@ function SetupTagControl(props: Props): JSX.Element {
                 <SetupTagPopoverContainer />
             )}
         >
-            <Icon
-                component={TagIcon}
-            />
+            <Icon className='cvat-setup-tag-control' component={TagIcon} />
         </Popover>
     );
 }
diff --git a/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/split-control.tsx b/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/split-control.tsx
index e700d287..176563a7 100644
--- a/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/split-control.tsx
+++ b/cvat-ui/src/components/annotation-page/standard-workspace/controls-side-bar/split-control.tsx
@@ -27,12 +27,13 @@ function SplitControl(props: Props): JSX.Element {
 
     const dynamicIconProps = activeControl === ActiveControl.SPLIT
         ? {
-            className: 'cvat-active-canvas-control',
+            className: 'cvat-split-track-control cvat-active-canvas-control',
             onClick: (): void => {
                 canvasInstance.split({ enabled: false });
                 splitTrack(false);
             },
         } : {
+            className: 'cvat-split-track-control',
             onClick: (): void => {
                 canvasInstance.cancel();
                 canvasInstance.split({ enabled: true });