From 242edad102cf752ab9c2027c7da1c1a8d4be3894 Mon Sep 17 00:00:00 2001 From: Andrei Lakatos Date: Wed, 1 Jul 2026 03:06:13 -0400 Subject: [PATCH] Fixes #39439 - replace AuditsPage tests with RTL testing --- test/integration/hostgroup_js_test.rb | 1 + .../react_app/common/rtlTestHelpers.js | 17 +- .../Audits/AuditsPage/AuditsPage.fixtures.js | 2 + .../AuditsPage/__tests__/AuditsPage.test.js | 118 +++++-- .../__snapshots__/AuditsPage.test.js.snap | 311 ------------------ 5 files changed, 113 insertions(+), 336 deletions(-) delete mode 100644 webpack/assets/javascripts/react_app/routes/Audits/AuditsPage/__tests__/__snapshots__/AuditsPage.test.js.snap diff --git a/test/integration/hostgroup_js_test.rb b/test/integration/hostgroup_js_test.rb index 1ef4dca91a..fc18746197 100644 --- a/test/integration/hostgroup_js_test.rb +++ b/test/integration/hostgroup_js_test.rb @@ -21,6 +21,7 @@ class HostgroupJSTest < IntegrationTestWithJavascript select2 os.media.first.name, :from => 'hostgroup_medium_id' wait_for_ajax select2 os.ptables.first.name, :from => 'hostgroup_ptable_id' + wait_for_ajax fill_in 'hostgroup_root_pass', :with => '12345678' click_button 'Submit' hostgroup = wait_for do diff --git a/webpack/assets/javascripts/react_app/common/rtlTestHelpers.js b/webpack/assets/javascripts/react_app/common/rtlTestHelpers.js index 56296ba6a6..d8f6936d6a 100644 --- a/webpack/assets/javascripts/react_app/common/rtlTestHelpers.js +++ b/webpack/assets/javascripts/react_app/common/rtlTestHelpers.js @@ -9,6 +9,8 @@ import reducers from '../redux/reducers'; import { middlewares } from '../redux/middlewares'; import { initMockStore } from './testInitialReduxStore'; +const I18nPassThrough = ({ children }) => children; + export const createTestStore = ( initialState = {}, storeConfig = compose(applyMiddleware(...middlewares)) @@ -43,8 +45,12 @@ export const rtlHelpers = { * @returns {Object} RTL render result */ renderWithI18n: (component, mockDate = new Date(), timezone = 'UTC') => { - const IntlWrapper = i18nProviderWrapperFactory(mockDate, timezone); - return render(React.createElement(IntlWrapper, {}, component)); + const IntlWrapper = i18nProviderWrapperFactory( + mockDate, + timezone + )(I18nPassThrough); + + return render({component}); }, /** @@ -62,12 +68,15 @@ export const rtlHelpers = { timezone = 'UTC' ) => { const store = createTestStore(initialState); - const IntlWrapper = i18nProviderWrapperFactory(mockDate, timezone); + const IntlWrapper = i18nProviderWrapperFactory( + mockDate, + timezone + )(I18nPassThrough); return { ...render( - {React.createElement(IntlWrapper, {}, component)} + {component} ), store, diff --git a/webpack/assets/javascripts/react_app/routes/Audits/AuditsPage/AuditsPage.fixtures.js b/webpack/assets/javascripts/react_app/routes/Audits/AuditsPage/AuditsPage.fixtures.js index 9fff871a00..e6eb1e4996 100644 --- a/webpack/assets/javascripts/react_app/routes/Audits/AuditsPage/AuditsPage.fixtures.js +++ b/webpack/assets/javascripts/react_app/routes/Audits/AuditsPage/AuditsPage.fixtures.js @@ -49,4 +49,6 @@ export const auditsPageProps = { isLoading: false, hasData: true, searchQuery: 'search', + audits: AuditsProps.audits, + itemCount: AuditsProps.audits.length, }; diff --git a/webpack/assets/javascripts/react_app/routes/Audits/AuditsPage/__tests__/AuditsPage.test.js b/webpack/assets/javascripts/react_app/routes/Audits/AuditsPage/__tests__/AuditsPage.test.js index a9c7926cd7..efab3340d4 100644 --- a/webpack/assets/javascripts/react_app/routes/Audits/AuditsPage/__tests__/AuditsPage.test.js +++ b/webpack/assets/javascripts/react_app/routes/Audits/AuditsPage/__tests__/AuditsPage.test.js @@ -1,28 +1,104 @@ -import { testComponentSnapshotsWithFixtures } from '../../../../common/testHelpers'; +import React from 'react'; +import { BrowserRouter as Router } from 'react-router-dom'; +import { screen } from '@testing-library/react'; +import '@testing-library/jest-dom'; + import AuditsPage from '../AuditsPage'; import { auditsPageProps } from '../AuditsPage.fixtures'; +import { rtlHelpers } from '../../../../common/rtlTestHelpers'; + +const { renderWithStoreAndI18n } = rtlHelpers; -const auditsPageFixtures = { - 'render audits page': auditsPageProps, - 'render loading audits page': { - ...auditsPageProps, - hasError: false, - hasData: true, - audits: [], - }, - 'render audits page w/empty audits': { - ...auditsPageProps, - hasError: true, - message: 'no audits', - }, - 'render audits page w/error': { - ...auditsPageProps, - hasError: true, - message: 'some-error', - }, +const renderAuditsPage = (props = {}) => { + renderWithStoreAndI18n( + + + + ); }; +const expectAuditsPageReady = () => + screen.findByRole('heading', { name: 'Audits', level: 1 }); + describe('AuditsPage', () => { - describe('rendering', () => - testComponentSnapshotsWithFixtures(AuditsPage, auditsPageFixtures)); + it('renders audits page', async () => { + renderAuditsPage(); + await expectAuditsPageReady(); + + expect(screen.getByRole('link', { name: /Documentation/i })).toHaveAttribute( + 'href', + '/links/manual/4.1.4Auditing' + ); + expect(screen.getByLabelText('Search input')).toBeInTheDocument(); + expect(screen.getByText('host-foo.example.com')).toBeInTheDocument(); + }); + + it('renders audits page with no audit rows', async () => { + renderAuditsPage({ + hasError: false, + hasData: true, + audits: [], + itemCount: 0, + }); + await expectAuditsPageReady(); + + expect( + screen.getByRole('list', { name: 'Audits data list' }) + ).toBeInTheDocument(); + expect(screen.queryByText('host-foo.example.com')).not.toBeInTheDocument(); + }); + + it('renders loading audits page', async () => { + renderAuditsPage({ + isLoading: true, + hasData: false, + }); + await expectAuditsPageReady(); + + expect( + screen.queryByRole('list', { name: 'Audits data list' }) + ).not.toBeInTheDocument(); + expect( + screen.queryByRole('heading', { name: 'Error', level: 5 }) + ).not.toBeInTheDocument(); + }); + + it('renders audits page with error when audit data is present', async () => { + renderAuditsPage({ + hasError: true, + hasData: true, + audits: auditsPageProps.audits, + itemCount: auditsPageProps.itemCount, + message: { type: 'error', text: 'some-error' }, + }); + await expectAuditsPageReady(); + + expect( + screen.getByRole('heading', { name: 'Error', level: 5 }) + ).toBeInTheDocument(); + expect(screen.getByText('some-error')).toBeInTheDocument(); + expect( + screen.queryByRole('list', { name: 'Audits data list' }) + ).not.toBeInTheDocument(); + expect(screen.queryByText('host-foo.example.com')).not.toBeInTheDocument(); + }); + + it('renders audits page with error when no audit data is present', async () => { + renderAuditsPage({ + hasError: true, + hasData: false, + audits: [], + itemCount: 0, + message: { type: 'error', text: 'no audits' }, + }); + await expectAuditsPageReady(); + + expect( + screen.getByRole('heading', { name: 'Error', level: 5 }) + ).toBeInTheDocument(); + expect(screen.getByText('no audits')).toBeInTheDocument(); + expect( + screen.queryByRole('list', { name: 'Audits data list' }) + ).not.toBeInTheDocument(); + }); }); diff --git a/webpack/assets/javascripts/react_app/routes/Audits/AuditsPage/__tests__/__snapshots__/AuditsPage.test.js.snap b/webpack/assets/javascripts/react_app/routes/Audits/AuditsPage/__tests__/__snapshots__/AuditsPage.test.js.snap deleted file mode 100644 index a5432cbc40..0000000000 --- a/webpack/assets/javascripts/react_app/routes/Audits/AuditsPage/__tests__/__snapshots__/AuditsPage.test.js.snap +++ /dev/null @@ -1,311 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`AuditsPage rendering render audits page 1`] = ` - - Documentation - - } -> - - -`; - -exports[`AuditsPage rendering render audits page w/empty audits 1`] = ` - - Documentation - - } -> - - -`; - -exports[`AuditsPage rendering render audits page w/error 1`] = ` - - Documentation - - } -> - - -`; - -exports[`AuditsPage rendering render loading audits page 1`] = ` - - Documentation - - } -> - - -`;