diff --git a/webpack/assets/javascripts/react_app/components/SettingsTable/__tests__/SettingsTable.test.js b/webpack/assets/javascripts/react_app/components/SettingsTable/__tests__/SettingsTable.test.js index 36dc6d9a19..1ff0f4dec4 100644 --- a/webpack/assets/javascripts/react_app/components/SettingsTable/__tests__/SettingsTable.test.js +++ b/webpack/assets/javascripts/react_app/components/SettingsTable/__tests__/SettingsTable.test.js @@ -1,4 +1,3 @@ -import { testComponentSnapshotsWithFixtures } from '@theforeman/test'; import React from "react"; import {render, screen, within} from '@testing-library/react' import userEvent from '@testing-library/user-event'; @@ -12,12 +11,6 @@ import { groupedSettings } from '../../SettingRecords/__tests__/SettingRecords.f import SettingsTable from '../SettingsTable'; import {APIActions} from "../../../redux/API"; -const fixtures = { - 'should render': { - settings: groupedSettings['General'], - onEditClick: () => {}, - }, -}; const mockStore = configureMockStore([thunk]); const store = mockStore({ @@ -25,10 +18,6 @@ const store = mockStore({ jest.spyOn(APIActions, 'put').mockReturnValue({ type: 'DUMMY' }); -describe('SettingsTableSnapshot', () => - testComponentSnapshotsWithFixtures(SettingsTable, fixtures) -) - async function extracted(text = '') { const editButton = document.querySelector('button#http_proxy_except_list'); diff --git a/webpack/assets/javascripts/react_app/components/SettingsTable/__tests__/__snapshots__/SettingsTable.test.js.snap b/webpack/assets/javascripts/react_app/components/SettingsTable/__tests__/__snapshots__/SettingsTable.test.js.snap deleted file mode 100644 index 5ef93b6b26..0000000000 --- a/webpack/assets/javascripts/react_app/components/SettingsTable/__tests__/__snapshots__/SettingsTable.test.js.snap +++ /dev/null @@ -1,103 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`SettingsTableSnapshot should render 1`] = ` - - - - - -
-`; diff --git a/webpack/assets/javascripts/react_app/components/SettingsTable/components/__tests__/SettingCell.test.js b/webpack/assets/javascripts/react_app/components/SettingsTable/components/__tests__/SettingCell.test.js index 84b1ab40f1..001718cb82 100644 --- a/webpack/assets/javascripts/react_app/components/SettingsTable/components/__tests__/SettingCell.test.js +++ b/webpack/assets/javascripts/react_app/components/SettingsTable/components/__tests__/SettingCell.test.js @@ -1,4 +1,6 @@ -import { testComponentSnapshotsWithFixtures } from 'foremanReact/common/testHelpers'; +import React from 'react'; +import { render, screen, within } from '@testing-library/react'; +import '@testing-library/jest-dom'; import { rootPass, @@ -8,17 +10,53 @@ import { import SettingValue from '../SettingValue'; -const fixtures = { - 'render ordinary': { - setting: stringSetting, - }, - 'render encrypted with fullName': { - setting: rootPass, - }, - 'render without fullName': { - setting: withoutFullName, - }, -}; - -describe('SettingCell', () => - testComponentSnapshotsWithFixtures(SettingValue, fixtures)); +// Render the tooltip content inline instead of through the Popper, so the +// computed tooltipText can be asserted without hover/async teardown issues. +jest.mock('@patternfly/react-core', () => ({ + ...jest.requireActual('@patternfly/react-core'), + Tooltip: ({ content, children }) => ( +
+
{content}
+ {children} +
+ ), +})); + +const tooltip = () => screen.getByTestId('tooltip-content'); + +describe('SettingCell', () => { + it('render ordinary', () => { + render(); + + const value = screen.getByText('root@example.com'); + expect(value).toBeInTheDocument(); + // value equals default, so it is not emphasized + expect(value.closest('strong')).not.toBeInTheDocument(); + expect( + within(tooltip()).getByText('Default: root@example.com') + ).toBeInTheDocument(); + }); + + it('render encrypted with fullName', () => { + render(); + + // encrypted value is masked, and emphasized because it differs from default + const value = screen.getByText('*****'); + expect(value).toBeInTheDocument(); + expect(value.closest('strong')).toBeInTheDocument(); + // encrypted default is masked with bullet operators, one per character + expect( + within(tooltip()).getByText(`Default: ${'∙'.repeat(6)}`) + ).toBeInTheDocument(); + }); + + it('render without fullName', () => { + render(); + + // boolean false renders as "No" + const value = screen.getByText('No'); + expect(value).toBeInTheDocument(); + expect(value.closest('strong')).not.toBeInTheDocument(); + expect(within(tooltip()).getByText('Default: No')).toBeInTheDocument(); + }); +}); diff --git a/webpack/assets/javascripts/react_app/components/SettingsTable/components/__tests__/SettingName.test.js b/webpack/assets/javascripts/react_app/components/SettingsTable/components/__tests__/SettingName.test.js index fca1311af4..753295f170 100644 --- a/webpack/assets/javascripts/react_app/components/SettingsTable/components/__tests__/SettingName.test.js +++ b/webpack/assets/javascripts/react_app/components/SettingsTable/components/__tests__/SettingName.test.js @@ -1,4 +1,6 @@ -import { testComponentSnapshotsWithFixtures } from 'foremanReact/common/testHelpers'; +import React from 'react'; +import { render, screen, within } from '@testing-library/react'; +import '@testing-library/jest-dom'; import { rootPass, @@ -7,14 +9,38 @@ import { import SettingName from '../SettingName'; -const fixtures = { - 'render with fullName': { - setting: rootPass, - }, - 'render without fullName': { - setting: withoutFullName, - }, -}; - -describe('SettingName', () => - testComponentSnapshotsWithFixtures(SettingName, fixtures)); +// Render the tooltip content inline instead of through the Popper, so the +// tooltipText can be asserted without hover/async teardown issues. +jest.mock('@patternfly/react-core', () => ({ + ...jest.requireActual('@patternfly/react-core'), + Tooltip: ({ content, children }) => ( +
+
{content}
+ {children} +
+ ), +})); + +const tooltip = () => screen.getByTestId('tooltip-content'); + +describe('SettingName', () => { + it('render with fullName', () => { + render(); + + // fullName is shown as the name, the technical name is the tooltip + expect(screen.getByText('Root password')).toBeInTheDocument(); + expect(within(tooltip()).getByText('root_pass')).toBeInTheDocument(); + }); + + it('render without fullName', () => { + render(); + + // with no fullName, the technical name is used for both name and tooltip + expect( + within(tooltip()).getByText('always_show_configuration_status') + ).toBeInTheDocument(); + expect( + screen.getAllByText('always_show_configuration_status') + ).toHaveLength(2); + }); +}); diff --git a/webpack/assets/javascripts/react_app/components/SettingsTable/components/__tests__/__snapshots__/SettingCell.test.js.snap b/webpack/assets/javascripts/react_app/components/SettingsTable/components/__tests__/__snapshots__/SettingCell.test.js.snap deleted file mode 100644 index 6cc33c333a..0000000000 --- a/webpack/assets/javascripts/react_app/components/SettingsTable/components/__tests__/__snapshots__/SettingCell.test.js.snap +++ /dev/null @@ -1,76 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`SettingCell render encrypted with fullName 1`] = ` - -`; - -exports[`SettingCell render ordinary 1`] = ` - -`; - -exports[`SettingCell render without fullName 1`] = ` - -`; diff --git a/webpack/assets/javascripts/react_app/components/SettingsTable/components/__tests__/__snapshots__/SettingName.test.js.snap b/webpack/assets/javascripts/react_app/components/SettingsTable/components/__tests__/__snapshots__/SettingName.test.js.snap deleted file mode 100644 index 2a90e3e8ac..0000000000 --- a/webpack/assets/javascripts/react_app/components/SettingsTable/components/__tests__/__snapshots__/SettingName.test.js.snap +++ /dev/null @@ -1,51 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`SettingName render with fullName 1`] = ` - -`; - -exports[`SettingName render without fullName 1`] = ` - -`;