foreman_rh_cloud 14.1.2 → 14.2.0

data/webpack/ForemanInventoryUpload/Components/FileDownload/__tests__/FileDownload.test.js

@@ -1,13 +1,17 @@
-import { testComponentSnapshotsWithFixtures } from '@theforeman/test';
-
+import React from 'react';
+import { render, screen, fireEvent } from '@testing-library/react';
 import FileDownload from '../FileDownload';
 
-const fixtures = {
-  'render without Props': {},
-  /** fixtures, props for the component */
-};
-
 describe('FileDownload', () => {
-  describe('rendering', () =>
-    testComponentSnapshotsWithFixtures(FileDownload, fixtures));
+  it('renders the download button', () => {
+    render(<FileDownload />);
+    expect(screen.getByRole('button', { name: /Download Report/ })).toBeTruthy();
+  });
+
+  it('calls onClick when button is clicked', () => {
+    const onClick = jest.fn();
+    render(<FileDownload onClick={onClick} />);
+    fireEvent.click(screen.getByRole('button', { name: /Download Report/ }));
+    expect(onClick).toHaveBeenCalledTimes(1);
+  });
 });

data/webpack/ForemanInventoryUpload/Components/InventoryFilter/__tests__/InventoryFilter.test.js

@@ -1,20 +1,17 @@
-import { testComponentSnapshotsWithFixtures } from '@theforeman/test';
-import { noop } from 'foremanReact/common/helpers';
-
+import React from 'react';
+import { render, screen } from '@testing-library/react';
 import InventoryFilter from '../InventoryFilter';
-import { filterTerm, organization } from '../InventoryFilter.fixtures';
 
-const fixtures = {
-  'render with props': {
-    handleFilterChange: noop,
-    handleFilterClear: noop,
-    filterTerm,
-    organization,
-  },
-  /** fixtures, props for the component */
-};
+jest.mock('foremanReact/Root/Context/ForemanContext');
 
 describe('InventoryFilter', () => {
-  describe('rendering', () =>
-    testComponentSnapshotsWithFixtures(InventoryFilter, fixtures));
+  it('renders the filter input', () => {
+    render(<InventoryFilter />);
+    expect(screen.getByPlaceholderText('Filter..')).toBeTruthy();
+  });
+
+  it('displays the current filter term', () => {
+    render(<InventoryFilter filterTerm="test-filter" />);
+    expect(screen.getByDisplayValue('test-filter')).toBeTruthy();
+  });
 });

data/webpack/ForemanInventoryUpload/Components/InventoryFilter/__tests__/integration.test.js

@@ -1,18 +1,38 @@
 import React from 'react';
-import { IntegrationTestHelper } from '@theforeman/test';
-import InventoryFilter from '../index';
-import reducers from '../../../../ForemanRhCloudReducers';
+import { render, screen, fireEvent } from '@testing-library/react';
+import { Provider } from 'react-redux';
+import configureMockStore from 'redux-mock-store';
+import thunk from 'redux-thunk';
+import ConnectedInventoryFilter from '../index';
+import { INVENTORY_FILTER_UPDATE } from '../InventoryFilterConstants';
+
+jest.mock('foremanReact/Root/Context/ForemanContext');
+
+const mockStore = configureMockStore([thunk]);
 
 describe('InventoryFilter integration test', () => {
-  it('should flow', async () => {
-    const integrationTestHelper = new IntegrationTestHelper(reducers);
-    const wrapper = integrationTestHelper.mount(<InventoryFilter />);
-    const input = wrapper.find('input[id="inventory_filter_input"]');
-    input.simulate('change', { target: { value: 'some_new_filter' } });
-    await IntegrationTestHelper.flushAllPromises();
-    wrapper.update();
-    integrationTestHelper.takeStoreAndLastActionSnapshot(
-      'filter have been updated'
+  it('dispatches filter update action on input change', () => {
+    const store = mockStore({
+      ForemanRhCloud: {
+        inventoryUpload: {
+          inventoryFilter: { filterTerm: '' },
+        },
+      },
+    });
+
+    render(
+      <Provider store={store}>
+        <ConnectedInventoryFilter />
+      </Provider>
+    );
+
+    const input = screen.getByPlaceholderText('Filter..');
+    fireEvent.change(input, { target: { value: 'some_new_filter' } });
+
+    const actions = store.getActions();
+    const filterAction = actions.find(
+      a => a.type === INVENTORY_FILTER_UPDATE && a.payload.filterTerm === 'some_new_filter'
     );
+    expect(filterAction).toBeTruthy();
   });
 });

data/webpack/ForemanInventoryUpload/Components/PageHeader/PageHeader.js

@@ -4,7 +4,6 @@ import InventorySettings from '../InventorySettings';
 import PageDescription from './components/PageDescription';
 import InventoryFilter from '../InventoryFilter';
 import ToolbarButtons from './components/ToolbarButtons';
-import SettingsWarning from './components/SettingsWarning';
 import PageTitle from './PageTitle';
 import { useIopConfig } from '../../../common/Hooks/ConfigHooks';
 import './PageHeader.scss';
@@ -14,7 +13,6 @@ const PageHeader = () => {
 
   return (
     <div className="inventory-upload-header">
-      <SettingsWarning />
       <PageTitle />
       {!isIop && (
         <div className="inventory-upload-header-description">

data/webpack/ForemanInventoryUpload/Components/PageHeader/PageHeader.scss

@@ -1,6 +1,6 @@
 .rh-cloud-inventory-page {
   .inventory-upload-header {
-    margin-top: 35px;
+    padding: var(--pf-v5-global--spacer--md) var(--pf-v5-global--spacer--lg) var(--pf-v5-global--spacer--lg) var(--pf-v5-global--spacer--lg);
 
     h1 {
       font-family: 'RedHatDisplay';
@@ -33,7 +33,6 @@
     }
 
     .inventory-upload-header-title {
-      margin-top: -15px;
       margin-bottom: 8px;
     }
 

data/webpack/ForemanInventoryUpload/Components/PageHeader/PageTitle.js

@@ -18,9 +18,11 @@ import {
   getInventoryDocsUrl,
 } from '../../ForemanInventoryHelpers';
 import CloudPingModal from './components/CloudPingModal';
+import { useIopConfig } from '../../../common/Hooks/ConfigHooks';
 
 const PageTitle = () => {
   const [isDropdownOpen, setIsDropdownOpen] = useState(false);
+  const isIop = useIopConfig();
   const [showPingModal, setPingModal] = useState(false);
   const togglePingModal = () => setPingModal(v => !v);
   const dropdownItems = [
@@ -42,13 +44,17 @@ const PageTitle = () => {
     >
       {DOCS_BUTTON_TEXT}
     </DropdownItem>,
-    <DropdownItem
-      key="cloud-ping"
-      ouiaId="dropdownItem-cloud-ping"
-      onClick={togglePingModal}
-    >
-      {CLOUD_PING_TITLE}
-    </DropdownItem>,
+    ...(!isIop
+      ? [
+          <DropdownItem
+            key="cloud-ping"
+            ouiaId="dropdownItem-cloud-ping"
+            onClick={togglePingModal}
+          >
+            {CLOUD_PING_TITLE}
+          </DropdownItem>,
+        ]
+      : []),
   ];
   return (
     <Grid className="inventory-upload-header-title">

data/webpack/ForemanInventoryUpload/Components/PageHeader/__tests__/PageHeader.test.js

@@ -20,9 +20,6 @@ jest.mock('foremanReact/Root/Context/ForemanContext', () => ({
 
 // Mock child components to isolate PageHeader testing
 // This prevents child component complexity from affecting our tests
-jest.mock('../components/SettingsWarning', () => () => (
-  <div data-testid="settings-warning">SettingsWarning</div>
-));
 jest.mock('../PageTitle', () => () => (
   <div data-testid="page-title">PageTitle</div>
 ));
@@ -59,7 +56,6 @@ describe('PageHeader', () => {
       });
 
       // All components should be present when not in IoP mode
-      expect(screen.getByTestId('settings-warning')).toBeTruthy();
       expect(screen.getByTestId('page-title')).toBeTruthy();
       expect(screen.getByTestId('inventory-settings')).toBeTruthy();
       expect(screen.getByTestId('page-description')).toBeTruthy();
@@ -83,7 +79,6 @@ describe('PageHeader', () => {
       });
 
       // Core components should still be present
-      expect(screen.getByTestId('settings-warning')).toBeTruthy();
       expect(screen.getByTestId('page-title')).toBeTruthy();
       expect(screen.getByTestId('inventory-filter')).toBeTruthy();
       expect(screen.getByTestId('toolbar-buttons')).toBeTruthy();

data/webpack/ForemanInventoryUpload/Components/PageHeader/__tests__/PageTitle.test.js

@@ -1,12 +1,52 @@
-import { testComponentSnapshotsWithFixtures } from '@theforeman/test';
-
+import React from 'react';
+import { fireEvent, render, screen } from '@testing-library/react';
 import PageTitle from '../PageTitle';
 
-const fixtures = {
-  'render without Props': {},
-};
+let mockIopMode = false;
+
+jest.mock('foremanReact/Root/Context/ForemanContext', () => ({
+  useForemanContext: () => ({
+    metadata: {
+      foreman_rh_cloud: {
+        iop: mockIopMode,
+      },
+    },
+    UI: {},
+  }),
+}));
+
+jest.mock('../components/CloudPingModal', () => () => (
+  <div data-testid="cloud-ping-modal">CloudPingModal</div>
+));
+jest.mock('foremanReact/common/helpers', () => ({ getDocsURL: () => {} }));
 
 describe('PageTitle', () => {
-  describe('rendering', () =>
-    testComponentSnapshotsWithFixtures(PageTitle, fixtures));
+  afterEach(() => {
+    mockIopMode = false;
+  });
+
+  it('renders the page title', () => {
+    render(<PageTitle />);
+    expect(screen.getByText('Red Hat Inventory')).toBeTruthy();
+  });
+
+  it('renders the kebab dropdown', () => {
+    const { container } = render(<PageTitle />);
+    expect(container.querySelector('.title-dropdown')).toBeTruthy();
+  });
+
+  it('renders cloud-ping dropdown item when not in IoP mode', () => {
+    mockIopMode = false;
+    render(<PageTitle />);
+    fireEvent.click(screen.getByLabelText('Actions'));
+    expect(screen.getByText('Connectivity test')).toBeTruthy();
+  });
+
+  it('does not render cloud-ping dropdown item when in IoP mode', () => {
+    mockIopMode = true;
+    render(<PageTitle />);
+    fireEvent.click(screen.getByLabelText('Actions'));
+    expect(screen.queryByText('Connectivity test')).toBeNull();
+    mockIopMode = false;
+  });
 });

data/webpack/ForemanInventoryUpload/Components/PageHeader/components/SyncButton/__tests__/SyncButton.test.js

@@ -1,13 +1,27 @@
-import { testComponentSnapshotsWithFixtures } from '@theforeman/test';
-import { noop } from 'foremanReact/common/helpers';
-
+import React from 'react';
+import { render, screen, fireEvent } from '@testing-library/react';
 import SyncButton from '../SyncButton';
 
-const fixtures = {
-  'render with Props': { handleSync: noop },
-};
-
 describe('SyncButton', () => {
-  describe('rendering', () =>
-    testComponentSnapshotsWithFixtures(SyncButton, fixtures));
+  it('renders the sync button text', () => {
+    render(<SyncButton handleSync={jest.fn()} />);
+    expect(screen.getByRole('button', { name: /Sync all inventory status/ })).toBeTruthy();
+  });
+
+  it('calls handleSync on click', () => {
+    const handleSync = jest.fn();
+    render(<SyncButton handleSync={handleSync} />);
+    fireEvent.click(screen.getByRole('button'));
+    expect(handleSync).toHaveBeenCalledTimes(1);
+  });
+
+  it('disables button when status is PENDING', () => {
+    render(<SyncButton handleSync={jest.fn()} status="PENDING" />);
+    expect(screen.getByRole('button').disabled).toBe(true);
+  });
+
+  it('enables button when status is not PENDING', () => {
+    render(<SyncButton handleSync={jest.fn()} status="RESOLVED" />);
+    expect(screen.getByRole('button').disabled).toBe(false);
+  });
 });

data/webpack/ForemanInventoryUpload/Components/PageHeader/components/SyncButton/__tests__/SyncButtonSelectors.test.js

@@ -1,27 +1,29 @@
-import { testSelectorsSnapshotWithFixtures } from '@theforeman/test';
 import { selectTaskStatus } from '../SyncButtonSelectors';
 
-const state = {
+const buildState = result => ({
   API: {
     INVENTORY_SYNC_TASK_UPDATE: {
       response: {
-        endedAt: '2021-03-08T14:27:30.718+02:00',
-        output: {
-          host_statuses: {
-            sync: 0,
-            disconnect: 2,
-          },
-        },
-        result: 'pending',
+        result,
       },
-      status: 'RESOLVED',
     },
   },
-};
+});
 
-const fixtures = {
-  'should return InventorySync status': () => selectTaskStatus(state),
-};
+describe('SyncButton selectors', () => {
+  it('uppercases the result string', () => {
+    expect(selectTaskStatus(buildState('pending'))).toBe('PENDING');
+  });
 
-describe('SyncButton selectors', () =>
-  testSelectorsSnapshotWithFixtures(fixtures));
+  it('handles other result strings', () => {
+    expect(selectTaskStatus(buildState('success'))).toBe('SUCCESS');
+  });
+
+  it('returns null when result is not a string', () => {
+    expect(selectTaskStatus(buildState(null))).toBeNull();
+  });
+
+  it('returns null when result is undefined', () => {
+    expect(selectTaskStatus(buildState(undefined))).toBeNull();
+  });
+});

data/webpack/ForemanInventoryUpload/Components/PageHeader/components/SyncButton/__tests__/integrations.test.js

@@ -1,52 +1,40 @@
 import React from 'react';
-import { IntegrationTestHelper } from '@theforeman/test';
+import { render, screen, fireEvent } from '@testing-library/react';
+import { Provider } from 'react-redux';
+import configureMockStore from 'redux-mock-store';
+import thunk from 'redux-thunk';
 import * as API from 'foremanReact/redux/API';
-import { noop } from 'foremanReact/common/helpers';
-import SyncButton from '../index';
+import ConnectedSyncButton from '../index';
 import { successResponse } from './SyncButtonFixtures';
-import {
-  INVENTORY_SYNC,
-  INVENTORY_SYNC_TASK_UPDATE,
-} from '../SyncButtonConstants';
+import { INVENTORY_SYNC } from '../SyncButtonConstants';
 
 jest.spyOn(API, 'post');
-jest.spyOn(API, 'get');
+
+const mockStore = configureMockStore([thunk]);
 
 describe('SyncButton integration test', () => {
-  it('Successful task was triggered on the server resulting in an info toast and polling on the task', async () => {
-    API.post.mockImplementation(({ handleSuccess = noop, key, ...action }) => {
-      if (key === INVENTORY_SYNC) {
+  it('dispatches sync action when button is clicked', () => {
+    API.post.mockImplementation(({ handleSuccess, key, ...action }) => {
+      if (key === INVENTORY_SYNC && handleSuccess) {
         handleSuccess(successResponse);
       }
       return { type: 'API_POST', ...action };
     });
-    API.get.mockImplementation(({ handleSuccess = noop, key, ...action }) => {
-      if (key === INVENTORY_SYNC_TASK_UPDATE) {
-        handleSuccess(
-          {
-            data: {
-              endedAt: '2021-03-22T15:59:02.468+02:00',
-              output: {
-                host_statuses: {
-                  sync: 0,
-                  disconnect: 2,
-                  user_omitted: 1,
-                },
-              },
-              result: 'success',
-            },
-          },
-          jest.fn
-        );
-      }
-      return { type: 'API_GET', ...action };
+
+    const store = mockStore({
+      API: {},
     });
 
-    const integrationTestHelper = new IntegrationTestHelper();
-    const wrapper = integrationTestHelper.mount(<SyncButton />);
-    const instance = wrapper.find('SyncButton').instance();
-    instance.props.handleSync();
-    await IntegrationTestHelper.flushAllPromises();
-    integrationTestHelper.takeActionsSnapshot('handleSync was called');
+    render(
+      <Provider store={store}>
+        <ConnectedSyncButton />
+      </Provider>
+    );
+
+    fireEvent.click(screen.getByRole('button'));
+
+    const actions = store.getActions();
+    const syncAction = actions.find(a => a.type === 'API_POST');
+    expect(syncAction).toBeTruthy();
   });
 });

data/webpack/ForemanInventoryUpload/Components/PageHeader/components/ToolbarButtons/ToolbarButtons.js

@@ -1,16 +1,13 @@
 import React from 'react';
 import { useSelector } from 'react-redux';
 import SyncButton from '../SyncButton';
-import CloudConnectorButton from '../CloudConnectorButton';
 import './toolbarButtons.scss';
 import { selectSubscriptionConnectionEnabled } from '../../../InventorySettings/InventorySettingsSelectors';
-import { useIopConfig } from '../../../../../common/Hooks/ConfigHooks';
 
 const ToolbarButtons = () => {
   const subscriptionConnectionEnabled = useSelector(
     selectSubscriptionConnectionEnabled
   );
-  const isIop = useIopConfig();
 
   if (!subscriptionConnectionEnabled) {
     return null;
@@ -18,7 +15,6 @@ const ToolbarButtons = () => {
 
   return (
     <div className="inventory_toolbar_buttons">
-      {!isIop && <CloudConnectorButton />}
       <SyncButton />
     </div>
   );

data/webpack/ForemanInventoryUpload/Components/PageHeader/components/ToolbarButtons/__tests__/ToolbarButtons.test.js

@@ -1,21 +1,13 @@
 import React from 'react';
-import { screen } from '@testing-library/react';
-import { rtlHelpers } from 'foremanReact/common/rtlTestHelpers';
+import { render, screen } from '@testing-library/react';
+import '@testing-library/jest-dom';
+import * as reactRedux from 'react-redux';
 import ToolbarButtons from '../ToolbarButtons';
-import { useIopConfig } from '../../../../../../common/Hooks/ConfigHooks';
-import { selectSubscriptionConnectionEnabled } from '../../../../InventorySettings/InventorySettingsSelectors';
 
-// Mock the config hook
-jest.mock('../../../../../../common/Hooks/ConfigHooks', () => ({
-  useIopConfig: jest.fn(),
+jest.mock('react-redux', () => ({
+  useSelector: jest.fn(),
 }));
 
-// Mock the selector
-jest.mock('../../../../InventorySettings/InventorySettingsSelectors', () => ({
-  selectSubscriptionConnectionEnabled: jest.fn(),
-}));
-
-// Mock child components to isolate ToolbarButtons testing
 jest.mock(
   '../../SyncButton',
   () =>
@@ -23,56 +15,35 @@ jest.mock(
       return <div data-testid="sync-button">Sync all inventory status</div>;
     }
 );
-jest.mock(
-  '../../CloudConnectorButton',
-  () =>
-    function MockCloudConnectorButton() {
-      return (
-        <div data-testid="cloud-connector-button">
-          Configure cloud connector
-        </div>
-      );
-    }
-);
-
-const { renderWithStore } = rtlHelpers;
 
 describe('ToolbarButtons', () => {
-  test('renders both buttons when subscription connection is enabled and not in IOP mode', () => {
-    useIopConfig.mockReturnValue(false);
-    selectSubscriptionConnectionEnabled.mockReturnValue(true);
-
-    renderWithStore(<ToolbarButtons />);
-
-    expect(screen.getByTestId('cloud-connector-button')).toBeTruthy();
-    expect(screen.getByTestId('sync-button')).toBeTruthy();
+  afterEach(() => {
+    jest.clearAllMocks();
   });
 
-  test('renders only sync button when in IOP mode', () => {
-    useIopConfig.mockReturnValue(true);
-    selectSubscriptionConnectionEnabled.mockReturnValue(true);
+  test('renders sync button when subscription connection is enabled', () => {
+    reactRedux.useSelector.mockReturnValue(true);
 
-    renderWithStore(<ToolbarButtons />);
+    render(<ToolbarButtons />);
 
-    expect(screen.queryByTestId('cloud-connector-button')).toBeNull();
-    expect(screen.getByTestId('sync-button')).toBeTruthy();
+    expect(screen.getByTestId('sync-button')).toBeInTheDocument();
   });
 
   test('renders nothing when subscription connection is not enabled', () => {
-    useIopConfig.mockReturnValue(false);
-    selectSubscriptionConnectionEnabled.mockReturnValue(false);
+    reactRedux.useSelector.mockReturnValue(false);
 
-    const { container } = renderWithStore(<ToolbarButtons />);
+    const { container } = render(<ToolbarButtons />);
 
     expect(container.firstChild).toBeNull();
   });
 
   test('renders toolbar buttons container with correct className when enabled', () => {
-    useIopConfig.mockReturnValue(false);
-    selectSubscriptionConnectionEnabled.mockReturnValue(true);
+    reactRedux.useSelector.mockReturnValue(true);
 
-    const { container } = renderWithStore(<ToolbarButtons />);
+    const { container } = render(<ToolbarButtons />);
 
-    expect(container.querySelector('.inventory_toolbar_buttons')).toBeTruthy();
+    expect(
+      container.querySelector('.inventory_toolbar_buttons')
+    ).toBeInTheDocument();
   });
 });

data/webpack/ForemanInventoryUpload/Components/ScheduledRun/__tests__/ScheduledRun.test.js

@@ -1,13 +1,33 @@
-import { testComponentSnapshotsWithFixtures } from '@theforeman/test';
-
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import { IntlProvider } from 'react-intl';
 import ScheduledRun from '../ScheduledRun';
-import { props } from '../ScheduledRun.fixtures';
 
-const fixtures = {
-  'render with Props': props,
-};
+const renderWithIntl = ui =>
+  render(<IntlProvider locale="en">{ui}</IntlProvider>);
 
 describe('ScheduledRun', () => {
-  describe('rendering', () =>
-    testComponentSnapshotsWithFixtures(ScheduledRun, fixtures));
+  it('renders next run info when autoUploadEnabled and date are set', () => {
+    renderWithIntl(
+      <ScheduledRun date="2019-08-21T16:14:16.520+03:00" autoUploadEnabled />
+    );
+    expect(screen.getByText(/Next run:/)).toBeTruthy();
+  });
+
+  it('renders nothing when autoUploadEnabled is false', () => {
+    renderWithIntl(
+      <ScheduledRun
+        date="2019-08-21T16:14:16.520+03:00"
+        autoUploadEnabled={false}
+      />
+    );
+    expect(screen.queryByText(/Next run:/)).toBeNull();
+  });
+
+  it('renders nothing when date is null', () => {
+    renderWithIntl(
+      <ScheduledRun date={null} autoUploadEnabled />
+    );
+    expect(screen.queryByText(/Next run:/)).toBeNull();
+  });
 });

data/webpack/ForemanInventoryUpload/Components/StatusChart/__tests__/StatusChart.test.js

@@ -1,13 +1,30 @@
-import { testComponentSnapshotsWithFixtures } from '@theforeman/test';
-
+import React from 'react';
+import { render } from '@testing-library/react';
 import StatusChart from '../StatusChart';
 
-const fixtures = {
-  'render without Props': {},
-  /** fixtures, props for the component */
-};
+jest.mock('patternfly-react', () => ({
+  Grid: { Col: ({ children }) => <div>{children}</div> },
+  DonutChart: ({ title }) => (
+    <div data-testid="donut-chart">
+      <span>{title?.primary}</span>
+      <span>{title?.secondary}</span>
+    </div>
+  ),
+}));
 
 describe('StatusChart', () => {
-  describe('rendering', () =>
-    testComponentSnapshotsWithFixtures(StatusChart, fixtures));
+  it('renders the status chart container', () => {
+    const { container } = render(<StatusChart />);
+    expect(container.querySelector('.status-chart')).toBeTruthy();
+  });
+
+  it('passes the completed percentage to the chart', () => {
+    const { getByText } = render(<StatusChart completed={75} />);
+    expect(getByText('75%')).toBeTruthy();
+  });
+
+  it('shows Completed label', () => {
+    const { getByText } = render(<StatusChart completed={50} />);
+    expect(getByText('Completed')).toBeTruthy();
+  });
 });