Re-export all React Testing Library functions (#23522)

2023-06-05 12:49:31 -04:00
--- a/webapp/channels/src/components/about_build_modal/about_build_modal.test.tsx
+++ b/webapp/channels/src/components/about_build_modal/about_build_modal.test.tsx
@@ -2,21 +2,16 @@
 // See LICENSE.txt for license information.

 import React from 'react';
-import {Provider} from 'react-redux';
-
-import mockStore from 'tests/test_store';

 import {ClientConfig, ClientLicense} from '@mattermost/types/config';

 import AboutBuildModal from 'components/about_build_modal/about_build_modal';

+import {renderWithFullContext, screen, userEvent} from 'tests/react_testing_utils';
+
 import {AboutLinks} from 'utils/constants';

 import AboutBuildModalCloud from './about_build_modal_cloud/about_build_modal_cloud';
-import {screen} from '@testing-library/react';
-import {renderWithIntl} from 'tests/react_testing_utils';
-import store from 'stores/redux_store';
-import userEvent from '@testing-library/user-event';

 describe('components/AboutBuildModal', () => {
    const RealDate: DateConstructor = Date;
@@ -98,16 +93,14 @@ describe('components/AboutBuildModal', () => {
            license.Cloud = 'true';
        }

-        renderWithIntl(
-            <Provider store={store}>
-                <AboutBuildModalCloud
-                    config={config}
-                    license={license}
-                    show={true}
-                    onExited={jest.fn()}
-                    doHide={jest.fn()}
-                />
-            </Provider>,
+        renderWithFullContext(
+            <AboutBuildModalCloud
+                config={config}
+                license={license}
+                show={true}
+                onExited={jest.fn()}
+                doHide={jest.fn()}
+            />,
        );

        expect(screen.getByText('Mattermost Cloud')).toBeInTheDocument();
@@ -170,7 +163,7 @@ describe('components/AboutBuildModal', () => {

    test('should call onExited callback when the modal is hidden', () => {
        const onExited = jest.fn();
-        const store = mockStore({
+        const state = {
            entities: {
                general: {
                    config: {},
@@ -182,16 +175,15 @@ describe('components/AboutBuildModal', () => {
                    currentUserId: 'currentUserId',
                },
            },
-        });
+        };

-        renderWithIntl(
-            <Provider store={store}>
-                <AboutBuildModal
-                    config={config}
-                    license={license}
-                    onExited={onExited}
-                />
-            </Provider>,
+        renderWithFullContext(
+            <AboutBuildModal
+                config={config}
+                license={license}
+                onExited={onExited}
+            />,
+            state,
        );

        userEvent.click(screen.getByText('Close'));
@@ -199,7 +191,7 @@ describe('components/AboutBuildModal', () => {
    });

    test('should show default tos and privacy policy links and not the config links', () => {
-        const store = mockStore({
+        const state = {
            entities: {
                general: {
                    config: {},
@@ -211,15 +203,14 @@ describe('components/AboutBuildModal', () => {
                    currentUserId: 'currentUserId',
                },
            },
-        });
-        renderWithIntl(
-            <Provider store={store}>
-                <AboutBuildModal
-                    config={config}
-                    license={license}
-                    onExited={jest.fn()}
-                />
-            </Provider>,
+        };
+        renderWithFullContext(
+            <AboutBuildModal
+                config={config}
+                license={license}
+                onExited={jest.fn()}
+            />,
+            state,
        );

        expect(screen.getByRole('link', {name: 'Terms of Use'})).toHaveAttribute('href', `${AboutLinks.TERMS_OF_SERVICE}?utm_source=mattermost&utm_medium=in-product&utm_content=about_build_modal&uid=currentUserId&sid=`);
@@ -242,6 +233,6 @@ describe('components/AboutBuildModal', () => {
            ...props,
        };

-        return renderWithIntl(<Provider store={store}><AboutBuildModal {...allProps}/></Provider>);
+        return renderWithFullContext(<AboutBuildModal {...allProps}/>);
    }
 });
--- a/webapp/channels/src/components/activity_and_insights/insights/insights_title/insights_title.test.tsx
+++ b/webapp/channels/src/components/activity_and_insights/insights/insights_title/insights_title.test.tsx
@@ -2,14 +2,8 @@
 // See LICENSE.txt for license information.

 import React from 'react';
-import {Provider} from 'react-redux';

-import {BrowserRouter} from 'react-router-dom';
-
-import {screen} from '@testing-library/react';
-
-import mockStore from 'tests/test_store';
-import {renderWithIntl} from 'tests/react_testing_utils';
+import {renderWithFullContext, screen} from 'tests/react_testing_utils';

 import InsightsTitle from './insights_title';

@@ -31,53 +25,33 @@ describe('components/activity_and_insights/insights/insights_title', () => {
                    },
                },
            },
-            general: {
-                config: {},
-                license: {},
-            },
            users: {
                currentUserId: 'current_user_id',
                profiles: {
                    current_user_id: {},
                },
            },
-            preferences: {
-                myPreferences: {},
-            },
-            cloud: {
-                subscription: {},
-            },
        },
    };

-    test('should match snapshot with My insights', async () => {
-        const store = await mockStore(initialState);
-
-        renderWithIntl(
-            <Provider store={store}>
-                <BrowserRouter>
-                    <InsightsTitle
-                        {...props}
-                        filterType={'MY'}
-                    />
-                </BrowserRouter>
-            </Provider>,
+    test('should match snapshot with My insights', () => {
+        renderWithFullContext(
+            <InsightsTitle
+                {...props}
+                filterType={'MY'}
+            />,
+            initialState,
        );

        expect(screen.getByText('My insights')).toBeInTheDocument();
    });

-    test('should match snapshot with Team insights', async () => {
-        const store = await mockStore(initialState);
-
-        renderWithIntl(
-            <Provider store={store}>
-                <BrowserRouter>
-                    <InsightsTitle
-                        {...props}
-                    />
-                </BrowserRouter>
-            </Provider>,
+    test('should match snapshot with Team insights', () => {
+        renderWithFullContext(
+            <InsightsTitle
+                {...props}
+            />,
+            initialState,
        );

        expect(screen.getByText('Team insights')).toBeInTheDocument();
--- a/webapp/channels/src/components/activity_and_insights/insights/join_channel_modal/join_channel_modal.test.tsx
+++ b/webapp/channels/src/components/activity_and_insights/insights/join_channel_modal/join_channel_modal.test.tsx
@@ -5,12 +5,11 @@ import React from 'react';

 import {Provider} from 'react-redux';

-import {act} from '@testing-library/react';
-
 import {ReactWrapper} from 'enzyme';

 import {BrowserRouter} from 'react-router-dom';

+import {act} from 'tests/react_testing_utils';
 import {mountWithIntl} from 'tests/helpers/intl-test-helper';
 import mockStore from 'tests/test_store';

--- a/webapp/channels/src/components/activity_and_insights/insights/least_active_channels/least_active_channels.test.tsx
+++ b/webapp/channels/src/components/activity_and_insights/insights/least_active_channels/least_active_channels.test.tsx
@@ -4,8 +4,6 @@
 import React from 'react';
 import {Provider} from 'react-redux';

-import {act} from '@testing-library/react';
-
 import {ReactWrapper} from 'enzyme';

 import {BrowserRouter} from 'react-router-dom';
@@ -13,6 +11,7 @@ import {BrowserRouter} from 'react-router-dom';
 import {CardSizes, InsightsWidgetTypes, TimeFrames} from '@mattermost/types/insights';

 import {mountWithIntl} from 'tests/helpers/intl-test-helper';
+import {act} from 'tests/react_testing_utils';
 import mockStore from 'tests/test_store';

 import LeastActiveChannels from './least_active_channels';
--- a/webapp/channels/src/components/activity_and_insights/insights/least_active_channels/least_active_channels_table/least_active_channels_table.test.tsx
+++ b/webapp/channels/src/components/activity_and_insights/insights/least_active_channels/least_active_channels_table/least_active_channels_table.test.tsx
@@ -4,14 +4,13 @@
 import React from 'react';
 import {Provider} from 'react-redux';

-import {act} from '@testing-library/react';
-
 import {ReactWrapper} from 'enzyme';

 import {BrowserRouter} from 'react-router-dom';

 import {TimeFrames} from '@mattermost/types/insights';

+import {act} from 'tests/react_testing_utils';
 import {mountWithIntl} from 'tests/helpers/intl-test-helper';
 import mockStore from 'tests/test_store';

--- a/webapp/channels/src/components/activity_and_insights/insights/top_boards/top_boards.test.tsx
+++ b/webapp/channels/src/components/activity_and_insights/insights/top_boards/top_boards.test.tsx
@@ -4,8 +4,6 @@
 import React from 'react';
 import {Provider} from 'react-redux';

-import {act} from '@testing-library/react';
-
 import {ReactWrapper} from 'enzyme';

 import {BrowserRouter} from 'react-router-dom';
@@ -13,6 +11,7 @@ import {BrowserRouter} from 'react-router-dom';
 import {CardSizes, InsightsWidgetTypes, TimeFrames} from '@mattermost/types/insights';

 import {mountWithIntl} from 'tests/helpers/intl-test-helper';
+import {act} from 'tests/react_testing_utils';
 import mockStore from 'tests/test_store';

 import TopBoards from './top_boards';
--- a/webapp/channels/src/components/activity_and_insights/insights/top_boards/top_boards_table/top_boards_table.test.tsx
+++ b/webapp/channels/src/components/activity_and_insights/insights/top_boards/top_boards_table/top_boards_table.test.tsx
@@ -4,8 +4,6 @@
 import React from 'react';
 import {Provider} from 'react-redux';

-import {act} from '@testing-library/react';
-
 import {ReactWrapper} from 'enzyme';

 import {BrowserRouter} from 'react-router-dom';
@@ -13,6 +11,7 @@ import {BrowserRouter} from 'react-router-dom';
 import {TimeFrames} from '@mattermost/types/insights';

 import {mountWithIntl} from 'tests/helpers/intl-test-helper';
+import {act} from 'tests/react_testing_utils';
 import mockStore from 'tests/test_store';

 import TopBoardsTable from './top_boards_table';
--- a/webapp/channels/src/components/activity_and_insights/insights/top_channels/top_channels.test.tsx
+++ b/webapp/channels/src/components/activity_and_insights/insights/top_channels/top_channels.test.tsx
@@ -4,8 +4,6 @@
 import React from 'react';
 import {Provider} from 'react-redux';

-import {act} from '@testing-library/react';
-
 import {ReactWrapper} from 'enzyme';

 import {BrowserRouter} from 'react-router-dom';
@@ -13,6 +11,7 @@ import {BrowserRouter} from 'react-router-dom';
 import {CardSizes, InsightsWidgetTypes, TimeFrames} from '@mattermost/types/insights';

 import {mountWithIntl} from 'tests/helpers/intl-test-helper';
+import {act} from 'tests/react_testing_utils';
 import mockStore from 'tests/test_store';

 import TopChannels from './top_channels';
--- a/webapp/channels/src/components/activity_and_insights/insights/top_channels/top_channels_table/top_channels_table.test.tsx
+++ b/webapp/channels/src/components/activity_and_insights/insights/top_channels/top_channels_table/top_channels_table.test.tsx
@@ -4,8 +4,6 @@
 import React from 'react';
 import {Provider} from 'react-redux';

-import {act} from '@testing-library/react';
-
 import {ReactWrapper} from 'enzyme';

 import {BrowserRouter} from 'react-router-dom';
@@ -13,6 +11,7 @@ import {BrowserRouter} from 'react-router-dom';
 import {TimeFrames} from '@mattermost/types/insights';

 import {mountWithIntl} from 'tests/helpers/intl-test-helper';
+import {act} from 'tests/react_testing_utils';
 import mockStore from 'tests/test_store';

 import TopChannelsTable from './top_channels_table';
--- a/webapp/channels/src/components/activity_and_insights/insights/top_dms_and_new_members/new_members_table/new_members_table.test.tsx
+++ b/webapp/channels/src/components/activity_and_insights/insights/top_dms_and_new_members/new_members_table/new_members_table.test.tsx
@@ -4,8 +4,6 @@
 import React from 'react';
 import {Provider} from 'react-redux';

-import {act} from '@testing-library/react';
-
 import {ReactWrapper} from 'enzyme';

 import {BrowserRouter} from 'react-router-dom';
@@ -13,6 +11,7 @@ import {BrowserRouter} from 'react-router-dom';
 import {TimeFrames} from '@mattermost/types/insights';

 import {mountWithIntl} from 'tests/helpers/intl-test-helper';
+import {act} from 'tests/react_testing_utils';
 import mockStore from 'tests/test_store';

 import NewMembersTable from './new_members_table';
--- a/webapp/channels/src/components/activity_and_insights/insights/top_dms_and_new_members/top_dms_and_new_members.test.tsx
+++ b/webapp/channels/src/components/activity_and_insights/insights/top_dms_and_new_members/top_dms_and_new_members.test.tsx
@@ -4,8 +4,6 @@
 import React from 'react';
 import {Provider} from 'react-redux';

-import {act} from '@testing-library/react';
-
 import {ReactWrapper} from 'enzyme';

 import {BrowserRouter} from 'react-router-dom';
@@ -13,6 +11,7 @@ import {BrowserRouter} from 'react-router-dom';
 import {CardSizes, InsightsWidgetTypes, TimeFrames} from '@mattermost/types/insights';

 import {mountWithIntl} from 'tests/helpers/intl-test-helper';
+import {act} from 'tests/react_testing_utils';
 import mockStore from 'tests/test_store';

 import TopDMsAndNewMembers from './top_dms_and_new_members';
--- a/webapp/channels/src/components/activity_and_insights/insights/top_dms_and_new_members/top_dms_table/top_dms_table.test.tsx
+++ b/webapp/channels/src/components/activity_and_insights/insights/top_dms_and_new_members/top_dms_table/top_dms_table.test.tsx
@@ -4,8 +4,6 @@
 import React from 'react';
 import {Provider} from 'react-redux';

-import {act} from '@testing-library/react';
-
 import {ReactWrapper} from 'enzyme';

 import {BrowserRouter} from 'react-router-dom';
@@ -13,6 +11,7 @@ import {BrowserRouter} from 'react-router-dom';
 import {TimeFrames} from '@mattermost/types/insights';

 import {mountWithIntl} from 'tests/helpers/intl-test-helper';
+import {act} from 'tests/react_testing_utils';
 import mockStore from 'tests/test_store';

 import TopDMsTable from './top_dms_table';
--- a/webapp/channels/src/components/activity_and_insights/insights/top_playbooks/top_playbooks.test.tsx
+++ b/webapp/channels/src/components/activity_and_insights/insights/top_playbooks/top_playbooks.test.tsx
@@ -4,8 +4,6 @@
 import React from 'react';
 import {Provider} from 'react-redux';

-import {act} from '@testing-library/react';
-
 import {ReactWrapper} from 'enzyme';

 import {BrowserRouter} from 'react-router-dom';
@@ -13,6 +11,7 @@ import {BrowserRouter} from 'react-router-dom';
 import {CardSizes, InsightsWidgetTypes, TimeFrames} from '@mattermost/types/insights';

 import {mountWithIntl} from 'tests/helpers/intl-test-helper';
+import {act} from 'tests/react_testing_utils';
 import mockStore from 'tests/test_store';

 import TopPlaybooks from './top_playbooks';
--- a/webapp/channels/src/components/activity_and_insights/insights/top_playbooks/top_playbooks_table/top_playbooks_table.test.tsx
+++ b/webapp/channels/src/components/activity_and_insights/insights/top_playbooks/top_playbooks_table/top_playbooks_table.test.tsx
@@ -4,8 +4,6 @@
 import React from 'react';
 import {Provider} from 'react-redux';

-import {act} from '@testing-library/react';
-
 import {ReactWrapper} from 'enzyme';

 import {BrowserRouter} from 'react-router-dom';
@@ -13,6 +11,7 @@ import {BrowserRouter} from 'react-router-dom';
 import {TimeFrames} from '@mattermost/types/insights';

 import {mountWithIntl} from 'tests/helpers/intl-test-helper';
+import {act} from 'tests/react_testing_utils';
 import mockStore from 'tests/test_store';

 import TopPlaybooksTable from './top_playbooks_table';
--- a/webapp/channels/src/components/activity_and_insights/insights/top_reactions/top_reactions.test.tsx
+++ b/webapp/channels/src/components/activity_and_insights/insights/top_reactions/top_reactions.test.tsx
@@ -4,13 +4,12 @@
 import React from 'react';
 import {Provider} from 'react-redux';

-import {act} from '@testing-library/react';
-
 import {ReactWrapper} from 'enzyme';

 import {CardSizes, InsightsWidgetTypes, TimeFrames} from '@mattermost/types/insights';

 import {mountWithIntl} from 'tests/helpers/intl-test-helper';
+import {act} from 'tests/react_testing_utils';
 import mockStore from 'tests/test_store';

 import TopReactions from './top_reactions';
--- a/webapp/channels/src/components/activity_and_insights/insights/top_reactions/top_reactions_table/top_reactions_table.test.tsx
+++ b/webapp/channels/src/components/activity_and_insights/insights/top_reactions/top_reactions_table/top_reactions_table.test.tsx
@@ -4,13 +4,12 @@
 import React from 'react';
 import {Provider} from 'react-redux';

-import {act} from '@testing-library/react';
-
 import {ReactWrapper} from 'enzyme';

 import {TimeFrames} from '@mattermost/types/insights';

 import {mountWithIntl} from 'tests/helpers/intl-test-helper';
+import {act} from 'tests/react_testing_utils';
 import mockStore from 'tests/test_store';

 import TopReactionsTable from './top_reactions_table';
--- a/webapp/channels/src/components/activity_and_insights/insights/top_threads/top_threads.test.tsx
+++ b/webapp/channels/src/components/activity_and_insights/insights/top_threads/top_threads.test.tsx
@@ -4,8 +4,6 @@
 import React from 'react';
 import {Provider} from 'react-redux';

-import {act} from '@testing-library/react';
-
 import {ReactWrapper} from 'enzyme';

 import {BrowserRouter} from 'react-router-dom';
@@ -13,6 +11,7 @@ import {BrowserRouter} from 'react-router-dom';
 import {CardSizes, InsightsWidgetTypes, TimeFrames} from '@mattermost/types/insights';

 import {mountWithIntl} from 'tests/helpers/intl-test-helper';
+import {act} from 'tests/react_testing_utils';
 import mockStore from 'tests/test_store';

 import TopThreads from './top_threads';
--- a/webapp/channels/src/components/activity_and_insights/insights/top_threads/top_threads_item/top_threads_item.test.tsx
+++ b/webapp/channels/src/components/activity_and_insights/insights/top_threads/top_threads_item/top_threads_item.test.tsx
@@ -4,8 +4,6 @@
 import React from 'react';
 import {Provider} from 'react-redux';

-import {act} from '@testing-library/react';
-
 import {ReactWrapper} from 'enzyme';

 import {BrowserRouter} from 'react-router-dom';
@@ -13,6 +11,7 @@ import {BrowserRouter} from 'react-router-dom';
 import {PostType} from '@mattermost/types/posts';

 import {mountWithIntl} from 'tests/helpers/intl-test-helper';
+import {act} from 'tests/react_testing_utils';
 import mockStore from 'tests/test_store';

 import TopThreadsItem from './top_threads_item';
--- a/webapp/channels/src/components/activity_and_insights/insights/top_threads/top_threads_table/top_threads_table.test.tsx
+++ b/webapp/channels/src/components/activity_and_insights/insights/top_threads/top_threads_table/top_threads_table.test.tsx
@@ -4,8 +4,6 @@
 import React from 'react';
 import {Provider} from 'react-redux';

-import {act} from '@testing-library/react';
-
 import {ReactWrapper} from 'enzyme';

 import {BrowserRouter} from 'react-router-dom';
@@ -13,6 +11,7 @@ import {BrowserRouter} from 'react-router-dom';
 import {TimeFrames} from '@mattermost/types/insights';

 import {mountWithIntl} from 'tests/helpers/intl-test-helper';
+import {act} from 'tests/react_testing_utils';
 import mockStore from 'tests/test_store';

 import TopThreadsTable from './top_threads_table';
--- a/webapp/channels/src/components/activity_and_insights/insights/widget_hoc/widget_hoc.test.tsx
+++ b/webapp/channels/src/components/activity_and_insights/insights/widget_hoc/widget_hoc.test.tsx
@@ -2,16 +2,15 @@
 // See LICENSE.txt for license information.

 import React, {ComponentType} from 'react';
-
-import {screen} from '@testing-library/react';
-
 import {Provider} from 'react-redux';

-import {InsightsScopes} from 'utils/constants';
 import {CardSizes, InsightsWidgetTypes, TimeFrames} from '@mattermost/types/insights';
-import {renderWithIntl} from 'tests/react_testing_utils';
+
+import {renderWithIntl, screen} from 'tests/react_testing_utils';
 import mockStore from 'tests/test_store';

+import {InsightsScopes} from 'utils/constants';
+
 import widgetHoc from './widget_hoc';

 describe('components/activity_and_insights/insights/widget_hoc', () => {
--- a/webapp/channels/src/components/admin_console/admin_navbar_dropdown/menu_item_blockable_link.test.tsx
+++ b/webapp/channels/src/components/admin_console/admin_navbar_dropdown/menu_item_blockable_link.test.tsx
@@ -3,25 +3,17 @@

 import React from 'react';

-import {screen} from '@testing-library/react';
+import {renderWithFullContext, screen} from 'tests/react_testing_utils';

 import {MenuItemBlockableLinkImpl} from './menu_item_blockable_link';
-import {renderWithIntl} from 'tests/react_testing_utils';
-import {Provider} from 'react-redux';
-import store from 'stores/redux_store';
-import {BrowserRouter} from 'react-router-dom';

 describe('components/MenuItemBlockableLink', () => {
    test('should render my link', () => {
-        renderWithIntl(
-            <BrowserRouter>
-                <Provider store={store}>
-                    <MenuItemBlockableLinkImpl
-                        to='/wherever'
-                        text='Whatever'
-                    />
-                </Provider>
-            </BrowserRouter>,
+        renderWithFullContext(
+            <MenuItemBlockableLinkImpl
+                to='/wherever'
+                text='Whatever'
+            />,
        );

        screen.getByText('Whatever');
--- a/webapp/channels/src/components/admin_console/admin_user_card/admin_user_card.test.tsx
+++ b/webapp/channels/src/components/admin_console/admin_user_card/admin_user_card.test.tsx
@@ -3,12 +3,11 @@

 import React from 'react';

-import {screen} from '@testing-library/react';
+import {renderWithIntl, screen} from 'tests/react_testing_utils';

 import {TestHelper} from 'utils/test_helper';

-import AdminUserCard from 'components/admin_console/admin_user_card/admin_user_card';
-import {renderWithIntl} from 'tests/react_testing_utils';
+import AdminUserCard from './admin_user_card';

 describe('components/admin_console/admin_user_card/admin_user_card', () => {
    const user = TestHelper.getUserMock({
--- a/webapp/channels/src/components/admin_console/billing/billing_history.test.tsx
+++ b/webapp/channels/src/components/admin_console/billing/billing_history.test.tsx
@@ -5,9 +5,7 @@ import React from 'react';

 import {Provider} from 'react-redux';

-import {screen} from '@testing-library/react';
-
-import {renderWithIntl, renderWithIntlAndStore} from 'tests/react_testing_utils';
+import {renderWithIntl, renderWithIntlAndStore, screen} from 'tests/react_testing_utils';
 import mockStore from 'tests/test_store';

 import {CloudLinks, HostedCustomerLinks} from 'utils/constants';
--- a/webapp/channels/src/components/admin_console/billing/billing_subscriptions/limit_reached_banner.test.tsx
+++ b/webapp/channels/src/components/admin_console/billing/billing_subscriptions/limit_reached_banner.test.tsx
@@ -2,9 +2,9 @@
 // See LICENSE.txt for license information.

 import React from 'react';
-import {screen, fireEvent} from '@testing-library/react';

-import {Provider} from 'react-redux';
+import {GlobalState} from '@mattermost/types/store';
+import {UserProfile, UsersState} from '@mattermost/types/users';

 import {getPreferenceKey} from 'mattermost-redux/utils/preference_utils';
 import {Preferences} from 'mattermost-redux/constants';
@@ -14,14 +14,11 @@ import * as useGetUsageDeltas from 'components/common/hooks/useGetUsageDeltas';
 import * as useOpenCloudPurchaseModal from 'components/common/hooks/useOpenCloudPurchaseModal';
 import * as useOpenPricingModal from 'components/common/hooks/useOpenPricingModal';
 import * as useSaveBool from 'components/common/hooks/useSavePreferences';
-import {renderWithIntl} from 'tests/react_testing_utils';
-import mockStore from 'tests/test_store';
+
+import {fireEvent, renderWithFullContext, screen} from 'tests/react_testing_utils';

 import {CloudProducts} from 'utils/constants';

-import {GlobalState} from '@mattermost/types/store';
-import {UserProfile, UsersState} from '@mattermost/types/users';
-
 import LimitReachedBanner from './limit_reached_banner';

 const upgradeCloudKey = getPreferenceKey(Preferences.CATEGORY_UPGRADE_CLOUD, Preferences.SYSTEM_CONSOLE_LIMIT_REACHED);
@@ -120,11 +117,11 @@ function makeSpies() {

 describe('limits_reached_banner', () => {
    test('does not render when product is enterprise', () => {
-        const store = mockStore(state);
        const spies = makeSpies();
        spies.useGetUsageDeltas.mockReturnValue(someLimitReached);

-        renderWithIntl(<Provider store={store}><LimitReachedBanner product={enterprise}/></Provider>);
+        renderWithFullContext(<LimitReachedBanner product={enterprise}/>, state);
+
        expect(screen.queryByText(titleFree)).not.toBeInTheDocument();
        expect(screen.queryByText(titleProfessional)).not.toBeInTheDocument();
    });
@@ -143,46 +140,55 @@ describe('limits_reached_banner', () => {
                },
            },
        };
-        const store = mockStore(myState);
+
        const spies = makeSpies();
        spies.useGetUsageDeltas.mockReturnValue(someLimitReached);
-        renderWithIntl(<Provider store={store}><LimitReachedBanner product={enterprise}/></Provider>);
+
+        renderWithFullContext(<LimitReachedBanner product={enterprise}/>, myState);
+
        expect(screen.queryByText(titleFree)).not.toBeInTheDocument();
        expect(screen.queryByText(titleProfessional)).not.toBeInTheDocument();
    });

    test('does not render when no limit reached', () => {
-        const store = mockStore(state);
        const spies = makeSpies();
        spies.useGetUsageDeltas.mockReturnValue(noLimitReached);
-        renderWithIntl(<Provider store={store}><LimitReachedBanner product={free}/></Provider>);
+
+        renderWithFullContext(<LimitReachedBanner product={free}/>, state);
+
        expect(screen.queryByText(titleFree)).not.toBeInTheDocument();
        expect(screen.queryByText(titleProfessional)).not.toBeInTheDocument();
    });

    test('renders free banner', () => {
-        const store = mockStore(state);
        const spies = makeSpies();
        const mockOpenPricingModal = jest.fn();
        spies.useOpenPricingModal.mockReturnValue(mockOpenPricingModal);
        spies.useGetUsageDeltas.mockReturnValue(someLimitReached);
-        renderWithIntl(<Provider store={store}><LimitReachedBanner product={free}/></Provider>);
+
+        renderWithFullContext(<LimitReachedBanner product={free}/>, state);
+
        screen.getByText(titleFree);
        expect(screen.queryByText(titleProfessional)).not.toBeInTheDocument();
+
        fireEvent.click(screen.getByText('View plans'));
+
        expect(mockOpenPricingModal).toHaveBeenCalled();
    });

    test('clicking Contact Sales opens sales link', () => {
-        const store = mockStore(state);
        const spies = makeSpies();
        const mockOpenSalesLink = jest.fn();
        spies.useOpenSalesLink.mockReturnValue([mockOpenSalesLink, '']);
        spies.useGetUsageDeltas.mockReturnValue(someLimitReached);
-        renderWithIntl(<Provider store={store}><LimitReachedBanner product={free}/></Provider>);
+
+        renderWithFullContext(<LimitReachedBanner product={free}/>, state);
+
        screen.getByText(titleFree);
        expect(screen.queryByText(titleProfessional)).not.toBeInTheDocument();
+
        fireEvent.click(screen.getByText('Contact sales'));
+
        expect(mockOpenSalesLink).toHaveBeenCalled();
    });
 });
--- a/webapp/channels/src/components/admin_console/billing/billing_subscriptions/limits.test.tsx
+++ b/webapp/channels/src/components/admin_console/billing/billing_subscriptions/limits.test.tsx
@@ -3,12 +3,10 @@

 import React from 'react';

-import {screen} from '@testing-library/react';
-
 import * as redux from 'react-redux';
 import {Provider} from 'react-redux';

-import {renderWithIntl} from 'tests/react_testing_utils';
+import {renderWithIntl, screen} from 'tests/react_testing_utils';
 import mockStore from 'tests/test_store';

 import * as cloudActions from 'actions/cloud';
--- a/webapp/channels/src/components/admin_console/billing/billing_subscriptions/to_paid_plan_nudge_banner.test.tsx
+++ b/webapp/channels/src/components/admin_console/billing/billing_subscriptions/to_paid_plan_nudge_banner.test.tsx
@@ -2,9 +2,8 @@
 // See LICENSE.txt for license information.

 import React from 'react';
-import {screen} from '@testing-library/react';

-import {renderWithIntlAndStore} from 'tests/react_testing_utils';
+import {renderWithIntlAndStore, screen} from 'tests/react_testing_utils';
 import {CloudProducts} from 'utils/constants';

 import {ToPaidNudgeBanner, ToPaidPlanBannerDismissable} from './to_paid_plan_nudge_banner';
--- a/webapp/channels/src/components/admin_console/billing/billing_subscriptions/to_yearly_nudge_banner.test.tsx
+++ b/webapp/channels/src/components/admin_console/billing/billing_subscriptions/to_yearly_nudge_banner.test.tsx
@@ -2,9 +2,8 @@
 // See LICENSE.txt for license information.

 import React from 'react';
-import {screen} from '@testing-library/react';

-import {renderWithIntlAndStore} from 'tests/react_testing_utils';
+import {renderWithIntlAndStore, screen} from 'tests/react_testing_utils';
 import {CloudProducts, RecurringIntervals} from 'utils/constants';

 import {ToYearlyNudgeBanner, ToYearlyNudgeBannerDismissable} from './to_yearly_nudge_banner';
--- a/webapp/channels/src/components/admin_console/color_setting.test.tsx
+++ b/webapp/channels/src/components/admin_console/color_setting.test.tsx
@@ -3,9 +3,9 @@

 import React from 'react';

-import ColorSetting from 'components/admin_console/color_setting';
-import {renderWithIntl} from 'tests/react_testing_utils';
-import {screen} from '@testing-library/react';
+import {renderWithIntl, screen} from 'tests/react_testing_utils';
+
+import ColorSetting from './color_setting';

 describe('components/ColorSetting', () => {
    test('should match snapshot, all', () => {
--- a/webapp/channels/src/components/admin_console/feature_discovery/feature_discovery.test.tsx
+++ b/webapp/channels/src/components/admin_console/feature_discovery/feature_discovery.test.tsx
@@ -2,17 +2,22 @@
 // See LICENSE.txt for license information.

 import React from 'react';
+import {Provider as ReduxProvider} from 'react-redux';

 import FeatureDiscovery from 'components/admin_console/feature_discovery/feature_discovery';

+import store from 'stores/redux_store';
+
+import {
+    renderWithIntl,
+    screen,
+    userEvent,
+    waitFor,
+} from 'tests/react_testing_utils';
+
 import {LicenseSkus} from 'utils/constants';

 import SamlSVG from './features/images/saml_svg';
-import {renderWithIntl} from 'tests/react_testing_utils';
-import {screen, waitFor} from '@testing-library/react';
-import {Provider as ReduxProvider} from 'react-redux';
-import store from 'stores/redux_store';
-import userEvent from '@testing-library/user-event';

 describe('components/feature_discovery', () => {
    describe('FeatureDiscovery', () => {
--- a/webapp/channels/src/components/admin_console/license_settings/enterprise_edition/enterprise_edition_left_panel.test.tsx
+++ b/webapp/channels/src/components/admin_console/license_settings/enterprise_edition/enterprise_edition_left_panel.test.tsx
@@ -2,14 +2,13 @@
 // See LICENSE.txt for license information.

 import React from 'react';
-import {screen} from '@testing-library/react';

 import {Provider} from 'react-redux';

 import moment from 'moment-timezone';

 import {mountWithIntl} from 'tests/helpers/intl-test-helper';
-import {renderWithIntl} from 'tests/react_testing_utils';
+import {renderWithIntl, screen} from 'tests/react_testing_utils';
 import {OverActiveUserLimits, SelfHostedProducts} from 'utils/constants';
 import {TestHelper} from 'utils/test_helper';

--- a/webapp/channels/src/components/admin_console/text_setting.test.tsx
+++ b/webapp/channels/src/components/admin_console/text_setting.test.tsx
@@ -3,9 +3,9 @@

 import React from 'react';

+import {renderWithIntl, screen} from 'tests/react_testing_utils';
+
 import AdminTextSetting from './text_setting';
-import {renderWithIntl} from 'tests/react_testing_utils';
-import {screen} from '@testing-library/react';

 describe('components/admin_console/TextSetting', () => {
    test('render component with required props', () => {
--- a/webapp/channels/src/components/analytics/true_up_review.test.tsx
+++ b/webapp/channels/src/components/analytics/true_up_review.test.tsx
@@ -2,12 +2,11 @@
 // See LICENSE.txt for license information.

 import React from 'react';
-import {screen} from '@testing-library/react';

 import {GlobalState} from '@mattermost/types/store';
 import {DeepPartial} from '@mattermost/types/utilities';

-import {renderWithIntlAndStore} from 'tests/react_testing_utils';
+import {renderWithIntlAndStore, screen} from 'tests/react_testing_utils';
 import * as useCWSAvailabilityCheckAll from 'components/common/hooks/useCWSAvailabilityCheck';
 import {LicenseSkus} from 'utils/constants';

--- a/webapp/channels/src/components/announcement_bar/notify_admin_downgrade_delinquency_bar/notify_admin_downgrade_delinquency_bar.test.tsx
+++ b/webapp/channels/src/components/announcement_bar/notify_admin_downgrade_delinquency_bar/notify_admin_downgrade_delinquency_bar.test.tsx
@@ -2,11 +2,15 @@
 // See LICENSE.txt for license information.

 import React, {ComponentProps} from 'react';
-import {fireEvent, screen, waitFor} from '@testing-library/react';
 import * as reactRedux from 'react-redux';

 import configureStore from 'store';
-import {renderWithIntl} from 'tests/react_testing_utils';
+import {
+    fireEvent,
+    renderWithIntl,
+    screen,
+    waitFor,
+} from 'tests/react_testing_utils';
 import {CloudProducts, Preferences, TELEMETRY_CATEGORIES} from 'utils/constants';
 import {savePreferences} from 'mattermost-redux/actions/preferences';
 import {Client4} from 'mattermost-redux/client';
--- a/webapp/channels/src/components/announcement_bar/overage_users_banner/overage_users_banner.test.tsx
+++ b/webapp/channels/src/components/announcement_bar/overage_users_banner/overage_users_banner.test.tsx
@@ -2,13 +2,12 @@
 // See LICENSE.txt for license information.

 import React from 'react';
-import {fireEvent, screen} from '@testing-library/react';

 import {DeepPartial} from '@mattermost/types/utilities';
 import {GlobalState} from 'types/store';
 import {General} from 'mattermost-redux/constants';
 import {OverActiveUserLimits, Preferences, SelfHostedProducts, StatTypes} from 'utils/constants';
-import {renderWithIntlAndStore} from 'tests/react_testing_utils';
+import {fireEvent, renderWithIntlAndStore, screen} from 'tests/react_testing_utils';
 import {savePreferences} from 'mattermost-redux/actions/preferences';
 import {trackEvent} from 'actions/telemetry_actions';
 import {getLicenseSelfServeStatus} from 'mattermost-redux/actions/cloud';
--- a/webapp/channels/src/components/announcement_bar/payment_announcement_bar/index.test.tsx
+++ b/webapp/channels/src/components/announcement_bar/payment_announcement_bar/index.test.tsx
@@ -2,8 +2,7 @@
 // See LICENSE.txt for license information.

 import React from 'react';
-import {screen} from '@testing-library/react';
-import {renderWithIntlAndStore} from 'tests/react_testing_utils';
+import {renderWithIntlAndStore, screen} from 'tests/react_testing_utils';
 import * as cloudActions from 'mattermost-redux/actions/cloud';

 import {CloudProducts} from 'utils/constants';
--- a/webapp/channels/src/components/center_message_lock/index.test.tsx
+++ b/webapp/channels/src/components/center_message_lock/index.test.tsx
@@ -3,10 +3,9 @@

 import React from 'react';
 import {Provider} from 'react-redux';
-import {screen} from '@testing-library/react';

 import {makeEmptyUsage} from 'utils/limits_test';
-import {renderWithIntl} from 'tests/react_testing_utils';
+import {renderWithIntl, screen} from 'tests/react_testing_utils';
 import testConfigureStore from 'tests/test_store';
 import {adminUsersState, endUsersState} from 'tests/constants/users';
 import {emptyLimits} from 'tests/constants/cloud';
--- a/webapp/channels/src/components/channel_info_rhs/about_area_channel.test.tsx
+++ b/webapp/channels/src/components/channel_info_rhs/about_area_channel.test.tsx
@@ -2,10 +2,9 @@
 // See LICENSE.txt for license information.

 import React from 'react';
-import {screen} from '@testing-library/react';
 import {Provider} from 'react-redux';

-import {renderWithIntl} from 'tests/react_testing_utils';
+import {renderWithIntl, screen} from 'tests/react_testing_utils';
 import mockStore from 'tests/test_store';
 import {Channel} from '@mattermost/types/channels';

--- a/webapp/channels/src/components/channel_info_rhs/about_area_dm.test.tsx
+++ b/webapp/channels/src/components/channel_info_rhs/about_area_dm.test.tsx
@@ -2,10 +2,9 @@
 // See LICENSE.txt for license information.

 import React from 'react';
-import {screen} from '@testing-library/react';
 import {Provider} from 'react-redux';

-import {renderWithIntl} from 'tests/react_testing_utils';
+import {renderWithIntl, screen} from 'tests/react_testing_utils';
 import mockStore from 'tests/test_store';
 import Constants from 'utils/constants';
 import {Channel} from '@mattermost/types/channels';
--- a/webapp/channels/src/components/channel_info_rhs/about_area_gm.test.tsx
+++ b/webapp/channels/src/components/channel_info_rhs/about_area_gm.test.tsx
@@ -2,10 +2,9 @@
 // See LICENSE.txt for license information.

 import React from 'react';
-import {screen} from '@testing-library/react';
 import {Provider} from 'react-redux';

-import {renderWithIntl} from 'tests/react_testing_utils';
+import {renderWithIntl, screen} from 'tests/react_testing_utils';
 import mockStore from 'tests/test_store';
 import {Channel} from '@mattermost/types/channels';
 import {UserProfile} from '@mattermost/types/users';
--- a/webapp/channels/src/components/channel_info_rhs/channel_info_rhs.test.tsx
+++ b/webapp/channels/src/components/channel_info_rhs/channel_info_rhs.test.tsx
@@ -3,9 +3,7 @@

 import React from 'react';

-import {act} from '@testing-library/react';
-
-import {renderWithIntl} from 'tests/react_testing_utils';
+import {act, renderWithIntl} from 'tests/react_testing_utils';

 import {Channel, ChannelStats} from '@mattermost/types/channels';
 import {UserProfile} from '@mattermost/types/users';
--- a/webapp/channels/src/components/channel_info_rhs/components/editable_area.test.tsx
+++ b/webapp/channels/src/components/channel_info_rhs/components/editable_area.test.tsx
@@ -2,9 +2,8 @@
 // See LICENSE.txt for license information.

 import React from 'react';
-import {fireEvent, screen} from '@testing-library/react';

-import {renderWithIntl} from 'tests/react_testing_utils';
+import {fireEvent, renderWithIntl, screen} from 'tests/react_testing_utils';

 import EditableArea from './editable_area';

--- a/webapp/channels/src/components/channel_info_rhs/header.test.tsx
+++ b/webapp/channels/src/components/channel_info_rhs/header.test.tsx
@@ -2,10 +2,9 @@
 // See LICENSE.txt for license information.

 import React from 'react';
-import {fireEvent, screen} from '@testing-library/react';

 import {Channel} from '@mattermost/types/channels';
-import {renderWithIntl} from 'tests/react_testing_utils';
+import {fireEvent, renderWithIntl, screen} from 'tests/react_testing_utils';

 import Header from './header';

--- a/webapp/channels/src/components/channel_info_rhs/menu.test.tsx
+++ b/webapp/channels/src/components/channel_info_rhs/menu.test.tsx
@@ -2,9 +2,13 @@
 // See LICENSE.txt for license information.

 import React from 'react';
-import {act, fireEvent, screen} from '@testing-library/react';

-import {renderWithIntl} from 'tests/react_testing_utils';
+import {
+    act,
+    fireEvent,
+    renderWithIntl,
+    screen,
+} from 'tests/react_testing_utils';
 import Constants from 'utils/constants';

 import {Channel, ChannelStats} from '@mattermost/types/channels';
--- a/webapp/channels/src/components/channel_info_rhs/top_buttons.test.tsx
+++ b/webapp/channels/src/components/channel_info_rhs/top_buttons.test.tsx
@@ -2,9 +2,8 @@
 // See LICENSE.txt for license information.

 import React from 'react';
-import {fireEvent, screen} from '@testing-library/react';

-import {renderWithIntl} from 'tests/react_testing_utils';
+import {fireEvent, renderWithIntl, screen} from 'tests/react_testing_utils';
 import Constants from 'utils/constants';

 import TopButtons, {Props} from './top_buttons';
--- a/webapp/channels/src/components/channel_members_rhs/action_bar.test.tsx
+++ b/webapp/channels/src/components/channel_members_rhs/action_bar.test.tsx
@@ -2,9 +2,8 @@
 // See LICENSE.txt for license information.

 import React from 'react';
-import {fireEvent, screen} from '@testing-library/react';

-import {renderWithIntl} from 'tests/react_testing_utils';
+import {fireEvent, renderWithIntl, screen} from 'tests/react_testing_utils';
 import Constants from 'utils/constants';

 import ActionBar, {Props} from './action_bar';
--- a/webapp/channels/src/components/cloud_usage_modal/index.test.tsx
+++ b/webapp/channels/src/components/cloud_usage_modal/index.test.tsx
@@ -3,12 +3,10 @@

 import React from 'react';

-import {screen} from '@testing-library/react';
-
 import * as redux from 'react-redux';
 import {Provider} from 'react-redux';

-import {renderWithIntl} from 'tests/react_testing_utils';
+import {renderWithIntl, screen} from 'tests/react_testing_utils';
 import mockStore from 'tests/test_store';
 import {FileSizes} from 'utils/file_utils';

--- a/webapp/channels/src/components/common/hooks/useShowAdminLimitReached.test.tsx
+++ b/webapp/channels/src/components/common/hooks/useShowAdminLimitReached.test.tsx
@@ -2,10 +2,9 @@
 // See LICENSE.txt for license information.

 import React, {ReactPortal} from 'react';
-import {screen} from '@testing-library/react';
 import {Provider} from 'react-redux';

-import {renderWithIntl} from 'tests/react_testing_utils';
+import {renderWithIntl, screen} from 'tests/react_testing_utils';

 import {TestHelper} from 'utils/test_helper';
 import {Preferences} from 'utils/constants';
--- a/webapp/channels/src/components/delinquency_modal/delinquency_modal.test.tsx
+++ b/webapp/channels/src/components/delinquency_modal/delinquency_modal.test.tsx
@@ -2,10 +2,9 @@
 // See LICENSE.txt for license information.

 import React, {ComponentProps} from 'react';
-import {fireEvent, screen} from '@testing-library/react';
 import * as reactRedux from 'react-redux';

-import {renderWithIntl} from 'tests/react_testing_utils';
+import {fireEvent, renderWithIntl, screen} from 'tests/react_testing_utils';
 import {savePreferences} from 'mattermost-redux/actions/preferences';
 import {trackEvent} from 'actions/telemetry_actions';
 import configureStore from 'store';
--- a/webapp/channels/src/components/delinquency_modal/delinquency_modal_controller.test.tsx
+++ b/webapp/channels/src/components/delinquency_modal/delinquency_modal_controller.test.tsx
@@ -2,7 +2,6 @@
 // See LICENSE.txt for license information.

 import React from 'react';
-import {screen} from '@testing-library/react';
 import * as reactRedux from 'react-redux';

 import {CloudProducts, ModalIdentifiers, Preferences} from 'utils/constants';
@@ -10,7 +9,7 @@ import * as StorageSelectors from 'selectors/storage';
 import configureStore from 'store';
 import {TestHelper} from 'utils/test_helper';
 import ModalController from 'components/modal_controller';
-import {renderWithIntl} from 'tests/react_testing_utils';
+import {renderWithIntl, screen} from 'tests/react_testing_utils';
 import * as cloudActions from 'mattermost-redux/actions/cloud';

 import DelinquencyModalController from './index';
--- a/webapp/channels/src/components/delinquency_modal/freemium_modal.test.tsx
+++ b/webapp/channels/src/components/delinquency_modal/freemium_modal.test.tsx
@@ -2,10 +2,9 @@
 // See LICENSE.txt for license information.

 import React, {ComponentProps} from 'react';
-import {fireEvent, screen} from '@testing-library/react';
 import * as reactRedux from 'react-redux';

-import {renderWithIntl} from 'tests/react_testing_utils';
+import {fireEvent, renderWithIntl, screen} from 'tests/react_testing_utils';
 import {trackEvent} from 'actions/telemetry_actions';
 import configureStore from 'store';
 import {ModalIdentifiers, TELEMETRY_CATEGORIES} from 'utils/constants';
--- a/webapp/channels/src/components/dot_menu/dot_menu.test.tsx
+++ b/webapp/channels/src/components/dot_menu/dot_menu.test.tsx
@@ -2,12 +2,11 @@
 // See LICENSE.txt for license information.

 import React from 'react';
-import {screen, fireEvent} from '@testing-library/react';

 import {shallowWithIntl} from 'tests/helpers/intl-test-helper';
 import {Locations} from 'utils/constants';
 import {TestHelper} from 'utils/test_helper';
-import {renderWithIntlAndStore} from 'tests/react_testing_utils';
+import {fireEvent, renderWithIntlAndStore, screen} from 'tests/react_testing_utils';
 import {GlobalState} from 'types/store';

 import {DeepPartial} from '@mattermost/types/utilities';
--- a/webapp/channels/src/components/emoji_picker/emoji_picker.test.tsx
+++ b/webapp/channels/src/components/emoji_picker/emoji_picker.test.tsx
@@ -2,12 +2,13 @@
 // See LICENSE.txt for license information.

 import React from 'react';
-import {render, screen} from '@testing-library/react';
 import {IntlProvider} from 'react-intl';

+import {render, screen} from 'tests/react_testing_utils';
+
 import EmojiMap from 'utils/emoji_map';

-import EmojiPicker from 'components/emoji_picker/emoji_picker';
+import EmojiPicker from './emoji_picker';

 jest.mock('components/emoji_picker/components/emoji_picker_skin', () => () => (
    <div/>
--- a/webapp/channels/src/components/error_page/error_page.test.tsx
+++ b/webapp/channels/src/components/error_page/error_page.test.tsx
@@ -2,12 +2,11 @@
 // See LICENSE.txt for license information.

 import React from 'react';
-import {screen} from '@testing-library/react';
 import {BrowserRouter} from 'react-router-dom';

 import {GlobalState} from '@mattermost/types/store';

-import {renderWithIntlAndStore} from 'tests/react_testing_utils';
+import {renderWithIntlAndStore, screen} from 'tests/react_testing_utils';

 import {ErrorPageTypes} from 'utils/constants';

--- a/webapp/channels/src/components/external_link/external_link.test.tsx
+++ b/webapp/channels/src/components/external_link/external_link.test.tsx
@@ -3,7 +3,6 @@

 import React from 'react';
 import {mount} from 'enzyme';
-import {screen} from '@testing-library/react';

 import {Provider} from 'react-redux';

@@ -11,7 +10,7 @@ import {DeepPartial} from 'redux';

 import mockStore from 'tests/test_store';

-import {renderWithIntlAndStore} from 'tests/react_testing_utils';
+import {renderWithIntlAndStore, screen} from 'tests/react_testing_utils';

 import {GlobalState} from 'types/store';

--- a/webapp/channels/src/components/file_attachment/file_attachment.test.tsx
+++ b/webapp/channels/src/components/file_attachment/file_attachment.test.tsx
@@ -4,11 +4,9 @@
 import {shallow} from 'enzyme';
 import React from 'react';

-import {screen} from '@testing-library/react';
-
 import {mountWithIntl} from 'tests/helpers/intl-test-helper';

-import {renderWithIntl, renderWithIntlAndStore} from 'tests/react_testing_utils';
+import {renderWithIntl, renderWithIntlAndStore, screen} from 'tests/react_testing_utils';

 import {GlobalState} from '@mattermost/types/store';

--- a/webapp/channels/src/components/invitation_modal/add_to_channels.test.tsx
+++ b/webapp/channels/src/components/invitation_modal/add_to_channels.test.tsx
@@ -2,10 +2,9 @@
 // See LICENSE.txt for license information.

 import React from 'react';
-import {screen} from '@testing-library/react';

 import {mountWithIntl} from 'tests/helpers/intl-test-helper';
-import {renderWithIntl} from 'tests/react_testing_utils';
+import {renderWithIntl, screen} from 'tests/react_testing_utils';
 import deepFreeze from 'mattermost-redux/utils/deep_freeze';
 import {Channel} from '@mattermost/types/channels';
 import CloseCircleIcon from 'components/widgets/icons/close_circle_icon';
--- a/webapp/channels/src/components/invitation_modal/overage_users_banner_notice/overage_users_banner_notice.test.tsx
+++ b/webapp/channels/src/components/invitation_modal/overage_users_banner_notice/overage_users_banner_notice.test.tsx
@@ -2,13 +2,17 @@
 // See LICENSE.txt for license information.

 import React from 'react';
-import {act, fireEvent, screen} from '@testing-library/react';

 import {DeepPartial} from '@mattermost/types/utilities';
 import {GlobalState} from 'types/store';
 import {General} from 'mattermost-redux/constants';
 import {LicenseLinks, OverActiveUserLimits, Preferences, SelfHostedProducts, StatTypes} from 'utils/constants';
-import {renderWithIntlAndStore} from 'tests/react_testing_utils';
+import {
+    act,
+    fireEvent,
+    renderWithIntlAndStore,
+    screen,
+} from 'tests/react_testing_utils';
 import {savePreferences} from 'mattermost-redux/actions/preferences';
 import {trackEvent} from 'actions/telemetry_actions';
 import {TestHelper} from 'utils/test_helper';
--- a/webapp/channels/src/components/new_channel_modal/new_channel_modal.test.tsx
+++ b/webapp/channels/src/components/new_channel_modal/new_channel_modal.test.tsx
@@ -4,18 +4,25 @@
 import React from 'react';
 import {act} from 'react-dom/test-utils';

+import {createChannel} from 'mattermost-redux/actions/channels';
+import Permissions from 'mattermost-redux/constants/permissions';
+
+import {
+    render,
+    renderWithIntl,
+    screen,
+    userEvent,
+    waitFor,
+} from 'tests/react_testing_utils';
+
+import {GlobalState} from 'types/store';
+
 import {suitePluginIds} from 'utils/constants';
 import {cleanUpUrlable} from 'utils/url';
-import {GlobalState} from 'types/store';
-import Permissions from 'mattermost-redux/constants/permissions';
-import {createChannel} from 'mattermost-redux/actions/channels';
-
-jest.mock('mattermost-redux/actions/channels');

 import NewChannelModal from './new_channel_modal';
-import {render, screen, waitFor} from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
-import {renderWithIntl} from 'tests/react_testing_utils';
+
+jest.mock('mattermost-redux/actions/channels');

 const mockDispatch = jest.fn();
 let mockState: GlobalState;
--- a/webapp/channels/src/components/payment_form/gather_intent/gather_intent.test.tsx
+++ b/webapp/channels/src/components/payment_form/gather_intent/gather_intent.test.tsx
@@ -1,11 +1,15 @@
 // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
 // See LICENSE.txt for license information.

-import {fireEvent, screen, act} from '@testing-library/react';
 import React from 'react';
 import * as reactRedux from 'react-redux';

-import {renderWithIntlAndStore} from 'tests/react_testing_utils';
+import {
+    act,
+    fireEvent,
+    renderWithIntlAndStore,
+    screen,
+} from 'tests/react_testing_utils';
 import {TestHelper} from 'utils/test_helper';

 import {GatherIntent} from './gather_intent';
--- a/webapp/channels/src/components/payment_form/gather_intent/gather_intent_modal.test.tsx
+++ b/webapp/channels/src/components/payment_form/gather_intent/gather_intent_modal.test.tsx
@@ -1,10 +1,9 @@
 // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
 // See LICENSE.txt for license information.

-import {fireEvent, screen} from '@testing-library/react';
 import React from 'react';

-import {renderWithIntl} from 'tests/react_testing_utils';
+import {fireEvent, renderWithIntl, screen} from 'tests/react_testing_utils';

 import {GatherIntentModal, GatherIntentModalProps} from './gather_intent_modal';

--- a/webapp/channels/src/components/post/post_component.test.tsx
+++ b/webapp/channels/src/components/post/post_component.test.tsx
@@ -1,12 +1,11 @@
 // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
 // See LICENSE.txt for license information.

-import {screen} from '@testing-library/react';
 import React from 'react';

 import {DeepPartial} from '@mattermost/types/utilities';

-import {renderWithFullContext} from 'tests/react_testing_utils';
+import {renderWithFullContext, screen} from 'tests/react_testing_utils';

 import {GlobalState} from 'types/store';

--- a/webapp/channels/src/components/post_emoji/post_emoji.test.tsx
+++ b/webapp/channels/src/components/post_emoji/post_emoji.test.tsx
@@ -3,8 +3,9 @@

 import React from 'react';

+import {render, screen} from 'tests/react_testing_utils';
+
 import PostEmoji from './post_emoji';
-import {render, screen} from '@testing-library/react';

 describe('PostEmoji', () => {
    const baseProps = {
--- a/webapp/channels/src/components/post_markdown/post_markdown.test.tsx
+++ b/webapp/channels/src/components/post_markdown/post_markdown.test.tsx
@@ -3,14 +3,15 @@

 import React from 'react';

+import {Post, PostType} from '@mattermost/types/posts';
+
 import {Posts} from 'mattermost-redux/constants';

-import PostMarkdown from 'components/post_markdown/post_markdown';
+import {renderWithIntlAndStore, screen} from 'tests/react_testing_utils';
+
 import {TestHelper} from 'utils/test_helper';

-import {Post, PostType} from '@mattermost/types/posts';
-import {screen} from '@testing-library/react';
-import {renderWithIntlAndStore} from 'tests/react_testing_utils';
+import PostMarkdown from './post_markdown';

 describe('components/PostMarkdown', () => {
    const baseProps = {
--- a/webapp/channels/src/components/post_profile_picture/post_profile_picture.test.tsx
+++ b/webapp/channels/src/components/post_profile_picture/post_profile_picture.test.tsx
@@ -3,10 +3,11 @@

 import React, {ComponentProps} from 'react';

+import {render, screen} from 'tests/react_testing_utils';
+
 import {TestHelper} from 'utils/test_helper';

 import PostProfilePicture from './post_profile_picture';
-import {render, screen} from '@testing-library/react';

 type Props = ComponentProps<typeof PostProfilePicture>;

--- a/webapp/channels/src/components/post_view/channel_intro_message/channel_intro_message.test.tsx
+++ b/webapp/channels/src/components/post_view/channel_intro_message/channel_intro_message.test.tsx
@@ -9,8 +9,7 @@ import {UserProfile} from '@mattermost/types/users';
 import {Channel, ChannelType} from '@mattermost/types/channels';

 import ChannelIntroMessage from './channel_intro_message';
-import {screen} from '@testing-library/react';
-import {renderWithIntlAndStore} from 'tests/react_testing_utils';
+import {renderWithIntlAndStore, screen} from 'tests/react_testing_utils';
 import {TestHelper} from 'utils/test_helper';

 describe('components/post_view/ChannelIntroMessages', () => {
--- a/webapp/channels/src/components/post_view/combined_system_message/last_users.test.tsx
+++ b/webapp/channels/src/components/post_view/combined_system_message/last_users.test.tsx
@@ -5,11 +5,11 @@ import React from 'react';

 import {Posts} from 'mattermost-redux/constants';

-import LastUsers from './last_users';
-import {renderWithIntlAndStore} from 'tests/react_testing_utils';
-import {screen} from '@testing-library/react';
+import {renderWithIntlAndStore, screen, userEvent} from 'tests/react_testing_utils';
+
 import {TestHelper} from 'utils/test_helper';
-import userEvent from '@testing-library/user-event';
+
+import LastUsers from './last_users';

 describe('components/post_view/combined_system_message/LastUsers', () => {
    const formatOptions = {
--- a/webapp/channels/src/components/post_view/commented_on_files_message/commented_on_files_message.test.tsx
+++ b/webapp/channels/src/components/post_view/commented_on_files_message/commented_on_files_message.test.tsx
@@ -3,9 +3,9 @@

 import React from 'react';

+import {render, renderWithIntl, screen} from 'tests/react_testing_utils';
+
 import CommentedOnFilesMessage from './commented_on_files_message';
-import {render, screen} from '@testing-library/react';
-import {renderWithIntl} from 'tests/react_testing_utils';

 describe('components/CommentedOnFilesMessage', () => {
    const baseProps = {
--- a/webapp/channels/src/components/post_view/date_separator/date_separator.test.tsx
+++ b/webapp/channels/src/components/post_view/date_separator/date_separator.test.tsx
@@ -3,9 +3,9 @@

 import React from 'react';

-import DateSeparator from 'components/post_view/date_separator/date_separator';
-import {screen} from '@testing-library/react';
-import {renderWithIntlAndStore} from 'tests/react_testing_utils';
+import {renderWithIntlAndStore, screen} from 'tests/react_testing_utils';
+
+import DateSeparator from './date_separator';

 describe('components/post_view/DateSeparator', () => {
    const initialState = {
--- a/webapp/channels/src/components/post_view/embedded_bindings/button_binding/button_binding.test.tsx
+++ b/webapp/channels/src/components/post_view/embedded_bindings/button_binding/button_binding.test.tsx
@@ -4,13 +4,17 @@
 import React from 'react';

 import {AppBinding, AppCallResponse} from '@mattermost/types/apps';
-
 import {Post} from '@mattermost/types/posts';

+import {
+    renderWithIntlAndStore,
+    screen,
+    userEvent,
+    waitFor,
+} from 'tests/react_testing_utils';
+
 import ButtonBinding, {ButtonBinding as ButtonBindingUnwrapped} from './button_binding';
-import {renderWithIntlAndStore} from 'tests/react_testing_utils';
-import {screen, waitFor} from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
+
 describe('components/post_view/embedded_bindings/button_binding/', () => {
    const post = {
        id: 'some_post_id',
--- a/webapp/channels/src/components/post_view/failed_post_options/failed_post_options.test.tsx
+++ b/webapp/channels/src/components/post_view/failed_post_options/failed_post_options.test.tsx
@@ -3,12 +3,11 @@

 import React from 'react';

-import {TestHelper} from 'utils/test_helper';
-
 import FailedPostOptions from 'components/post_view/failed_post_options/failed_post_options';
-import {renderWithIntl} from 'tests/react_testing_utils';
-import {screen} from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
+
+import {renderWithIntl, screen, userEvent} from 'tests/react_testing_utils';
+
+import {TestHelper} from 'utils/test_helper';

 describe('components/post_view/FailedPostOptions', () => {
    const baseProps = {
--- a/webapp/channels/src/components/post_view/floating_timestamp/floating_timestamp.test.tsx
+++ b/webapp/channels/src/components/post_view/floating_timestamp/floating_timestamp.test.tsx
@@ -3,9 +3,9 @@

 import React from 'react';

+import {renderWithIntlAndStore, screen} from 'tests/react_testing_utils';
+
 import FloatingTimestamp from './floating_timestamp';
-import {screen} from '@testing-library/react';
-import {renderWithIntlAndStore} from 'tests/react_testing_utils';

 describe('components/post_view/FloatingTimestamp', () => {
    const baseProps = {
--- a/webapp/channels/src/components/post_view/message_attachments/action_button/action_button.test.tsx
+++ b/webapp/channels/src/components/post_view/message_attachments/action_button/action_button.test.tsx
@@ -3,13 +3,13 @@

 import React from 'react';

+import {Preferences} from 'mattermost-redux/constants';
 import {Theme} from 'mattermost-redux/selectors/entities/preferences';
 import {changeOpacity} from 'mattermost-redux/utils/theme_utils';
-import {Preferences} from 'mattermost-redux/constants';

-import ActionButton from 'components/post_view/message_attachments/action_button/action_button';
-import {render, screen} from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
+import {render, screen, userEvent} from 'tests/react_testing_utils';
+
+import ActionButton from './action_button';

 describe('components/post_view/message_attachments/action_button.jsx', () => {
    const baseProps = {
--- a/webapp/channels/src/components/post_view/message_attachments/action_menu/action_menu.test.tsx
+++ b/webapp/channels/src/components/post_view/message_attachments/action_menu/action_menu.test.tsx
@@ -3,9 +3,9 @@

 import React from 'react';

+import {renderWithIntlAndStore, screen} from 'tests/react_testing_utils';
+
 import ActionMenu from './action_menu';
-import {screen} from '@testing-library/react';
-import {renderWithIntlAndStore} from 'tests/react_testing_utils';

 describe('components/post_view/message_attachments/ActionMenu', () => {
    const baseProps = {
--- a/webapp/channels/src/components/post_view/new_message_separator/new_message_separator.test.tsx
+++ b/webapp/channels/src/components/post_view/new_message_separator/new_message_separator.test.tsx
@@ -3,9 +3,9 @@

 import React from 'react';

+import {renderWithIntl, screen} from 'tests/react_testing_utils';
+
 import NewMessageSeparator from './new_message_separator';
-import {screen} from '@testing-library/react';
-import {renderWithIntl} from 'tests/react_testing_utils';

 describe('components/post_view/new_message_separator', () => {
    test('should render new_message_separator', () => {
--- a/webapp/channels/src/components/post_view/post_attachment_container/post_attachment_container.test.tsx
+++ b/webapp/channels/src/components/post_view/post_attachment_container/post_attachment_container.test.tsx
@@ -3,12 +3,12 @@

 import React from 'react';

-import PostAttachmentContainer, {Props} from './post_attachment_container';
-import {screen} from '@testing-library/react';
-import {renderWithIntlAndStore} from 'tests/react_testing_utils';
+import {renderWithIntlAndStore, screen} from 'tests/react_testing_utils';
 import {DeepPartial} from '@mattermost/types/utilities';
 import {GlobalState} from '@mattermost/types/store';

+import PostAttachmentContainer, {Props} from './post_attachment_container';
+
 describe('PostAttachmentContainer', () => {
    const baseProps: Props = {
        children: <p>{'some children'}</p>,
--- a/webapp/channels/src/components/post_view/post_list_virtualized/latest_post_reader.test.tsx
+++ b/webapp/channels/src/components/post_view/post_list_virtualized/latest_post_reader.test.tsx
@@ -3,18 +3,17 @@

 import React from 'react';
 import {createIntl, useIntl} from 'react-intl';
+import {Provider} from 'react-redux';

 import enMessages from 'i18n/en.json';
 import esMessages from 'i18n/es.json';

+import {render, renderWithIntlAndStore, screen} from 'tests/react_testing_utils';
 import {mockStore} from 'tests/test_store';

 import {TestHelper} from 'utils/test_helper';

 import LatestPostReader from './latest_post_reader';
-import {render, screen} from '@testing-library/react';
-import {renderWithIntlAndStore} from 'tests/react_testing_utils';
-import {Provider} from 'react-redux';

 jest.mock('react-intl', () => ({
    ...jest.requireActual('react-intl'),
--- a/webapp/channels/src/components/preparing_workspace/invite_members.test.tsx
+++ b/webapp/channels/src/components/preparing_workspace/invite_members.test.tsx
@@ -2,7 +2,8 @@
 // See LICENSE.txt for license information.

 import React, {ComponentProps} from 'react';
-import {render, screen, fireEvent} from '@testing-library/react';
+
+import {fireEvent, render, screen} from 'tests/react_testing_utils';
 import {withIntl} from 'tests/helpers/intl-test-helper';

 import InviteMembers from './invite_members';
--- a/webapp/channels/src/components/preparing_workspace/invite_members_link.test.tsx
+++ b/webapp/channels/src/components/preparing_workspace/invite_members_link.test.tsx
@@ -2,11 +2,14 @@
 // See LICENSE.txt for license information.

 import React from 'react';
-import {render, screen, fireEvent} from '@testing-library/react';
+
 import {trackEvent} from 'actions/telemetry_actions';
-import InviteMembersLink from './invite_members_link';
+
+import {fireEvent, render, screen} from 'tests/react_testing_utils';
 import {withIntl} from 'tests/helpers/intl-test-helper';

+import InviteMembersLink from './invite_members_link';
+
 jest.mock('actions/telemetry_actions', () => ({
    trackEvent: jest.fn(),
 }));
--- a/webapp/channels/src/components/preparing_workspace/organization_status.test.tsx
+++ b/webapp/channels/src/components/preparing_workspace/organization_status.test.tsx
@@ -2,11 +2,14 @@
 // See LICENSE.txt for license information.

 import React from 'react';
-import {render} from '@testing-library/react';
-import {BadUrlReasons} from 'utils/url';
-import OrganizationStatus, {TeamApiError} from './organization_status';
+
+import {render} from 'tests/react_testing_utils';
 import {withIntl} from 'tests/helpers/intl-test-helper';

+import {BadUrlReasons} from 'utils/url';
+
+import OrganizationStatus, {TeamApiError} from './organization_status';
+
 describe('components/preparing-workspace/organization_status', () => {
    const defaultProps = {
        error: null,
--- a/webapp/channels/src/components/pricing_modal/downgrade_team_removal_modal/downgrade_team_removal_modal.test.tsx
+++ b/webapp/channels/src/components/pricing_modal/downgrade_team_removal_modal/downgrade_team_removal_modal.test.tsx
@@ -2,11 +2,9 @@
 // See LICENSE.txt for license information.

 import React from 'react';
-
 import * as redux from 'react-redux';
-import {screen} from '@testing-library/react';

-import {renderWithIntl} from 'tests/react_testing_utils';
+import {renderWithIntl, screen} from 'tests/react_testing_utils';
 import mockStore from 'tests/test_store';

 import {CloudProducts} from 'utils/constants';
--- a/webapp/channels/src/components/purchase_in_progress_modal/index.test.tsx
+++ b/webapp/channels/src/components/purchase_in_progress_modal/index.test.tsx
@@ -2,11 +2,10 @@
 // See LICENSE.txt for license information.

 import React from 'react';
-import {screen} from '@testing-library/react';

 import {DeepPartial} from '@mattermost/types/utilities';

-import {renderWithIntlAndStore} from 'tests/react_testing_utils';
+import {renderWithIntlAndStore, screen} from 'tests/react_testing_utils';
 import {GlobalState} from 'types/store';
 import {TestHelper as TH} from 'utils/test_helper';
 import {Client4} from 'mattermost-redux/client';
--- a/webapp/channels/src/components/root_portal.test.tsx
+++ b/webapp/channels/src/components/root_portal.test.tsx
@@ -2,7 +2,8 @@
 // See LICENSE.txt for license information.

 import React from 'react';
-import {render} from '@testing-library/react';
+
+import {render} from 'tests/react_testing_utils';

 import RootPortal from './root_portal';

--- a/webapp/channels/src/components/screening_in_progress_modal/index.test.tsx
+++ b/webapp/channels/src/components/screening_in_progress_modal/index.test.tsx
@@ -2,9 +2,8 @@
 // See LICENSE.txt for license information.

 import React from 'react';
-import {screen} from '@testing-library/react';

-import {renderWithIntlAndStore} from 'tests/react_testing_utils';
+import {renderWithIntlAndStore, screen} from 'tests/react_testing_utils';

 import * as controlModalHooks from 'components/common/hooks/useControlModal';

--- a/webapp/channels/src/components/search_bar/search_bar.test.tsx
+++ b/webapp/channels/src/components/search_bar/search_bar.test.tsx
@@ -2,15 +2,16 @@
 // See LICENSE.txt for license information.

 import React, {ComponentProps} from 'react';
-import {render} from '@testing-library/react';
 import {IntlProvider} from 'react-intl';
 import {Provider} from 'react-redux';

 import SearchDateProvider from 'components/suggestion/search_date_provider';
 import SearchChannelProvider from 'components/suggestion/search_channel_provider';
 import SearchUserProvider from 'components/suggestion/search_user_provider';
+
 import en from 'i18n/en.json';

+import {render} from 'tests/react_testing_utils';
 import mockStore from 'tests/test_store';

 import SearchBar from './search_bar';
--- a/webapp/channels/src/components/search_results_header/search_results_header.test.tsx
+++ b/webapp/channels/src/components/search_results_header/search_results_header.test.tsx
@@ -2,9 +2,8 @@
 // See LICENSE.txt for license information.

 import React from 'react';
-import {screen} from '@testing-library/react';

-import {renderWithIntl} from 'tests/react_testing_utils';
+import {renderWithIntl, screen} from 'tests/react_testing_utils';

 import {RHSStates} from 'utils/constants';
 import {RhsState} from 'types/store/rhs';
--- a/webapp/channels/src/components/self_hosted_purchases/self_hosted_expansion_modal/index.test.tsx
+++ b/webapp/channels/src/components/self_hosted_purchases/self_hosted_expansion_modal/index.test.tsx
@@ -3,13 +3,16 @@

 import React from 'react';

-import {screen, fireEvent, waitFor} from '@testing-library/react';
-
 import {GlobalState} from 'types/store';

 import {SelfHostedSignupForm, SelfHostedSignupProgress} from '@mattermost/types/hosted_customer';

-import {renderWithIntlAndStore} from 'tests/react_testing_utils';
+import {
+    fireEvent,
+    renderWithIntlAndStore,
+    screen,
+    waitFor,
+} from 'tests/react_testing_utils';
 import {TestHelper as TH} from 'utils/test_helper';
 import {SelfHostedProducts, ModalIdentifiers, RecurringIntervals} from 'utils/constants';

--- a/webapp/channels/src/components/self_hosted_purchases/self_hosted_purchase_modal/index.test.tsx
+++ b/webapp/channels/src/components/self_hosted_purchases/self_hosted_purchase_modal/index.test.tsx
@@ -3,13 +3,17 @@

 import React from 'react';

-import {screen, fireEvent, waitFor} from '@testing-library/react';
-
 import {GlobalState} from 'types/store';

 import {SelfHostedSignupForm, SelfHostedSignupProgress} from '@mattermost/types/hosted_customer';

-import {renderWithIntlAndStore} from 'tests/react_testing_utils';
+import {
+    fireEvent,
+    renderWithIntlAndStore,
+    screen,
+    waitFor,
+} from 'tests/react_testing_utils';
+
 import {TestHelper as TH} from 'utils/test_helper';
 import {SelfHostedProducts, ModalIdentifiers} from 'utils/constants';

--- a/webapp/channels/src/components/signup/signup.test.tsx
+++ b/webapp/channels/src/components/signup/signup.test.tsx
@@ -5,7 +5,6 @@ import React from 'react';
 import {shallow, ReactWrapper} from 'enzyme';
 import {IntlProvider} from 'react-intl';
 import {BrowserRouter} from 'react-router-dom';
-import {act, screen} from '@testing-library/react';

 import {mountWithIntl} from 'tests/helpers/intl-test-helper';

@@ -19,7 +18,7 @@ import {RequestStatus} from 'mattermost-redux/constants';
 import {ClientConfig} from '@mattermost/types/config';
 import {GlobalState} from 'types/store';
 import {WindowSizes} from 'utils/constants';
-import {renderWithIntlAndStore} from 'tests/react_testing_utils';
+import {act, renderWithIntlAndStore, screen} from 'tests/react_testing_utils';

 let mockState: GlobalState;
 let mockLocation = {pathname: '', search: '', hash: ''};
--- a/webapp/channels/src/components/start_trial_form_modal/start_trial_form_modal.test.tsx
+++ b/webapp/channels/src/components/start_trial_form_modal/start_trial_form_modal.test.tsx
@@ -1,14 +1,18 @@
 // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
 // See LICENSE.txt for license information.

-import {act, RenderResult, screen} from '@testing-library/react';
 import React from 'react';
 import {Provider} from 'react-redux';
 import mockStore from 'tests/test_store';
 import {ModalIdentifiers} from 'utils/constants';
 import StartTrialFormModal from '.';
 import {BrowserRouter} from 'react-router-dom';
-import {renderWithIntl} from 'tests/react_testing_utils';
+import {
+    act,
+    RenderResult,
+    renderWithIntl,
+    screen,
+} from 'tests/react_testing_utils';
 import {trackEvent} from 'actions/telemetry_actions';

 jest.mock('actions/telemetry_actions.jsx', () => {
--- a/webapp/channels/src/components/user_group_popover/group_member_list/group_member_list.test.tsx
+++ b/webapp/channels/src/components/user_group_popover/group_member_list/group_member_list.test.tsx
@@ -3,13 +3,13 @@

 import React from 'react';
 import {Provider} from 'react-redux';
-import {act} from '@testing-library/react';
 import {ReactWrapper} from 'enzyme';
 import {BrowserRouter} from 'react-router-dom';

 import {General} from 'mattermost-redux/constants';
 import {displayUsername} from 'mattermost-redux/utils/user_utils';
 import {mountWithIntl} from 'tests/helpers/intl-test-helper';
+import {act} from 'tests/react_testing_utils';
 import mockStore from 'tests/test_store';
 import {TestHelper} from 'utils/test_helper';

--- a/webapp/channels/src/components/user_group_popover/user_group_popover.test.tsx
+++ b/webapp/channels/src/components/user_group_popover/user_group_popover.test.tsx
@@ -3,7 +3,6 @@

 import React from 'react';
 import {Provider} from 'react-redux';
-import {act} from '@testing-library/react';
 import {ReactWrapper} from 'enzyme';
 import {BrowserRouter} from 'react-router-dom';

@@ -11,6 +10,7 @@ import {UserProfile} from '@mattermost/types/users';
 import {Group} from '@mattermost/types/groups';

 import {mountWithIntl} from 'tests/helpers/intl-test-helper';
+import {act} from 'tests/react_testing_utils';
 import mockStore from 'tests/test_store';
 import {TestHelper} from 'utils/test_helper';

--- a/webapp/channels/src/components/user_groups_modal/ad_ldap_upsell_banner.test.tsx
+++ b/webapp/channels/src/components/user_groups_modal/ad_ldap_upsell_banner.test.tsx
@@ -4,8 +4,8 @@
 import React from 'react';
 import {mount, ReactWrapper} from 'enzyme';
 import * as reactRedux from 'react-redux';
-import {act} from '@testing-library/react';

+import {act} from 'tests/react_testing_utils';
 import mockStore from 'tests/test_store';

 import {CloudProducts, LicenseSkus} from 'utils/constants';
--- a/webapp/channels/src/components/user_settings/display/user_settings_theme/user_settings_theme.test.tsx
+++ b/webapp/channels/src/components/user_settings/display/user_settings_theme/user_settings_theme.test.tsx
@@ -5,14 +5,14 @@ import React, {ComponentProps} from 'react';
 import {shallow} from 'enzyme';
 import {IntlProvider} from 'react-intl';
 import {Provider} from 'react-redux';
-import {render, fireEvent, screen} from '@testing-library/react';

 import {Preferences} from 'mattermost-redux/constants';

-import UserSettingsTheme from 'components/user_settings/display/user_settings_theme/user_settings_theme';
-
+import {render, fireEvent, screen} from 'tests/react_testing_utils';
 import mockStore from 'tests/test_store';

+import UserSettingsTheme from './user_settings_theme';
+
 jest.mock('utils/utils', () => ({
    applyTheme: jest.fn(),
    toTitleCase: jest.fn(),
--- a/webapp/channels/src/components/widgets/menu/menu_items/useWords.test.tsx
+++ b/webapp/channels/src/components/widgets/menu/menu_items/useWords.test.tsx
@@ -2,10 +2,9 @@
 // See LICENSE.txt for license information.

 import React from 'react';
-import {screen} from '@testing-library/react';
 import {Provider} from 'react-redux';

-import {renderWithIntl} from 'tests/react_testing_utils';
+import {renderWithIntl, screen} from 'tests/react_testing_utils';
 import mockStore from 'tests/test_store';

 import {LimitSummary} from 'components/common/hooks/useGetHighestThresholdCloudLimit';
--- a/webapp/channels/src/tests/react_testing_utils.test.tsx
+++ b/webapp/channels/src/tests/react_testing_utils.test.tsx
@@ -1,7 +1,6 @@
 // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
 // See LICENSE.txt for license information.

-import {screen} from '@testing-library/react';
 import React from 'react';
 import {FormattedMessage, useIntl} from 'react-intl';
 import {connect, useSelector} from 'react-redux';
@@ -14,7 +13,7 @@ import {GlobalState} from 'types/store';

 import {TestHelper} from 'utils/test_helper';

-import {renderWithFullContext} from './react_testing_utils';
+import {renderWithFullContext, screen} from './react_testing_utils';

 describe('renderWithFullContext', () => {
    test('should be able to render anything', () => {
--- a/webapp/channels/src/tests/react_testing_utils.tsx
+++ b/webapp/channels/src/tests/react_testing_utils.tsx
@@ -2,6 +2,7 @@
 // See LICENSE.txt for license information.

 import {render} from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
 import {createBrowserHistory} from 'history';
 import React from 'react';
 import {IntlProvider} from 'react-intl';
@@ -10,12 +11,16 @@ import {Router} from 'react-router-dom';

 import {DeepPartial} from '@mattermost/types/utilities';

+import mergeObjects from 'packages/mattermost-redux/test/merge_objects';
+
 import configureStore from 'store';

 import mockStore from 'tests/test_store';

 import {GlobalState} from 'types/store';
-import mergeObjects from 'packages/mattermost-redux/test/merge_objects';
+
+export * from '@testing-library/react';
+export {userEvent};

 export const renderWithIntl = (component: React.ReactNode | React.ReactNodeArray, locale = 'en') => {
    return render(<IntlProvider locale={locale}>{component}</IntlProvider>);