Add tests

fixes elastic/security-team/issues/4724

x-pack/plugins/security_solution/public/management/components/endpoint_response_actions_list/components/actions_log_users_filter.test.tsx

@@ -0,0 +1,87 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import React from 'react';
+import * as reactTestingLibrary from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import {
+  createAppRootMockRenderer,
+  type AppContextTestRender,
+} from '../../../../common/mock/endpoint';
+import { ActionsLogUsersFilter } from './actions_log_users_filter';
+import { MANAGEMENT_PATH } from '../../../../../common/constants';
+
+describe('Users filter', () => {
+  let render: (
+    props?: React.ComponentProps<typeof ActionsLogUsersFilter>
+  ) => ReturnType<AppContextTestRender['render']>;
+  let renderResult: ReturnType<typeof render>;
+  let history: AppContextTestRender['history'];
+  let mockedContext: AppContextTestRender;
+
+  const testPrefix = 'response-actions-list-users-filter';
+  let onChangeUsersFilter: jest.Mock;
+
+  beforeEach(async () => {
+    onChangeUsersFilter = jest.fn();
+    mockedContext = createAppRootMockRenderer();
+    ({ history } = mockedContext);
+    render = (props?: React.ComponentProps<typeof ActionsLogUsersFilter>) =>
+      (renderResult = mockedContext.render(
+        <ActionsLogUsersFilter {...{ isFlyout: false, onChangeUsersFilter }} />
+      ));
+    reactTestingLibrary.act(() => {
+      history.push(`${MANAGEMENT_PATH}/response_actions`);
+    });
+  });
+
+  it('should show a search input for users', () => {
+    render();
+
+    const searchInput = renderResult.getByTestId(`${testPrefix}-search`);
+    expect(searchInput).toBeTruthy();
+    expect(searchInput.getAttribute('placeholder')).toEqual(
+      'Filter by user or comma separated list of users'
+    );
+  });
+
+  it('should search on given search string on enter', () => {
+    render();
+
+    const searchInput = renderResult.getByTestId(`${testPrefix}-search`);
+    userEvent.type(searchInput, 'usernameX');
+    userEvent.type(searchInput, '{enter}');
+    expect(onChangeUsersFilter).toHaveBeenCalledWith(['usernameX']);
+  });
+
+  it('should search comma separated strings as multiple users', () => {
+    render();
+
+    const searchInput = renderResult.getByTestId(`${testPrefix}-search`);
+    userEvent.type(searchInput, 'usernameX,usernameY,usernameZ');
+    userEvent.type(searchInput, '{enter}');
+    expect(onChangeUsersFilter).toHaveBeenCalledWith(['usernameX', 'usernameY', 'usernameZ']);
+  });
+
+  it('should ignore white spaces in a given username when updating the API params', () => {
+    render();
+
+    const searchInput = renderResult.getByTestId(`${testPrefix}-search`);
+    userEvent.type(searchInput, '   usernameX   ');
+    userEvent.type(searchInput, '{enter}');
+    expect(onChangeUsersFilter).toHaveBeenCalledWith(['usernameX']);
+  });
+
+  it('should ignore white spaces in comma separated usernames when updating the API params', () => {
+    render();
+
+    const searchInput = renderResult.getByTestId(`${testPrefix}-search`);
+    userEvent.type(searchInput, '   , usernameX ,usernameY    ,       ');
+    userEvent.type(searchInput, '{enter}');
+    expect(onChangeUsersFilter).toHaveBeenCalledWith(['usernameX', 'usernameY']);
+  });
+});

x-pack/plugins/security_solution/public/management/components/endpoint_response_actions_list/components/actions_log_users_filter.tsx

@@ -63,7 +63,7 @@ export const ActionsLogUsersFilter = memo(
     return (
       <EuiFormControlLayout clear={{ onClick: onClear }} fullWidth>
         <EuiFieldSearch
-          data-test-subj={getTestId('users-filter-input')}
+          data-test-subj={getTestId('users-filter-search')}
           isClearable
           fullWidth
           placeholder={FILTER_NAMES.users}

x-pack/plugins/security_solution/public/management/pages/response_actions/view/response_actions_list_page.test.tsx

@@ -263,7 +263,18 @@ describe('Action history page', () => {
       expect(history.location.search).toEqual('?statuses=pending,failed');
     });
 
-    // TODO: add tests for users when that filter is added
+    it('should set selected users search input strings to URL params ', () => {
+      const filterPrefix = 'users-filter';
+      reactTestingLibrary.act(() => {
+        history.push('/administration/action_history?users=userX,userY');
+      });
+
+      render();
+      const { getByTestId } = renderResult;
+      const usersInput = getByTestId(`${testPrefix}-${filterPrefix}-search`);
+      expect(usersInput).toHaveValue('userX,userY');
+      expect(history.location.search).toEqual('?users=userX,userY');
+    });
 
     it('should read and set relative date ranges filter values from URL params', () => {
       reactTestingLibrary.act(() => {
@@ -371,7 +382,16 @@ describe('Action history page', () => {
       expect(history.location.search).toEqual('?statuses=failed%2Cpending%2Csuccessful');
     });
 
-    // TODO: add tests for users when that filter is added
+    it('should set selected users search input strings to URL params ', () => {
+      const filterPrefix = 'users-filter';
+      render();
+      const { getByTestId } = renderResult;
+      const usersInput = getByTestId(`${testPrefix}-${filterPrefix}-search`);
+      userEvent.type(usersInput, '   , userX , userY, ,');
+      userEvent.type(usersInput, '{enter}');
+
+      expect(history.location.search).toEqual('?users=userX%2CuserY');
+    });
 
     it('should set selected relative date range filter options to URL params ', async () => {
       const { getByTestId } = render();