Cypress test. Shortcuts window. (#3065)

* Add css classes.

* Cypress test. Shortcuts window.

* Fix naming of var

cvat-ui/src/components/shortcuts-dialog/shortcuts-dialog.tsx

@@ -2,12 +2,12 @@
 //
 // SPDX-License-Identifier: MIT
 
-import { shortcutsActions } from 'actions/shortcuts-actions';
 import Modal from 'antd/lib/modal';
 import Table from 'antd/lib/table';
 import React from 'react';
-import { getApplicationKeyMap } from 'utils/mousetrap-react';
 import { connect } from 'react-redux';
+import { getApplicationKeyMap } from 'utils/mousetrap-react';
+import { shortcutsActions } from 'actions/shortcuts-actions';
 import { CombinedState } from 'reducers/interfaces';
 
 interface StateToProps {
@@ -93,8 +93,9 @@ function ShorcutsDialog(props: StateToProps & DispatchToProps): JSX.Element | nu
             onOk={switchShortcutsDialog}
             cancelButtonProps={{ style: { display: 'none' } }}
             zIndex={1001} /* default antd is 1000 */
+            className='cvat-shortcuts-modal-window'
         >
-            <Table dataSource={dataSource} columns={columns} size='small' />
+            <Table dataSource={dataSource} columns={columns} size='small' className='cvat-shortcuts-modal-window-table' />
         </Modal>
     );
 }

tests/cypress/integration/actions_tasks_objects/case_71_shortcuts_window.js

@@ -0,0 +1,46 @@
+// Copyright (C) 2021 Intel Corporation
+//
+// SPDX-License-Identifier: MIT
+
+/// <reference types="cypress" />
+
+import { taskName } from '../../support/const';
+
+context('Shortcuts window.', () => {
+    const caseId = '71';
+    const keyCodeF1 = 112;
+    let shortcutsTableTrCount = 0;
+
+    before(() => {
+        cy.openTask(taskName);
+    });
+
+    describe(`Testing case "${caseId}"`, () => {
+        it('Press "F1" from a task. Shortcuts window be visible. Closing the modal window by button "OK".', () => {
+            cy.get('body').trigger('keydown', { keyCode: keyCodeF1 });
+            cy.get('.cvat-shortcuts-modal-window').should('exist').and('be.visible').within(() => {
+                cy.get('.cvat-shortcuts-modal-window-table').within(() => {
+                    cy.get('tr').should('exist').then(($shortcutsTableTrCount) => {
+                        shortcutsTableTrCount = $shortcutsTableTrCount.length;
+                    });
+                });
+                cy.contains('button', 'OK').click();
+            });
+            cy.get('.cvat-shortcuts-modal-window').should('not.be.visible');
+        });
+
+        it('Open a job. Press "F1". Shortcuts window be visible. Closing the modal window by F1.', () => {
+            cy.openJob();
+            cy.get('body').trigger('keydown', { keyCode: keyCodeF1 });
+            cy.get('.cvat-shortcuts-modal-window').should('exist').and('be.visible').within(() => {
+                cy.get('.cvat-shortcuts-modal-window-table').within(() => {
+                    cy.get('tr').should('exist').then(($shortcutsTableTrCount) => {
+                        expect($shortcutsTableTrCount.length).to.be.gt(shortcutsTableTrCount);
+                    });
+                });
+            });
+            cy.get('body').trigger('keydown', { keyCode: keyCodeF1 });
+            cy.get('.cvat-shortcuts-modal-window').should('not.be.visible');
+        });
+    });
+});