@@ -122,7 +123,7 @@ class Collapses extends Component {
-
+
diff --git a/src/views/Base/Collapses/Collapses.test.js b/src/views/Base/Collapses/Collapses.test.js
index 0a6cf6d..80d5434 100644
--- a/src/views/Base/Collapses/Collapses.test.js
+++ b/src/views/Base/Collapses/Collapses.test.js
@@ -1,9 +1,73 @@
import React from 'react';
import ReactDOM from 'react-dom';
import Collapses from './Collapses';
+import {mount} from 'enzyme/build';
it('renders without crashing', () => {
const div = document.createElement('div');
ReactDOM.render(, div);
ReactDOM.unmountComponentAtNode(div);
});
+
+describe('toggle clicks', function() {
+ it('collapse without crashing', () => {
+ const wrapper = mount();
+ let collapse = wrapper.find('#toggleCollapse1').at(0);
+ collapse.simulate('click');
+ expect(wrapper.state().collapse).toEqual(true);
+ collapse.simulate('click');
+ expect(wrapper.state().collapse).toEqual(false);
+ collapse.simulate('click');
+ expect(wrapper.state().collapse).toEqual(true);
+ wrapper.unmount()
+ });
+ it('fade without crashing', () => {
+ const wrapper = mount();
+ let fade = wrapper.find('#toggleFade1').at(0);
+ fade.simulate('click');
+ expect(wrapper.state().fadeIn).toEqual(false);
+ fade.simulate('click');
+ expect(wrapper.state().fadeIn).toEqual(true);
+ wrapper.unmount()
+ });
+ it('accordion without crashing', () => {
+ const wrapper = mount();
+ let accordion = wrapper.find('[aria-controls="collapseOne"]').at(0);
+ accordion.simulate('click');
+ expect(wrapper.state().accordion[0]).toEqual(false);
+ expect(wrapper.state().accordion[1]).toEqual(false);
+ expect(wrapper.state().accordion[2]).toEqual(false);
+ accordion = wrapper.find('[aria-controls="collapseTwo"]').at(0);
+ accordion.simulate('click');
+ expect(wrapper.state().accordion[0]).toEqual(false);
+ expect(wrapper.state().accordion[1]).toEqual(true);
+ expect(wrapper.state().accordion[2]).toEqual(false);
+ accordion = wrapper.find('[aria-controls="collapseThree"]').at(0);
+ accordion.simulate('click');
+ expect(wrapper.state().accordion[0]).toEqual(false);
+ expect(wrapper.state().accordion[1]).toEqual(false);
+ expect(wrapper.state().accordion[2]).toEqual(true);
+ accordion = wrapper.find('[aria-controls="collapseOne"]').at(0);
+ accordion.simulate('click');
+ expect(wrapper.state().accordion[0]).toEqual(true);
+ expect(wrapper.state().accordion[1]).toEqual(false);
+ expect(wrapper.state().accordion[2]).toEqual(false);
+ wrapper.unmount()
+ });
+ it('custom without crashing', () => {
+ const wrapper = mount();
+ let accordion = wrapper.find('[aria-controls="exampleAccordion1"]').at(0);
+ accordion.simulate('click');
+ expect(wrapper.state().custom[0]).toEqual(false);
+ expect(wrapper.state().custom[1]).toEqual(false);
+ accordion = wrapper.find('[aria-controls="exampleAccordion1"]').at(0);
+ accordion.simulate('click');
+ expect(wrapper.state().custom[0]).toEqual(true);
+ expect(wrapper.state().custom[1]).toEqual(false);
+ accordion = wrapper.find('[aria-controls="exampleAccordion2"]').at(0);
+ accordion.simulate('click');
+ expect(wrapper.state().custom[0]).toEqual(false);
+ expect(wrapper.state().custom[1]).toEqual(true);
+ wrapper.unmount()
+ });
+});
diff --git a/src/views/Base/Dropdowns/Dropdowns.test.js b/src/views/Base/Dropdowns/Dropdowns.test.js
index 0f2d851..ecc269f 100644
--- a/src/views/Base/Dropdowns/Dropdowns.test.js
+++ b/src/views/Base/Dropdowns/Dropdowns.test.js
@@ -1,5 +1,6 @@
import React from 'react';
import ReactDOM from 'react-dom';
+import { mount } from 'enzyme'
import Dropdowns from './Dropdowns';
it('renders without crashing', () => {
@@ -7,3 +8,20 @@ it('renders without crashing', () => {
ReactDOM.render(, div);
ReactDOM.unmountComponentAtNode(div);
});
+it('toggle click without crashing', () => {
+ const wrapper = mount();
+ for (let i=0; i<5; i++) {
+ let Dropdown = wrapper.find('button.dropdown-toggle').at(i);
+ Dropdown.simulate('click');
+ expect(wrapper.state().dropdownOpen[i]).toEqual(true);
+ }
+ for (let i=0; i<2; i++) {
+ let Dropdown = wrapper.find('[data-toggle="dropdown"]').at(0);
+ Dropdown.simulate('click');
+ expect(wrapper.state().dropdownOpen[5]).toEqual(true);
+ let DropdownItem = wrapper.find('div.dropdown-menu > .dropdown-item').at(i);
+ DropdownItem.simulate('click');
+ expect(wrapper.state().dropdownOpen[5]).toEqual(false);
+ }
+ wrapper.unmount()
+});
diff --git a/src/views/Base/Forms/Forms.test.js b/src/views/Base/Forms/Forms.test.js
index bb2396a..952f0a9 100644
--- a/src/views/Base/Forms/Forms.test.js
+++ b/src/views/Base/Forms/Forms.test.js
@@ -1,9 +1,39 @@
import React from 'react';
import ReactDOM from 'react-dom';
import Forms from './Forms';
+import {mount} from 'enzyme/build';
it('renders without crashing', () => {
const div = document.createElement('div');
ReactDOM.render(, div);
ReactDOM.unmountComponentAtNode(div);
});
+
+describe('toggle clicks', function() {
+ it('dropdowns without crashing', () => {
+ const wrapper = mount();
+ for (let i = 0; i < 4; i++) {
+ let count = i === 0 ? 'first' : i === 1 ? 'second' : i === 2 ? 'third' : 'fourth'
+ let Dropdown = wrapper.find('button.dropdown-toggle').at(i);
+ Dropdown.simulate('click');
+ expect(wrapper.state()[count]).toEqual(true);
+ }
+ wrapper.unmount()
+ });
+ it('collapse without crashing', () => {
+ const wrapper = mount();
+ let collapse = wrapper.find('button.btn-minimize').at(0);
+ collapse.simulate('click');
+ expect(wrapper.state().collapse).toEqual(false);
+ collapse.simulate('click');
+ expect(wrapper.state().collapse).toEqual(true);
+ wrapper.unmount()
+ });
+ it('fade without crashing', () => {
+ const wrapper = mount();
+ let fade = wrapper.find('button.btn-close').at(0);
+ fade.simulate('click');
+ expect(wrapper.state().fadeIn).toEqual(false);
+ wrapper.unmount()
+ });
+})
diff --git a/src/views/Base/ListGroups/ListGroups.test.js b/src/views/Base/ListGroups/ListGroups.test.js
index 9923f32..6b9f398 100644
--- a/src/views/Base/ListGroups/ListGroups.test.js
+++ b/src/views/Base/ListGroups/ListGroups.test.js
@@ -1,9 +1,19 @@
import React from 'react';
import ReactDOM from 'react-dom';
import ListGroups from './ListGroups';
+import {mount} from 'enzyme/build';
it('renders without crashing', () => {
const div = document.createElement('div');
ReactDOM.render(, div);
ReactDOM.unmountComponentAtNode(div);
});
+it('toggle click without crashing', () => {
+ const wrapper = mount();
+ for (let i=0; i<4; i++) {
+ let ListGroup = wrapper.find('#list-tab .list-group-item-action.list-group-item').at(i);
+ ListGroup.simulate('click');
+ expect(wrapper.state().activeTab).toEqual(i);
+ }
+ wrapper.unmount()
+});
diff --git a/src/views/Base/Navs/Navs.test.js b/src/views/Base/Navs/Navs.test.js
index 3193dab..d00d930 100644
--- a/src/views/Base/Navs/Navs.test.js
+++ b/src/views/Base/Navs/Navs.test.js
@@ -1,9 +1,19 @@
import React from 'react';
import ReactDOM from 'react-dom';
import Navs from './Navs';
+import {mount} from 'enzyme/build';
it('renders without crashing', () => {
const div = document.createElement('div');
ReactDOM.render(, div);
ReactDOM.unmountComponentAtNode(div);
});
+it('toggle click without crashing', () => {
+ const wrapper = mount();
+ for (let i=0; i<2; i++) {
+ let Nav = wrapper.find('a.dropdown-toggle').at(i);
+ Nav.simulate('click');
+ expect(wrapper.state().dropdownOpen[i]).toEqual(true);
+ }
+ wrapper.unmount()
+});
diff --git a/src/views/Base/Tabs/Tabs.js b/src/views/Base/Tabs/Tabs.js
index de7dc3e..cdec062 100644
--- a/src/views/Base/Tabs/Tabs.js
+++ b/src/views/Base/Tabs/Tabs.js
@@ -1,5 +1,5 @@
-import React, { Component } from 'react';
-import { Badge, Col, Nav, NavItem, NavLink, Row, TabContent, TabPane } from 'reactstrap';
+import React, {Component} from 'react';
+import {Badge, Col, Nav, NavItem, NavLink, Row, TabContent, TabPane} from 'reactstrap';
import classnames from 'classnames';
class Tabs extends Component {
@@ -9,16 +9,36 @@ class Tabs extends Component {
this.toggle = this.toggle.bind(this);
this.state = {
- activeTab: '1',
+ activeTab: new Array(4).fill('1'),
};
}
- toggle(tab) {
- if (this.state.activeTab !== tab) {
- this.setState({
- activeTab: tab,
- });
- }
+ lorem() {
+ return 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit.'
+ }
+
+ toggle(tabPane, tab) {
+ const newArray = this.state.activeTab.slice()
+ newArray[tabPane] = tab
+ this.setState({
+ activeTab: newArray,
+ });
+ }
+
+ tabPane() {
+ return (
+ <>
+
+ {`1. ${this.lorem()}`}
+
+
+ {`2. ${this.lorem()}`}
+
+
+ {`3. ${this.lorem()}`}
+
+ >
+ );
}
render() {
@@ -29,207 +49,129 @@ class Tabs extends Component {
-
-
- 1. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore
- et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
- aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum
- dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
- officia deserunt mollit anim id est laborum.
-
-
- 2. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore
- et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
- aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum
- dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
- officia deserunt mollit anim id est laborum.
-
-
- 2. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore
- et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
- aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum
- dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
- officia deserunt mollit anim id est laborum.
-
+
+ {this.tabPane()}
-
-
- 1. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore
- et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
- aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum
- dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
- officia deserunt mollit anim id est laborum.
-
-
- 2. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore
- et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
- aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum
- dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
- officia deserunt mollit anim id est laborum.
-
-
- 2. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore
- et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
- aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum
- dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
- officia deserunt mollit anim id est laborum.
-
+
+ {this.tabPane()}
+
+
+
+
+
+ {this.tabPane()}
-
-
- 1. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore
- et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
- aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum
- dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
- officia deserunt mollit anim id est laborum.
-
-
- 2. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore
- et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
- aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum
- dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
- officia deserunt mollit anim id est laborum.
-
-
- 2. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore
- et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
- aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum
- dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
- officia deserunt mollit anim id est laborum.
-
-
-
-
-
-
-
- 1. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore
- et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
- aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum
- dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
- officia deserunt mollit anim id est laborum.
-
-
- 2. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore
- et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
- aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum
- dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
- officia deserunt mollit anim id est laborum.
-
-
- 2. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore
- et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
- aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum
- dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
- officia deserunt mollit anim id est laborum.
-
+
+ {this.tabPane()}
diff --git a/src/views/Base/Tabs/Tabs.test.js b/src/views/Base/Tabs/Tabs.test.js
index 4a10e40..6d3d51a 100644
--- a/src/views/Base/Tabs/Tabs.test.js
+++ b/src/views/Base/Tabs/Tabs.test.js
@@ -1,9 +1,21 @@
import React from 'react';
import ReactDOM from 'react-dom';
import Tabs from './Tabs';
+import {mount} from 'enzyme/build';
it('renders without crashing', () => {
const div = document.createElement('div');
ReactDOM.render(, div);
ReactDOM.unmountComponentAtNode(div);
});
+it('toggle click without crashing', () => {
+ const wrapper = mount();
+ for (let pane=0; pane<4; pane++) {
+ for( let tabId=1; tabId<4; tabId++) {
+ let Tab = wrapper.find('.nav-tabs .nav-item .nav-link').at((3*pane)+tabId-1);
+ Tab.simulate('click');
+ expect(wrapper.state().activeTab[pane]).toEqual((tabId).toString());
+ }
+ }
+ wrapper.unmount()
+});
diff --git a/src/views/Buttons/ButtonDropdowns/ButtonDropdowns.js b/src/views/Buttons/ButtonDropdowns/ButtonDropdowns.js
index 337fcb5..4bc5243 100644
--- a/src/views/Buttons/ButtonDropdowns/ButtonDropdowns.js
+++ b/src/views/Buttons/ButtonDropdowns/ButtonDropdowns.js
@@ -205,7 +205,7 @@ class ButtonDropdowns extends Component {
Dropdown directions
- { this.toggle(15); }}>
+ { this.toggle(13); }}>
Direction Up
@@ -216,7 +216,7 @@ class ButtonDropdowns extends Component {
Another Action
- { this.toggle(16); }}>
+ { this.toggle(14); }}>
Direction Left
@@ -227,7 +227,7 @@ class ButtonDropdowns extends Component {
Another Action
- { this.toggle(17); }}>
+ { this.toggle(15); }}>
Direction Right
@@ -238,7 +238,7 @@ class ButtonDropdowns extends Component {
Another Action
- { this.toggle(18); }}>
+ { this.toggle(16); }}>
Default Down
@@ -256,7 +256,7 @@ class ButtonDropdowns extends Component {
Button Dropdown sizing
- { this.toggle(13); }}>
+ { this.toggle(17); }}>
Large Button
@@ -267,7 +267,7 @@ class ButtonDropdowns extends Component {
Another Action
- { this.toggle(14); }}>
+ { this.toggle(18); }}>
Small Button
diff --git a/src/views/Buttons/ButtonDropdowns/ButtonDropdowns.test.js b/src/views/Buttons/ButtonDropdowns/ButtonDropdowns.test.js
index 9c44fb1..26d3c61 100644
--- a/src/views/Buttons/ButtonDropdowns/ButtonDropdowns.test.js
+++ b/src/views/Buttons/ButtonDropdowns/ButtonDropdowns.test.js
@@ -1,5 +1,6 @@
import React from 'react';
import ReactDOM from 'react-dom';
+import { mount } from 'enzyme'
import ButtonDropdowns from './ButtonDropdowns';
it('renders without crashing', () => {
@@ -7,3 +8,13 @@ it('renders without crashing', () => {
ReactDOM.render(, div);
ReactDOM.unmountComponentAtNode(div);
});
+it('toggle click without crashing', () => {
+ const wrapper = mount();
+ for (let i=0; i<19; i++) {
+ let ButtonDropdown = wrapper.find('button.dropdown-toggle').at(i);
+ ButtonDropdown.simulate('click');
+ expect(wrapper.state().dropdownOpen[i]).toEqual(true);
+ }
+ wrapper.unmount()
+});
+
diff --git a/src/views/Buttons/ButtonGroups/ButtonGroups.js b/src/views/Buttons/ButtonGroups/ButtonGroups.js
index 454c547..bf18225 100644
--- a/src/views/Buttons/ButtonGroups/ButtonGroups.js
+++ b/src/views/Buttons/ButtonGroups/ButtonGroups.js
@@ -66,7 +66,7 @@ class ButtonGroups extends Component {
- { this.toggle(1); }}>
+ { this.toggle(0); }}>
Dropdown
@@ -135,7 +135,7 @@ class ButtonGroups extends Component {
- { this.toggle(0); }}>
+ { this.toggle(1); }}>
Dropdown
diff --git a/src/views/Buttons/ButtonGroups/ButtonGroups.test.js b/src/views/Buttons/ButtonGroups/ButtonGroups.test.js
index 6ab857b..72186c4 100644
--- a/src/views/Buttons/ButtonGroups/ButtonGroups.test.js
+++ b/src/views/Buttons/ButtonGroups/ButtonGroups.test.js
@@ -1,9 +1,19 @@
import React from 'react';
import ReactDOM from 'react-dom';
import ButtonGroups from './ButtonGroups';
+import {mount} from 'enzyme/build';
it('renders without crashing', () => {
const div = document.createElement('div');
ReactDOM.render(, div);
ReactDOM.unmountComponentAtNode(div);
});
+it('toggle click without crashing', () => {
+ const wrapper = mount();
+ for (let i=0; i<2; i++) {
+ let ButtonGroup = wrapper.find('button.dropdown-toggle').at(i);
+ ButtonGroup.simulate('click');
+ expect(wrapper.state().dropdownOpen[i]).toEqual(true);
+ }
+ wrapper.unmount()
+});
diff --git a/src/views/Pages/Login/Login.test.js b/src/views/Pages/Login/Login.test.js
index 5d5bbf4..b10e7b8 100644
--- a/src/views/Pages/Login/Login.test.js
+++ b/src/views/Pages/Login/Login.test.js
@@ -1,9 +1,10 @@
import React from 'react';
import ReactDOM from 'react-dom';
+import { MemoryRouter } from 'react-router-dom';
import Login from './Login';
it('renders without crashing', () => {
const div = document.createElement('div');
- ReactDOM.render(, div);
+ ReactDOM.render(, div);
ReactDOM.unmountComponentAtNode(div);
});
diff --git a/src/views/Theme/Colors/Colors.test.js b/src/views/Theme/Colors/Colors.test.js
index 754245e..dbed6eb 100644
--- a/src/views/Theme/Colors/Colors.test.js
+++ b/src/views/Theme/Colors/Colors.test.js
@@ -1,7 +1,7 @@
import React from 'react';
import Colors from './Colors';
-import { shallow } from 'enzyme'
+import { mount } from 'enzyme'
it('renders without crashing', () => {
- shallow();
+ mount();
});
diff --git a/src/views/Users/User.test.js b/src/views/Users/User.test.js
new file mode 100644
index 0000000..df0e3f4
--- /dev/null
+++ b/src/views/Users/User.test.js
@@ -0,0 +1,15 @@
+import React from 'react';
+import {MemoryRouter} from 'react-router-dom';
+import { mount } from 'enzyme'
+import User from './User';
+
+
+it('renders without crashing', () => {
+ const wrapper = mount(
+
+
+
+ );
+ expect(wrapper.containsMatchingElement(Samppa Nori)).toEqual(true)
+ wrapper.unmount()
+});
diff --git a/src/views/Users/Users.test.js b/src/views/Users/Users.test.js
index faab45e..946fec6 100644
--- a/src/views/Users/Users.test.js
+++ b/src/views/Users/Users.test.js
@@ -1,9 +1,10 @@
import React from 'react';
import ReactDOM from 'react-dom';
+import { MemoryRouter } from 'react-router-dom';
import Users from './Users';
it('renders without crashing', () => {
const div = document.createElement('div');
- ReactDOM.render(, div);
+ ReactDOM.render(, div);
ReactDOM.unmountComponentAtNode(div);
});