tests: more coverage and clicks

Author: xidedix

tests/AsideToggler.test.js

@@ -2,11 +2,33 @@ import expect from 'expect'
 import React from 'react'
 import {renderToStaticMarkup as render} from 'react-dom/server'
 
+import { configure, mount } from 'enzyme'
+import Adapter from 'enzyme-adapter-react-16'
+import sinon from 'sinon';
+
 import AppAsideToggler from 'src/AsideToggler'
 
+configure({ adapter: new Adapter() });
+
 describe('AppAsideToggler', () => {
   it('renders button with class="navbar-toggler"', () => {
     expect(render(<AppAsideToggler />))
     .toContain('<button type="button" class="navbar-toggler"><span class="navbar-toggler-icon"></span></button>')
   })
-})
+  it('should call asideToggle', () => {
+    let component = mount(<AppAsideToggler />);
+    const instance = component.instance();
+    const handleClickSpy = sinon.spy(instance, 'asideToggle');
+    component.find('button').simulate('click');
+
+    expect(handleClickSpy.called).toBe(true);
+  })
+  it('should call asideToggle mobile', () => {
+    let component = mount(<AppAsideToggler mobile/>);
+    const instance = component.instance();
+    const handleClickSpy = sinon.spy(instance, 'asideToggle');
+    component.find('button').simulate('click');
+
+    expect(handleClickSpy.called).toBe(true);
+  })
+})

tests/HeaderDropdown.test.js

@@ -2,11 +2,25 @@ import expect from 'expect'
 import React from 'react'
 import {renderToStaticMarkup as render} from 'react-dom/server'
 
+import { configure, mount } from 'enzyme'
+import Adapter from 'enzyme-adapter-react-16'
+
 import AppHeaderDropdown from 'src/HeaderDropdown'
+import sinon from 'sinon';
+
+configure({ adapter: new Adapter() });
 
 describe('AppHeaderDropdown', () => {
   it('renders li with class="dropdown nav-item"', () => {
-    expect(render(<AppHeaderDropdown />))
-    .toContain('<li class="dropdown nav-item"></li>')
+    expect(render(<AppHeaderDropdown />)).toContain('<li class="dropdown nav-item"></li>')
+  })
+  it('dropdownOpen changed on toggle', () => {
+
+    let component = mount(<AppHeaderDropdown />);
+    const instance = component.instance();
+
+    expect(instance.state.dropdownOpen).toBe(false);
+    instance.toggle();
+    expect(instance.state.dropdownOpen).toBe(true);
   })
-})
+})

tests/NavbarBrand.test.js

@@ -10,8 +10,9 @@ import AppNavbarBrand from 'src/NavbarBrand';
 describe('AppNavbarBrand', () => {
   it('renders anchor with class="navbar-brand"', () => {
     expect(render(<AppNavbarBrand
-      full={{ src: logo, width: 89, height: 25, alt: 'CoreUI Logo' }}
-      minimized={{ src: sygnet, width: 30, height: 30, alt: 'CoreUI Logo' }}
+      brand={{ src: logo, width: 89, height: 25, alt: 'CoreUI Brand' }}
+      full={{ src: logo, width: 89, height: 25, alt: 'CoreUI Full' }}
+      minimized={{ src: sygnet, width: 30, height: 30, alt: 'CoreUI Minimized' }}
     />)).toContain('class="navbar-brand"');
   });
-});
+});

tests/Sidebar.test.js

@@ -18,7 +18,7 @@ describe('AppSidebar', () => {
   it('calls componentDidMount', () => {
     spy(AppSidebar.prototype, 'componentDidMount');
 
-    const wrapper = mount(<AppSidebar fixed display="lg" />);
-    expect(AppSidebar.prototype.componentDidMount.calledOnce).toEqual(true);
+    const wrapper = mount(<AppSidebar fixed display="lg" compact minimized offCanvas />);
+    expect(AppSidebar.prototype.componentDidMount.calledOnce).toBe(true);
   });
-})
+})

tests/SidebarMinimizer.test.js

@@ -2,11 +2,25 @@ import expect from 'expect'
 import React from 'react'
 import {renderToStaticMarkup as render} from 'react-dom/server'
 
+import { configure, mount } from 'enzyme'
+import Adapter from 'enzyme-adapter-react-16'
+import sinon from 'sinon';
+
 import AppSidebarMinimizer from 'src/SidebarMinimizer'
 
+configure({ adapter: new Adapter() });
+
 describe('AppSidebarMinimizer', () => {
   it('renders button with class="sidebar-minimizer"', () => {
     expect(render(<AppSidebarMinimizer></AppSidebarMinimizer>))
     .toContain('<button class="sidebar-minimizer mt-auto" type="button"></button>')
   })
-})
+  it('should call handleClick', () => {
+    let component = mount(<AppSidebarMinimizer />);
+    const instance = component.instance();
+    const handleClickSpy = sinon.spy(instance, 'handleClick');
+    component.find('button').simulate('click');
+
+    expect(handleClickSpy.called).toBe(true);
+  })
+})

tests/SidebarToggler.test.js

@@ -2,11 +2,33 @@ import expect from 'expect'
 import React from 'react'
 import {renderToStaticMarkup as render} from 'react-dom/server'
 
+import { configure, mount } from 'enzyme'
+import Adapter from 'enzyme-adapter-react-16'
+import sinon from 'sinon';
+
 import AppSidebarToggler from 'src/SidebarToggler';
 
+configure({ adapter: new Adapter() });
+
 describe('AppSidebarToggler', () => {
   it('renders button with class="navbar-toggler"', () => {
     expect(render(<AppSidebarToggler className="d-lg-none" display="md" mobile />))
     .toContain('<button type="button" class="d-lg-none navbar-toggler"><span class="navbar-toggler-icon"></span></button>')
   })
-})
+  it('should call sidebarToggle', () => {
+    let component = mount(<AppSidebarToggler />);
+    const instance = component.instance();
+    const handleClickSpy = sinon.spy(instance, 'sidebarToggle');
+    component.find('button').simulate('click');
+
+    expect(handleClickSpy.called).toBe(true);
+  })
+  it('should call sidebarToggle mobile', () => {
+    let component = mount(<AppSidebarToggler mobile />);
+    const instance = component.instance();
+    const handleClickSpy = sinon.spy(instance, 'sidebarToggle');
+    component.find('button').simulate('click');
+
+    expect(handleClickSpy.called).toBe(true);
+  })
+})