1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-12 04:37:13 +01:00
metamask-extension/ui/components/app/sidebars/sidebar.component.test.js
2021-06-06 12:45:27 -02:30

109 lines
3.2 KiB
JavaScript

import React from 'react';
import { shallow } from 'enzyme';
import sinon from 'sinon';
import ReactCSSTransitionGroup from 'react-transition-group/CSSTransitionGroup';
import CustomizeGas from '../gas-customization/gas-modal-page-container';
import Sidebar from './sidebar.component';
const propsMethodSpies = {
hideSidebar: sinon.spy(),
};
describe('Sidebar Component', () => {
let wrapper;
beforeEach(() => {
wrapper = shallow(
<Sidebar
sidebarOpen={false}
hideSidebar={propsMethodSpies.hideSidebar}
transitionName="someTransition"
type="customize-gas"
/>,
);
});
afterEach(() => {
propsMethodSpies.hideSidebar.resetHistory();
});
describe('renderOverlay', () => {
let renderOverlay;
beforeEach(() => {
renderOverlay = shallow(wrapper.instance().renderOverlay());
});
it('should render a overlay element', () => {
expect(renderOverlay.hasClass('sidebar-overlay')).toStrictEqual(true);
});
it('should pass the correct onClick function to the element', () => {
expect(propsMethodSpies.hideSidebar.callCount).toStrictEqual(0);
renderOverlay.props().onClick();
expect(propsMethodSpies.hideSidebar.callCount).toStrictEqual(1);
});
});
describe('renderSidebarContent', () => {
let renderSidebarContent;
beforeEach(() => {
renderSidebarContent = wrapper.instance().renderSidebarContent();
});
it('should render sidebar content with the type customize-gas', () => {
renderSidebarContent = wrapper.instance().renderSidebarContent();
const renderedSidebarContent = shallow(renderSidebarContent);
expect(renderedSidebarContent.hasClass('sidebar-left')).toStrictEqual(
true,
);
expect(renderedSidebarContent.childAt(0).is(CustomizeGas)).toStrictEqual(
true,
);
});
it('should not render with an unrecognized type', () => {
wrapper.setProps({ type: 'foobar' });
renderSidebarContent = wrapper.instance().renderSidebarContent();
expect(renderSidebarContent).toBeNull();
});
});
describe('render', () => {
it('should render a div with one child', () => {
expect(wrapper.is('div')).toStrictEqual(true);
expect(wrapper.children()).toHaveLength(1);
});
it('should render the ReactCSSTransitionGroup without any children', () => {
expect(
wrapper.children().at(0).is(ReactCSSTransitionGroup),
).toStrictEqual(true);
expect(wrapper.children().at(0).children()).toHaveLength(0);
});
it('should render sidebar content and the overlay if sidebarOpen is true', () => {
wrapper.setProps({ sidebarOpen: true });
expect(wrapper.children()).toHaveLength(2);
expect(
wrapper.children().at(1).hasClass('sidebar-overlay'),
).toStrictEqual(true);
expect(wrapper.children().at(0).children()).toHaveLength(1);
expect(
wrapper.children().at(0).children().at(0).hasClass('sidebar-left'),
).toStrictEqual(true);
expect(
wrapper
.children()
.at(0)
.children()
.at(0)
.children()
.at(0)
.is(CustomizeGas),
).toBe(true);
});
});
});