github.com/freiheit-com/kuberpult@v1.24.2-0.20240328135542-315d5630abe6/services/frontend-service/src/ui/components/dropdown/dropdown.test.tsx (about)

     1  /*This file is part of kuberpult.
     2  
     3  Kuberpult is free software: you can redistribute it and/or modify
     4  it under the terms of the Expat(MIT) License as published by
     5  the Free Software Foundation.
     6  
     7  Kuberpult is distributed in the hope that it will be useful,
     8  but WITHOUT ANY WARRANTY; without even the implied warranty of
     9  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    10  MIT License for more details.
    11  
    12  You should have received a copy of the MIT License
    13  along with kuberpult. If not, see <https://directory.fsf.org/wiki/License:Expat>.
    14  
    15  Copyright 2023 freiheit.com*/
    16  import { DropdownSelect, DropdownSelectProps } from './dropdown';
    17  import { getByTestId, render } from '@testing-library/react';
    18  import { MemoryRouter } from 'react-router-dom';
    19  
    20  const getNode = (overrides?: {}): JSX.Element | any => {
    21      const defaultProps: any = {
    22          children: null,
    23      };
    24      // given
    25      return (
    26          <div>
    27              <MemoryRouter>
    28                  <DropdownSelect {...defaultProps} {...overrides} />
    29              </MemoryRouter>
    30          </div>
    31      );
    32  };
    33  
    34  const getWrapper = (overrides?: DropdownSelectProps, entries?: string[]) => render(getNode(overrides));
    35  
    36  describe('Dropdown label', () => {
    37      interface dataT {
    38          name: string;
    39          selectedTeams: string[];
    40          expectedLabel: string;
    41      }
    42  
    43      const data: dataT[] = [
    44          {
    45              name: 'Get label when no teams are selected',
    46              selectedTeams: [],
    47              expectedLabel: 'Filter Teams',
    48          },
    49          {
    50              name: 'Get label when a team is selected',
    51              selectedTeams: ['foo', 'bar'],
    52              expectedLabel: 'foo, bar',
    53          },
    54      ];
    55  
    56      describe.each(data)(`Renders a navigation item with selected`, (testcase) => {
    57          it(testcase.name, () => {
    58              // given
    59              // when
    60              const { container } = getWrapper({
    61                  isEmpty: (arr: string[] | undefined) => (arr ? arr.filter((val) => val !== '').length === 0 : true),
    62                  handleChange: (event: any) => {},
    63                  allTeams: ['Test', 'foo', 'bar'],
    64                  selectedTeams: testcase.selectedTeams,
    65              });
    66              // then
    67              expect(getByTestId(container, 'teams-dropdown-input')).toHaveAttribute('value', testcase.expectedLabel);
    68          });
    69      });
    70  });
    71  
    72  describe('Dropdown dropdown text with selected teams', () => {
    73      interface dataT {
    74          name: string;
    75          selectedTeams: string[];
    76          expectedTeamsText: string;
    77      }
    78  
    79      const data: dataT[] = [
    80          {
    81              name: 'Get value after selecting a team',
    82              selectedTeams: ['example'],
    83              expectedTeamsText: 'example',
    84          },
    85          {
    86              name: 'Get value after selecting multiple teams',
    87              selectedTeams: ['example', 'bar'],
    88              expectedTeamsText: 'example, bar',
    89          },
    90      ];
    91  
    92      describe.each(data)(`Renders a navigation item with selected`, (testcase) => {
    93          it(testcase.name, () => {
    94              // given
    95              const { selectedTeams } = testcase;
    96              // when
    97              const { container } = getWrapper({
    98                  isEmpty: (arr: string[] | undefined) => (arr ? arr.filter((val) => val !== '').length === 0 : true),
    99                  handleChange: (event: any) => {},
   100                  allTeams: ['example', 'bar'],
   101                  selectedTeams,
   102              });
   103              // then
   104              expect(getByTestId(container, 'teams-dropdown-input')).toHaveAttribute('value', testcase.expectedTeamsText);
   105          });
   106      });
   107  });