chore: Migrate tests to RTL (6)

jest.config.js

@@ -9,8 +9,6 @@ module.exports = {
     '<rootDir>/packages/*.*/.cache/*.*'
   ],
   roots: ['<rootDir>/packages'],
-  setupFiles: ['<rootDir>/jest.env.js'],
-  snapshotSerializers: ['enzyme-to-json/serializer'],
   transform: {
     '^.+\\.[jt]sx?$': 'babel-jest'
   },

package.json

@@ -36,17 +36,13 @@
     "@testing-library/jest-dom": "^5.16.2",
     "@testing-library/react": "^12.1.2",
     "@testing-library/user-event": "^13.5.0",
-    "@types/enzyme": "3.9.0",
     "@types/jest": "27.0.2",
     "@types/react": "^17.0.0",
     "@types/react-dom": "^17.0.0",
     "@typescript-eslint/eslint-plugin": "^4.4.1",
     "@typescript-eslint/parser": "^4.4.1",
-    "@wojtekmaj/enzyme-adapter-react-17": "^0.3.1",
     "babel-jest": "^27.2.5",
     "concurrently": "^5.3.0",
-    "enzyme": "3.10.0",
-    "enzyme-to-json": "3.4.0",
     "eslint": "^7.11.0",
     "eslint-plugin-markdown": "^1.0.2",
     "eslint-plugin-prettier": "^3.1.4",

packages/react-console/src/components/AccessConsoles/__tests__/AccessConsoles.test.tsx

@@ -0,0 +1,110 @@
+import React from 'react';
+
+import { render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import '@testing-library/jest-dom';
+
+import { AccessConsoles } from '../AccessConsoles';
+import { SerialConsole } from '../../SerialConsole';
+import { VncConsole } from '../../VncConsole';
+import { DesktopViewer } from '../../DesktopViewer';
+import { constants } from '../../common/constants';
+
+const { SERIAL_CONSOLE_TYPE, LOADING } = constants;
+
+const MyVncConsoleTestWrapper = () => <p>VNC console text</p>;
+const SerialConsoleConnected = () => <p>Serial console text</p>;
+
+const vnc = {
+  address: 'my.host.com',
+  port: 5902,
+  tlsPort: '5903'
+};
+
+describe('AccessConsoles', () => {
+  beforeAll(() => {
+    window.HTMLCanvasElement.prototype.getContext = () => ({ canvas: {} } as any);
+  });
+
+  test('with SerialConsole as a single child', () => {
+    const { asFragment } = render(
+      <AccessConsoles>
+        <SerialConsole onData={jest.fn()} onConnect={jest.fn()} onDisconnect={jest.fn()} status={LOADING} />
+      </AccessConsoles>
+    );
+    expect(asFragment()).toMatchSnapshot();
+  });
+
+  test('with VncConsole as a single child', () => {
+    const { asFragment } = render(
+      <AccessConsoles>
+        <VncConsole host="foo.bar.host" textDisconnected="Disconnected state text" />
+      </AccessConsoles>
+    );
+    expect(asFragment()).toMatchSnapshot();
+  });
+
+  test('with SerialConsole and VncConsole as children', () => {
+    const { asFragment } = render(
+      <AccessConsoles>
+        <VncConsole host="foo.bar.host" textDisconnected="Disconnected state text" />
+        <SerialConsole onData={jest.fn()} onConnect={jest.fn()} onDisconnect={jest.fn()} status={LOADING} />
+      </AccessConsoles>
+    );
+    expect(asFragment()).toMatchSnapshot();
+  });
+
+  test('with wrapped SerialConsole as a child', () => {
+    const { asFragment } = render(
+      <AccessConsoles>
+        <SerialConsoleConnected />
+      </AccessConsoles>
+    );
+    expect(asFragment()).toMatchSnapshot();
+  });
+
+  test('with preselected SerialConsole', () => {
+    const { asFragment } = render(
+      <AccessConsoles preselectedType={SERIAL_CONSOLE_TYPE}>
+        <SerialConsole onData={jest.fn()} onConnect={jest.fn()} onDisconnect={jest.fn()} status={LOADING} />
+      </AccessConsoles>
+    );
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+
+  test('switching SerialConsole and VncConsole', () => {
+    render(
+      <AccessConsoles>
+        <MyVncConsoleTestWrapper />
+        <SerialConsole onData={jest.fn()} onConnect={jest.fn()} onDisconnect={jest.fn()} status={LOADING} />
+      </AccessConsoles>
+    );
+
+    // VNC (first option) is initially selected
+    expect(screen.queryByText(/Loading/)).toBeNull();
+    expect(screen.getByText('VNC console text')).toBeInTheDocument();
+
+    // Open dropdown and select "Serial console" option
+    userEvent.click(screen.getByRole('button', { name: 'Options menu' }));
+    userEvent.click(screen.getByText('Serial console', { selector: 'button' }));
+
+    // VNC content is no longer visible, and loading contents of the Serial console are visible.
+    expect(screen.getByText(/Loading/)).toBeInTheDocument();
+    expect(screen.queryByText('VNC console text')).toBeNull();
+  });
+
+  test('Empty', () => {
+    const { asFragment } = render(<AccessConsoles />);
+    expect(asFragment()).toMatchSnapshot();
+  });
+
+  test('with DesktopViewer', () => {
+    const { asFragment } = render(
+      <AccessConsoles>
+        <DesktopViewer vnc={vnc} />
+      </AccessConsoles>
+    );
+    expect(asFragment()).toMatchSnapshot();
+  });
+});