TrackPanelTabs.test.tsx 3.31 KB
Newer Older
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16
/**
 * See the NOTICE file distributed with this work for additional information
 * regarding copyright ownership.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

17
import React from 'react';
18 19
import { render } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
20

21
import { TrackPanelTabs, TrackPanelTabsProps } from './TrackPanelTabs';
22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42

import { TrackSet } from '../trackPanelConfig';
import { createEnsObject } from 'tests/fixtures/ens-object';

describe('<TrackPanelTabs />', () => {
  afterEach(() => {
    jest.resetAllMocks();
  });

  const defaultProps: TrackPanelTabsProps = {
    closeDrawer: jest.fn(),
    ensObject: createEnsObject(),
    isDrawerOpened: true,
    selectTrackPanelTab: jest.fn(),
    selectedTrackPanelTab: TrackSet.GENOMIC,
    toggleTrackPanel: jest.fn(),
    isTrackPanelModalOpened: false,
    isTrackPanelOpened: false
  };

  describe('rendering', () => {
43 44 45 46
    it('contains all track panel tabs', () => {
      const { container } = render(<TrackPanelTabs {...defaultProps} />);
      const tabValues = Object.values(TrackSet);
      const tabs = [...container.querySelectorAll('.trackPanelTab')];
47

48
      tabValues.forEach((text) => {
49
        expect(tabs.some((tab) => tab.innerHTML === text)).toBeTruthy();
50 51 52 53 54 55
      });
    });
  });

  describe('behaviour', () => {
    describe('on track panel tab click', () => {
56 57 58
      it('selects track panel tab', () => {
        const { container } = render(<TrackPanelTabs {...defaultProps} />);
        const tab = container.querySelector('.trackPanelTab') as HTMLElement;
59

60 61 62
        userEvent.click(tab);
        expect(defaultProps.selectTrackPanelTab).toHaveBeenCalledWith(
          Object.values(TrackSet)[0]
63 64 65
        );
      });

66 67 68 69 70 71 72 73
      it('opens track panel if it is closed', () => {
        const { container, rerender } = render(
          <TrackPanelTabs {...defaultProps} isTrackPanelOpened={true} />
        );
        const tab = container.querySelector('.trackPanelTab') as HTMLElement;

        userEvent.click(tab);
        expect(defaultProps.toggleTrackPanel).not.toHaveBeenCalled();
74

75 76 77 78 79
        rerender(
          <TrackPanelTabs {...defaultProps} isTrackPanelOpened={false} />
        );
        userEvent.click(tab);
        expect(defaultProps.toggleTrackPanel).toHaveBeenCalledWith(true);
80 81
      });

82 83 84 85 86 87 88 89 90 91 92 93
      it('closes drawer if it is opened', () => {
        const { container, rerender } = render(
          <TrackPanelTabs {...defaultProps} isDrawerOpened={false} />
        );
        const tab = container.querySelector('.trackPanelTab') as HTMLElement;

        userEvent.click(tab);
        expect(defaultProps.closeDrawer).not.toHaveBeenCalled();

        rerender(<TrackPanelTabs {...defaultProps} isDrawerOpened={true} />);
        userEvent.click(tab);
        expect(defaultProps.closeDrawer).toHaveBeenCalledTimes(1);
94 95 96 97
      });
    });
  });
});