github.com/thanos-io/thanos@v0.32.5/pkg/ui/react-app/src/thanos/pages/stores/Stores.test.tsx (about)

     1  import React from 'react';
     2  import { mount, ReactWrapper } from 'enzyme';
     3  import { FetchMock } from 'jest-fetch-mock/types';
     4  import { UncontrolledAlert } from 'reactstrap';
     5  import Stores from './Stores';
     6  import StorePoolPanel from './StorePoolPanel';
     7  import { sampleAPIResponse } from './__testdata__/testdata';
     8  import { act } from 'react-dom/test-utils';
     9  
    10  describe('Stores', () => {
    11    beforeEach(() => {
    12      fetchMock.resetMocks();
    13    });
    14  
    15    describe('when data is returned', () => {
    16      let stores: ReactWrapper;
    17      let mock: FetchMock;
    18  
    19      beforeEach(() => {
    20        mock = fetchMock.mockResponse(JSON.stringify(sampleAPIResponse));
    21      });
    22  
    23      it('renders tables', async () => {
    24        await act(async () => {
    25          stores = mount(<Stores />);
    26        });
    27        stores.update();
    28        expect(mock).toHaveBeenCalledWith('/api/v1/stores', { cache: 'no-store', credentials: 'same-origin' });
    29  
    30        const panels = stores.find(StorePoolPanel);
    31        expect(panels).toHaveLength(2);
    32  
    33        const storePools = Object.keys(sampleAPIResponse.data);
    34        storePools.forEach((title) => {
    35          const panel = stores.find(StorePoolPanel).filterWhere((panel) => panel.prop('title') === title);
    36          expect(panel).toHaveLength(1);
    37        });
    38      });
    39    });
    40  
    41    describe('when there is no store registered', () => {
    42      it('displays a warning alert', async () => {
    43        const mock = fetchMock.mockResponse(
    44          JSON.stringify({
    45            status: 'success',
    46            data: [],
    47          })
    48        );
    49  
    50        let stores: any;
    51        await act(async () => {
    52          stores = mount(<Stores />);
    53        });
    54        stores.update();
    55  
    56        expect(mock).toHaveBeenCalledWith('/api/v1/stores', { cache: 'no-store', credentials: 'same-origin' });
    57  
    58        const alert = stores.find(UncontrolledAlert);
    59        expect(alert.prop('color')).toBe('warning');
    60        expect(alert.text()).toContain('No stores registered');
    61      });
    62    });
    63  
    64    describe('when an error is returned', () => {
    65      it('displays an error alert', async () => {
    66        const mock = fetchMock.mockReject(new Error('Error fetching stores'));
    67  
    68        let stores: any;
    69        await act(async () => {
    70          stores = mount(<Stores />);
    71        });
    72        stores.update();
    73  
    74        expect(mock).toHaveBeenCalledWith('/api/v1/stores', { cache: 'no-store', credentials: 'same-origin' });
    75  
    76        const alert = stores.find(UncontrolledAlert);
    77        expect(alert.prop('color')).toBe('danger');
    78        expect(alert.text()).toContain('Error fetching stores');
    79      });
    80    });
    81  });