github.com/freiheit-com/kuberpult@v1.24.2-0.20240328135542-315d5630abe6/services/frontend-service/src/ui/Pages/Environments/EnvironmentsPage.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 { render } from '@testing-library/react';
    17  import { UpdateOverview } from '../../utils/store';
    18  import { Environment, EnvironmentGroup, Priority } from '../../../api/api';
    19  import React from 'react';
    20  import { EnvironmentsPage } from './EnvironmentsPage';
    21  import { fakeLoadEverything } from '../../../setupTests';
    22  import { MemoryRouter } from 'react-router-dom';
    23  
    24  const sampleEnvsA: Environment[] = [
    25      {
    26          name: 'foo',
    27          locks: {},
    28          applications: {},
    29          distanceToUpstream: 0,
    30          priority: Priority.YOLO,
    31      },
    32      {
    33          name: 'moreTest',
    34          locks: {},
    35          applications: {},
    36          distanceToUpstream: 0,
    37          priority: Priority.YOLO,
    38      },
    39  ];
    40  
    41  const sampleEnvsB: Environment[] = [
    42      {
    43          name: 'fooB',
    44          locks: {},
    45          applications: {},
    46          distanceToUpstream: 0,
    47          priority: Priority.YOLO,
    48      },
    49      {
    50          name: 'moreTestB',
    51          locks: {},
    52          applications: {},
    53          distanceToUpstream: 0,
    54          priority: Priority.YOLO,
    55      },
    56  ];
    57  
    58  describe('Environment Lane', () => {
    59      const getNode = () => (
    60          <MemoryRouter>
    61              <EnvironmentsPage />
    62          </MemoryRouter>
    63      );
    64      const getWrapper = () => render(getNode());
    65  
    66      interface dataT {
    67          name: string;
    68          environmentGroups: EnvironmentGroup[];
    69          loaded: boolean;
    70          expected: number;
    71          expectedEnvHeaderWrapper: number;
    72          expectedMainContent: number;
    73          spinnerExpected: number;
    74          expectedCardStyles: { className: string; count: number }[];
    75      }
    76      const cases: dataT[] = [
    77          {
    78              name: '1 group 1 env',
    79              environmentGroups: [
    80                  {
    81                      environments: [sampleEnvsA[0]],
    82                      distanceToUpstream: 0,
    83                      environmentGroupName: 'g1',
    84                      priority: Priority.YOLO,
    85                  },
    86              ],
    87              loaded: true,
    88              expected: 1,
    89              expectedEnvHeaderWrapper: 1,
    90              expectedMainContent: 1,
    91              spinnerExpected: 0,
    92              expectedCardStyles: [
    93                  {
    94                      className: 'environment-priority-yolo',
    95                      count: 1,
    96                  },
    97              ],
    98          },
    99          {
   100              name: '2 group 1 env each',
   101              environmentGroups: [
   102                  {
   103                      environments: [sampleEnvsA[0]],
   104                      distanceToUpstream: 0,
   105                      environmentGroupName: 'g1',
   106                      priority: Priority.YOLO,
   107                  },
   108                  {
   109                      environments: [sampleEnvsB[0]],
   110                      distanceToUpstream: 0,
   111                      environmentGroupName: 'g1',
   112                      priority: Priority.YOLO,
   113                  },
   114              ],
   115              loaded: true,
   116              expected: 1,
   117              expectedEnvHeaderWrapper: 2,
   118              expectedMainContent: 1,
   119              spinnerExpected: 0,
   120              expectedCardStyles: [
   121                  {
   122                      className: 'environment-priority-yolo',
   123                      count: 2,
   124                  },
   125              ],
   126          },
   127          {
   128              name: '1 group 2 env',
   129              environmentGroups: [
   130                  {
   131                      environments: sampleEnvsA,
   132                      distanceToUpstream: 0,
   133                      environmentGroupName: 'g1',
   134                      priority: Priority.YOLO,
   135                  },
   136              ],
   137              loaded: true,
   138              expected: 1,
   139              expectedEnvHeaderWrapper: 2,
   140              expectedMainContent: 1,
   141              spinnerExpected: 0,
   142              expectedCardStyles: [
   143                  {
   144                      className: 'environment-priority-yolo',
   145                      count: 3,
   146                  },
   147              ],
   148          },
   149          {
   150              name: 'card colors are decided by group priority not environment priority',
   151              environmentGroups: [
   152                  {
   153                      environments: sampleEnvsA,
   154                      distanceToUpstream: 0,
   155                      environmentGroupName: 'g1',
   156                      priority: Priority.UPSTREAM,
   157                  },
   158              ],
   159              loaded: true,
   160              expected: 1,
   161              expectedEnvHeaderWrapper: 2,
   162              expectedMainContent: 1,
   163              spinnerExpected: 0,
   164              expectedCardStyles: [
   165                  {
   166                      className: 'environment-priority-yolo',
   167                      count: 0,
   168                  },
   169                  {
   170                      className: 'environment-priority-upstream',
   171                      count: 3,
   172                  },
   173              ],
   174          },
   175          {
   176              name: 'just the spinner',
   177              environmentGroups: [],
   178              loaded: false,
   179              expected: 0,
   180              expectedEnvHeaderWrapper: 0,
   181              expectedMainContent: 0,
   182              spinnerExpected: 1,
   183              expectedCardStyles: [],
   184          },
   185      ];
   186      describe.each(cases)('Renders a row of environments', (testcase) => {
   187          it(testcase.name, () => {
   188              //given
   189              UpdateOverview.set({
   190                  environmentGroups: testcase.environmentGroups,
   191              });
   192              fakeLoadEverything(testcase.loaded);
   193              // when
   194              const { container } = getWrapper();
   195              // then
   196              expect(container.getElementsByClassName('spinner')).toHaveLength(testcase.spinnerExpected);
   197              expect(container.getElementsByClassName('environment-group-lane')).toHaveLength(testcase.expected);
   198              expect(container.getElementsByClassName('main-content')).toHaveLength(testcase.expectedMainContent);
   199              expect(container.getElementsByClassName('environment-lane__header')).toHaveLength(
   200                  testcase.expectedEnvHeaderWrapper
   201              );
   202              for (const expectedCardStyle of testcase.expectedCardStyles) {
   203                  expect(container.getElementsByClassName(expectedCardStyle.className)).toHaveLength(
   204                      expectedCardStyle.count
   205                  );
   206              }
   207          });
   208      });
   209  });