UI tests for when package in installed and uninstalled + refacror

x-pack/plugins/fleet/public/applications/fleet/sections/epm/screens/detail/index.test.tsx

@@ -14,6 +14,7 @@ import {
   GetFleetStatusResponse,
   GetInfoResponse,
   GetPackagePoliciesResponse,
+  GetSummaryResponse,
 } from '../../../../../../../common/types/rest_spec';
 import { DetailViewPanelName, KibanaAssetType } from '../../../../../../../common/types/models';
 import {
@@ -29,7 +30,7 @@ describe('when on integration detail', () => {
   const detailPageUrlPath = pagePathGetters.integration_details({ pkgkey });
   let testRenderer: TestRenderer;
   let renderResult: ReturnType<typeof testRenderer.render>;
-  let mockedApi: MockedApi;
+  let mockedApi: MockedApi<EpmPackageDetailsResponseProvidersMock>;
   const render = () =>
     (renderResult = testRenderer.render(
       <Route path={PAGE_ROUTING_PATHS.integration_details}>
@@ -48,6 +49,39 @@ describe('when on integration detail', () => {
     window.location.hash = '#/';
   });
 
+  describe('and the package is installed', () => {
+    beforeEach(() => render());
+
+    it('should display agent policy usage count', async () => {
+      await mockedApi.waitForApi();
+      expect(renderResult.queryByTestId('agentPolicyCount')).not.toBeNull();
+    });
+
+    it('should the Policies tab', async () => {
+      await mockedApi.waitForApi();
+      expect(renderResult.queryByTestId('tab-policies')).not.toBeNull();
+    });
+  });
+
+  describe('and the package is not installed', () => {
+    beforeEach(() => {
+      const unInstalledPackage = mockedApi.responseProvider.epmGetInfo();
+      unInstalledPackage.response.status = 'not_installed';
+      mockedApi.responseProvider.epmGetInfo.mockReturnValue(unInstalledPackage);
+      render();
+    });
+
+    it('should NOT display agent policy usage count', async () => {
+      await mockedApi.waitForApi();
+      expect(renderResult.queryByTestId('agentPolicyCount')).toBeNull();
+    });
+
+    it('should NOT the Policies tab', async () => {
+      await mockedApi.waitForApi();
+      expect(renderResult.queryByTestId('tab-policies')).toBeNull();
+    });
+  });
+
   describe('and a custom UI extension is NOT registered', () => {
     beforeEach(() => render());
 
@@ -190,12 +224,27 @@ describe('when on integration detail', () => {
   });
 });
 
-interface MockedApi {
+interface MockedApi<
+  R extends Record<string, jest.MockedFunction<any>> = Record<string, jest.MockedFunction<any>>
+> {
   /** Will return a promise that resolves when triggered APIs are complete */
   waitForApi: () => Promise<void>;
+  /** A object containing the list of API response provider functions that are used by the mocked API */
+  responseProvider: R;
 }
 
-const mockApiCalls = (http: MockedFleetStartServices['http']): MockedApi => {
+interface EpmPackageDetailsResponseProvidersMock {
+  epmGetInfo: jest.MockedFunction<() => GetInfoResponse>;
+  epmGetFile: jest.MockedFunction<() => string>;
+  epmGetSummary: jest.MockedFunction<() => GetSummaryResponse>;
+  fleetSetup: jest.MockedFunction<() => GetFleetStatusResponse>;
+  packagePolicyList: jest.MockedFunction<() => GetPackagePoliciesResponse>;
+  agentPolicyList: jest.MockedFunction<() => GetAgentPoliciesResponse>;
+}
+
+const mockApiCalls = (
+  http: MockedFleetStartServices['http']
+): MockedApi<EpmPackageDetailsResponseProvidersMock> => {
   let inflightApiCalls = 0;
   const apiDoneListeners: Array<() => void> = [];
   const markApiCallAsHandled = async () => {
@@ -663,31 +712,62 @@ On Windows, the module was tested with Nginx installed from the Chocolatey repos
     perPage: 100,
   };
 
+  const epmGetSummaryResponse: GetSummaryResponse = {
+    response: {
+      agent_policy_count: 2,
+    },
+  };
+
+  const mockedApiInterface: MockedApi<EpmPackageDetailsResponseProvidersMock> = {
+    waitForApi() {
+      return new Promise((resolve) => {
+        if (inflightApiCalls > 0) {
+          apiDoneListeners.push(resolve);
+        } else {
+          resolve();
+        }
+      });
+    },
+    responseProvider: {
+      epmGetInfo: jest.fn().mockReturnValue(epmPackageResponse),
+      epmGetFile: jest.fn().mockReturnValue(packageReadMe),
+      epmGetSummary: jest.fn().mockReturnValue(epmGetSummaryResponse),
+      fleetSetup: jest.fn().mockReturnValue(agentsSetupResponse),
+      packagePolicyList: jest.fn().mockReturnValue(packagePoliciesResponse),
+      agentPolicyList: jest.fn().mockReturnValue(agentPoliciesResponse),
+    },
+  };
+
   http.get.mockImplementation(async (path) => {
     if (typeof path === 'string') {
       if (path === epmRouteService.getInfoPath(`nginx-0.3.7`)) {
         markApiCallAsHandled();
-        return epmPackageResponse;
+        return mockedApiInterface.responseProvider.epmGetInfo();
       }
 
       if (path === epmRouteService.getFilePath('/package/nginx/0.3.7/docs/README.md')) {
         markApiCallAsHandled();
-        return packageReadMe;
+        return mockedApiInterface.responseProvider.epmGetFile();
       }
 
       if (path === fleetSetupRouteService.getFleetSetupPath()) {
         markApiCallAsHandled();
-        return agentsSetupResponse;
+        return mockedApiInterface.responseProvider.fleetSetup();
       }
 
       if (path === packagePolicyRouteService.getListPath()) {
         markApiCallAsHandled();
-        return packagePoliciesResponse;
+        return mockedApiInterface.responseProvider.packagePolicyList();
       }
 
       if (path === agentPolicyRouteService.getListPath()) {
         markApiCallAsHandled();
-        return agentPoliciesResponse;
+        return mockedApiInterface.responseProvider.agentPolicyList();
+      }
+
+      if (path === epmRouteService.getSummaryPath('nginx')) {
+        markApiCallAsHandled();
+        return mockedApiInterface.responseProvider.epmGetSummary();
       }
 
       const err = new Error(`API [GET ${path}] is not MOCKED!`);
@@ -697,15 +777,5 @@ On Windows, the module was tested with Nginx installed from the Chocolatey repos
     }
   });
 
-  return {
-    waitForApi() {
-      return new Promise((resolve) => {
-        if (inflightApiCalls > 0) {
-          apiDoneListeners.push(resolve);
-        } else {
-          resolve();
-        }
-      });
-    },
-  };
+  return mockedApiInterface;
 };

x-pack/plugins/fleet/public/applications/fleet/sections/epm/screens/detail/index.tsx

@@ -247,6 +247,7 @@ export function Detail() {
                       label: i18n.translate('xpack.fleet.epm.usedByLabel', {
                         defaultMessage: 'Agent Policies',
                       }),
+                      'data-test-subj': 'agentPolicyCount',
                       content: <IntegrationAgentPolicyCount packageName={packageInfo.name} />,
                     },
                   ]
@@ -276,7 +277,7 @@ export function Detail() {
                 ),
               },
             ].map((item, index) => (
-              <EuiFlexItem grow={false} key={index}>
+              <EuiFlexItem grow={false} key={index} data-test-subj={item['data-test-subj']}>
                 {item.isDivider ?? false ? (
                   <Divider />
                 ) : item.label ? (