SONAR-20254 Migrate Global Footer test to RTL

server/sonar-web/src/main/js/app/components/GlobalFooter.tsx

@@ -24,16 +24,15 @@ import Link from '../../components/common/Link';
 import { Alert } from '../../components/ui/Alert';
 import { getEdition } from '../../helpers/editions';
 import { translate, translateWithParameters } from '../../helpers/l10n';
-import { AppState } from '../../types/appstate';
-import withAppStateContext from './app-state/withAppStateContext';
 import GlobalFooterBranding from './GlobalFooterBranding';
+import { AppStateContext } from './app-state/AppStateContext';
 
-export interface GlobalFooterProps {
+interface GlobalFooterProps {
   hideLoggedInInfo?: boolean;
-  appState?: AppState;
 }
 
-export function GlobalFooter({ hideLoggedInInfo, appState }: GlobalFooterProps) {
+export default function GlobalFooter({ hideLoggedInInfo }: GlobalFooterProps) {
+  const appState = React.useContext(AppStateContext);
   const currentEdition = appState?.edition && getEdition(appState.edition);
 
   return (
@@ -93,5 +92,3 @@ export function GlobalFooter({ hideLoggedInInfo, appState }: GlobalFooterProps)
     </div>
   );
 }
-
-export default withAppStateContext(GlobalFooter);

server/sonar-web/src/main/js/app/components/__tests__/GlobalFooter-test.tsx

@@ -17,46 +17,81 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-import { shallow } from 'enzyme';
 import * as React from 'react';
 import { mockAppState } from '../../../helpers/testMocks';
+import { renderComponent } from '../../../helpers/testReactTestingUtils';
+import { byRole, byText } from '../../../helpers/testSelector';
+import { AppState } from '../../../types/appstate';
 import { EditionKey } from '../../../types/editions';
-import { GlobalFooter, GlobalFooterProps } from '../GlobalFooter';
+import { FCProps } from '../../../types/misc';
+import GlobalFooter from '../GlobalFooter';
 
-it('should render the only logged in information', () => {
-  expect(getWrapper()).toMatchSnapshot();
+it('should render the logged-in information', () => {
+  renderGlobalFooter();
+
+  expect(ui.databaseWarningMessage.query()).not.toBeInTheDocument();
+
+  expect(ui.footerListItems.getAll()).toHaveLength(7);
+
+  expect(byText('Community Edition').get()).toBeInTheDocument();
+  expect(ui.versionLabel('4.2').get()).toBeInTheDocument();
+  expect(ui.apiLink.get()).toBeInTheDocument();
 });
 
-it('should not render the only logged in information', () => {
-  expect(
-    getWrapper({
-      hideLoggedInInfo: true,
-      appState: mockAppState({ version: '6.4-SNAPSHOT' }),
-    })
-  ).toMatchSnapshot();
+it('should not render missing logged-in information', () => {
+  renderGlobalFooter({}, { edition: undefined, version: '' });
+
+  expect(ui.footerListItems.getAll()).toHaveLength(5);
+
+  expect(byText('Community Edition').query()).not.toBeInTheDocument();
+  expect(ui.versionLabel().query()).not.toBeInTheDocument();
 });
 
-it('should show the db warning message', () => {
-  expect(
-    getWrapper({
-      appState: mockAppState({ productionDatabase: false, edition: EditionKey.community }),
-    }).find('Alert')
-  ).toMatchSnapshot();
+it('should not render the logged-in information', () => {
+  renderGlobalFooter({ hideLoggedInInfo: true });
+
+  expect(ui.databaseWarningMessage.query()).not.toBeInTheDocument();
+
+  expect(ui.footerListItems.getAll()).toHaveLength(4);
+
+  expect(byText('Community Edition').query()).not.toBeInTheDocument();
+  expect(ui.versionLabel().query()).not.toBeInTheDocument();
+  expect(ui.apiLink.query()).not.toBeInTheDocument();
 });
 
-it('should display the sq version', () => {
-  expect(
-    getWrapper({
-      appState: mockAppState({ edition: EditionKey.enterprise, version: '6.4-SNAPSHOT' }),
-    })
-  ).toMatchSnapshot();
+it('should show the db warning message', () => {
+  renderGlobalFooter({}, { productionDatabase: false });
+
+  expect(ui.databaseWarningMessage.get()).toBeInTheDocument();
 });
 
-function getWrapper(props?: GlobalFooterProps) {
-  return shallow(
-    <GlobalFooter
-      appState={mockAppState({ productionDatabase: true, edition: EditionKey.community })}
-      {...props}
-    />
-  );
+function renderGlobalFooter(
+  props: Partial<FCProps<typeof GlobalFooter>> = {},
+  appStateOverride: Partial<AppState> = {}
+) {
+  return renderComponent(<GlobalFooter {...props} />, '/', {
+    appState: mockAppState({
+      productionDatabase: true,
+      edition: EditionKey.community,
+      version: '4.2',
+      ...appStateOverride,
+    }),
+  });
 }
+
+const ui = {
+  footerListItems: byRole('listitem'),
+  databaseWarningMessage: byText('footer.production_database_warning'),
+
+  versionLabel: (version?: string) =>
+    version ? byText(`footer.version_x.${version}`) : byText(/footer\.version_x/),
+
+  // links
+  websiteLink: byRole('link', { name: 'SonarQube™' }),
+  companyLink: byRole('link', { name: 'SonarSource SA' }),
+  licenseLink: byRole('link', { name: 'footer.license' }),
+  communityLink: byRole('link', { name: 'footer.community' }),
+  docsLink: byRole('link', { name: 'opens_in_new_window footer.documentation' }),
+  pluginsLink: byRole('link', { name: 'opens_in_new_window footer.plugins' }),
+  apiLink: byRole('link', { name: 'footer.web_api' }),
+};

server/sonar-web/src/main/js/app/components/__tests__/__snapshots__/GlobalFooter-test.tsx.snap

@@ -1,217 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`should display the sq version 1`] = `
-<div
-  className="page-footer page-container"
-  id="footer"
->
-  <GlobalFooterBranding />
-  <ul
-    className="page-footer-menu"
-  >
-    <li
-      className="page-footer-menu-item"
-    >
-      Enterprise Edition
-    </li>
-    <li
-      className="page-footer-menu-item"
-    >
-      footer.version_x.6.4-SNAPSHOT
-    </li>
-    <li
-      className="page-footer-menu-item"
-    >
-      <a
-        href="https://www.gnu.org/licenses/lgpl-3.0.txt"
-        rel="noopener noreferrer"
-        target="_blank"
-      >
-        footer.license
-      </a>
-    </li>
-    <li
-      className="page-footer-menu-item"
-    >
-      <a
-        href="https://community.sonarsource.com/c/help/sq"
-        rel="noopener noreferrer"
-        target="_blank"
-      >
-        footer.community
-      </a>
-    </li>
-    <li
-      className="page-footer-menu-item"
-    >
-      <DocLink
-        to="/"
-      >
-        footer.documentation
-      </DocLink>
-    </li>
-    <li
-      className="page-footer-menu-item"
-    >
-      <DocLink
-        to="/instance-administration/plugin-version-matrix/"
-      >
-        footer.plugins
-      </DocLink>
-    </li>
-    <li
-      className="page-footer-menu-item"
-    >
-      <ForwardRef(Link)
-        to="/web_api"
-      >
-        footer.web_api
-      </ForwardRef(Link)>
-    </li>
-  </ul>
-</div>
-`;
-
-exports[`should not render the only logged in information 1`] = `
-<div
-  className="page-footer page-container"
-  id="footer"
->
-  <GlobalFooterBranding />
-  <ul
-    className="page-footer-menu"
-  >
-    <li
-      className="page-footer-menu-item"
-    >
-      <a
-        href="https://www.gnu.org/licenses/lgpl-3.0.txt"
-        rel="noopener noreferrer"
-        target="_blank"
-      >
-        footer.license
-      </a>
-    </li>
-    <li
-      className="page-footer-menu-item"
-    >
-      <a
-        href="https://community.sonarsource.com/c/help/sq"
-        rel="noopener noreferrer"
-        target="_blank"
-      >
-        footer.community
-      </a>
-    </li>
-    <li
-      className="page-footer-menu-item"
-    >
-      <DocLink
-        to="/"
-      >
-        footer.documentation
-      </DocLink>
-    </li>
-    <li
-      className="page-footer-menu-item"
-    >
-      <DocLink
-        to="/instance-administration/plugin-version-matrix/"
-      >
-        footer.plugins
-      </DocLink>
-    </li>
-  </ul>
-</div>
-`;
-
-exports[`should render the only logged in information 1`] = `
-<div
-  className="page-footer page-container"
-  id="footer"
->
-  <GlobalFooterBranding />
-  <ul
-    className="page-footer-menu"
-  >
-    <li
-      className="page-footer-menu-item"
-    >
-      Community Edition
-    </li>
-    <li
-      className="page-footer-menu-item"
-    >
-      footer.version_x.1.0
-    </li>
-    <li
-      className="page-footer-menu-item"
-    >
-      <a
-        href="https://www.gnu.org/licenses/lgpl-3.0.txt"
-        rel="noopener noreferrer"
-        target="_blank"
-      >
-        footer.license
-      </a>
-    </li>
-    <li
-      className="page-footer-menu-item"
-    >
-      <a
-        href="https://community.sonarsource.com/c/help/sq"
-        rel="noopener noreferrer"
-        target="_blank"
-      >
-        footer.community
-      </a>
-    </li>
-    <li
-      className="page-footer-menu-item"
-    >
-      <DocLink
-        to="/"
-      >
-        footer.documentation
-      </DocLink>
-    </li>
-    <li
-      className="page-footer-menu-item"
-    >
-      <DocLink
-        to="/instance-administration/plugin-version-matrix/"
-      >
-        footer.plugins
-      </DocLink>
-    </li>
-    <li
-      className="page-footer-menu-item"
-    >
-      <ForwardRef(Link)
-        to="/web_api"
-      >
-        footer.web_api
-      </ForwardRef(Link)>
-    </li>
-  </ul>
-</div>
-`;
-
-exports[`should show the db warning message 1`] = `
-<Alert
-  display="inline"
-  id="evaluation_warning"
-  variant="warning"
->
-  <p
-    className="big"
-  >
-    footer.production_database_warning
-  </p>
-  <p>
-    <InstanceMessage
-      message="footer.production_database_explanation"
-    />
-  </p>
-</Alert>
-`;