go.chromium.org/luci@v0.0.0-20240309015107-7cdc2e660f33/milo/ui/src/common/layouts/base_layout.test.tsx (about)

     1  // Copyright 2023 The LUCI Authors.
     2  //
     3  // Licensed under the Apache License, Version 2.0 (the "License");
     4  // you may not use this file except in compliance with the License.
     5  // You may obtain a copy of the License at
     6  //
     7  //      http://www.apache.org/licenses/LICENSE-2.0
     8  //
     9  // Unless required by applicable law or agreed to in writing, software
    10  // distributed under the License is distributed on an "AS IS" BASIS,
    11  // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
    12  // See the License for the specific language governing permissions and
    13  // limitations under the License.
    14  
    15  import { render, screen } from '@testing-library/react';
    16  import { destroy } from 'mobx-state-tree';
    17  
    18  import { UiPage } from '@/common/constants/view';
    19  import { Store, StoreInstance, StoreProvider } from '@/common/store';
    20  import { FakeContextProvider } from '@/testing_tools/fakes/fake_context_provider';
    21  
    22  import { SIDE_BAR_OPEN_CACHE_KEY } from './base_layout';
    23  import { BaseLayout } from './base_layout';
    24  import { PAGE_LABEL_MAP } from './constants';
    25  
    26  describe('BaseLayout', () => {
    27    const storageList = new Map<string, string>();
    28    let store: StoreInstance;
    29  
    30    beforeEach(() => {
    31      jest
    32        .spyOn(Storage.prototype, 'setItem')
    33        .mockImplementation((key: string, val: string) => {
    34          storageList.set(key, val);
    35        });
    36      jest
    37        .spyOn(Storage.prototype, 'getItem')
    38        .mockImplementation((key: string) => {
    39          return storageList.get(key) ?? null;
    40        });
    41      store = Store.create({});
    42    });
    43  
    44    afterEach(() => {
    45      jest.restoreAllMocks();
    46      storageList.clear();
    47      destroy(store);
    48    });
    49  
    50    it('should display sidebar if no value is stored', async () => {
    51      render(
    52        <StoreProvider value={store}>
    53          <FakeContextProvider>
    54            <BaseLayout />
    55          </FakeContextProvider>
    56        </StoreProvider>,
    57      );
    58  
    59      await screen.findByText('LUCI');
    60  
    61      expect(
    62        screen.getByText(PAGE_LABEL_MAP[UiPage.BuilderSearch]),
    63      ).toBeVisible();
    64    });
    65  
    66    it('should hide sidebar if the local storage value is false', async () => {
    67      storageList.set(SIDE_BAR_OPEN_CACHE_KEY, 'false');
    68      render(
    69        <StoreProvider value={store}>
    70          <FakeContextProvider>
    71            <BaseLayout />
    72          </FakeContextProvider>
    73        </StoreProvider>,
    74      );
    75  
    76      await screen.findByText('LUCI');
    77  
    78      expect(
    79        screen.getByText(PAGE_LABEL_MAP[UiPage.BuilderSearch]),
    80      ).not.toBeVisible();
    81    });
    82  });