diff --git a/packages/react-bootstrap-table2-editor/test/wrapper.test.js b/packages/react-bootstrap-table2-editor/test/wrapper.test.js deleted file mode 100644 index 8264ca8..0000000 --- a/packages/react-bootstrap-table2-editor/test/wrapper.test.js +++ /dev/null @@ -1,330 +0,0 @@ -import React from 'react'; -import sinon from 'sinon'; -import { shallow } from 'enzyme'; - -import _ from 'react-bootstrap-table-next/src/utils'; -import remoteResolver from 'react-bootstrap-table-next/src/props-resolver/remote-resolver'; -import Store from 'react-bootstrap-table-next/src/store'; -import BootstrapTable from 'react-bootstrap-table-next/src/bootstrap-table'; -import cellEditFactory from '..'; -import * as Const from '../src/const'; -import wrapperFactory from '../src/wrapper'; - -describe('CellEditWrapper', () => { - let wrapper; - let instance; - const onTableChangeCB = sinon.stub(); - const columns = [{ - dataField: 'id', - text: 'ID' - }, { - dataField: 'name', - text: 'Name' - }]; - const data = [{ - id: 1, - name: 'A' - }, { - id: 2, - name: 'B' - }]; - - const createTableProps = (props = {}) => { - const { cellEdit, ...rest } = props; - const tableProps = { - keyField: 'id', - columns, - data, - _, - store: new Store('id'), - cellEdit: cellEditFactory(cellEdit), - onTableChange: onTableChangeCB, - ...rest - }; - tableProps.store.data = data; - return tableProps; - }; - - const CellEditWrapper = wrapperFactory(BootstrapTable, { - _, - remoteResolver - }); - - const createCellEditWrapper = (props, renderFragment = true) => { - wrapper = shallow(); - instance = wrapper.instance(); - if (renderFragment) { - const fragment = instance.render(); - wrapper = shallow(
{ fragment }
); - } - }; - - afterEach(() => { - onTableChangeCB.reset(); - }); - - beforeEach(() => { - const props = createTableProps({ - cellEdit: { mode: Const.CLICK_TO_CELL_EDIT } - }); - createCellEditWrapper(props); - }); - - it('should render CellEditWrapper correctly', () => { - expect(wrapper.length).toBe(1); - expect(wrapper.find(BootstrapTable)).toBeDefined(); - }); - - it('should have correct state', () => { - expect(instance.state.ridx).toBeNull(); - expect(instance.state.cidx).toBeNull(); - expect(instance.state.message).toBeNull(); - expect(instance.state.isDataChanged).toBeFalsy(); - }); - - it('should inject correct props to base component', () => { - const base = wrapper.find(BootstrapTable); - expect(base.props().cellEdit).toBeDefined(); - expect(base.props().cellEdit.onStart).toBeDefined(); - expect(base.props().cellEdit.onEscape).toBeDefined(); - expect(base.props().cellEdit.onUpdate).toBeDefined(); - expect(base.props().cellEdit.EditingCell).toBeDefined(); - expect(base.props().cellEdit.ridx).toBeNull(); - expect(base.props().cellEdit.cidx).toBeNull(); - expect(base.props().cellEdit.message).toBeNull(); - expect(base.props().isDataChanged).toBe(instance.state.isDataChanged); - }); - - describe('when receive new cellEdit prop', () => { - const spy = jest.spyOn(CellEditWrapper.prototype, 'escapeEditing'); - - describe('and cellEdit is not work on remote', () => { - beforeEach(() => { - const props = createTableProps({ - cellEdit: { mode: Const.CLICK_TO_CELL_EDIT } - }); - createCellEditWrapper(props); - wrapper.setProps({ cellEdit: props.cellEdit }); - }); - - it('should always setting state.isDataChanged as false', () => { - expect(instance.state.isDataChanged).toBeFalsy(); - }); - }); - - describe('and cellEdit is work on remote', () => { - let errorMessage; - let props; - beforeEach(() => { - props = createTableProps({ - cellEdit: { mode: Const.CLICK_TO_CELL_EDIT }, - remote: true - }); - }); - - describe('and cellEdit.errorMessage is defined', () => { - beforeEach(() => { - createCellEditWrapper(props, false); - errorMessage = 'test'; - const newCellEdit = { - ...props.cellEdit, - options: { ...props.cellEdit.options, errorMessage } - }; - wrapper.setProps({ cellEdit: newCellEdit }); - }); - - it('should setting correct state', () => { - expect(instance.state.isDataChanged).toBeFalsy(); - expect(instance.state.message).toEqual(errorMessage); - }); - }); - - describe('and cellEdit.errorMessage is undefined', () => { - beforeEach(() => { - errorMessage = null; - createCellEditWrapper(props, false); - const newCellEdit = { - ...props.cellEdit, - options: { ...props.cellEdit.options, errorMessage } - }; - wrapper.setProps({ cellEdit: newCellEdit }); - }); - - it('should setting correct state', () => { - expect(wrapper.state().isDataChanged).toBeTruthy(); - }); - - it('should escape current editing', () => { - expect(spy).toHaveBeenCalled(); - }); - }); - }); - }); - - describe('call escapeEditing function', () => { - it('should set state correctly', () => { - instance.escapeEditing(); - expect(instance.state.ridx).toBeNull(); - expect(instance.state.cidx).toBeNull(); - }); - }); - - describe('call startEditing function', () => { - const ridx = 1; - const cidx = 3; - - it('should set state correctly', () => { - instance.startEditing(ridx, cidx); - expect(instance.state.ridx).toEqual(ridx); - expect(instance.state.cidx).toEqual(cidx); - expect(instance.state.isDataChanged).toBeFalsy(); - }); - - describe('if selectRow.clickToSelect is defined', () => { - beforeEach(() => { - const selectRow = { mode: 'checkbox', clickToSelect: true }; - const props = createTableProps({ - cellEdit: { mode: Const.CLICK_TO_CELL_EDIT }, - selectRow - }); - createCellEditWrapper(props); - }); - - it('should not set state', () => { - instance.startEditing(ridx, cidx); - expect(instance.state.ridx).toBeNull(); - expect(instance.state.cidx).toBeDefined(); - }); - }); - - describe('if selectRow.clickToSelect and selectRow.clickToEdit is defined', () => { - beforeEach(() => { - const selectRow = { mode: 'checkbox', clickToSelect: true, clickToEdit: true }; - const props = createTableProps({ - cellEdit: { mode: Const.CLICK_TO_CELL_EDIT }, - selectRow - }); - createCellEditWrapper(props); - }); - - it('should set state correctly', () => { - instance.startEditing(ridx, cidx); - expect(instance.state.ridx).toEqual(ridx); - expect(instance.state.cidx).toEqual(cidx); - }); - }); - }); - - describe('call completeEditing function', () => { - it('should set state correctly', () => { - instance.completeEditing(); - expect(instance.state.ridx).toBeNull(); - expect(instance.state.cidx).toBeNull(); - expect(instance.state.message).toBeNull(); - expect(instance.state.isDataChanged).toBeTruthy(); - }); - }); - - describe('call handleCellUpdate function', () => { - let props; - const row = data[0]; - const column = columns[1]; - const newValue = 'new name'; - - describe('when cell edit is work on remote', () => { - const spy = jest.spyOn(CellEditWrapper.prototype, 'handleCellChange'); - - beforeEach(() => { - props = createTableProps({ - cellEdit: { mode: Const.CLICK_TO_CELL_EDIT }, - remote: true - }); - createCellEditWrapper(props); - instance.handleCellUpdate(row, column, newValue); - }); - - it('should calling handleCellChange correctly', () => { - expect(spy).toHaveBeenCalled(); - expect(spy.mock.calls).toHaveLength(1); - expect(spy.mock.calls[0]).toHaveLength(3); - expect(spy.mock.calls[0][0]).toEqual(row.id); - expect(spy.mock.calls[0][1]).toEqual(column.dataField); - expect(spy.mock.calls[0][2]).toEqual(newValue); - }); - }); - - describe('when cell edit is not work on remote', () => { - const spyOnCompleteEditing = jest.spyOn(CellEditWrapper.prototype, 'completeEditing'); - const spyOnStoreEdit = jest.spyOn(Store.prototype, 'edit'); - - beforeEach(() => { - props = createTableProps({ - cellEdit: { mode: Const.CLICK_TO_CELL_EDIT } - }); - createCellEditWrapper(props); - instance.handleCellUpdate(row, column, newValue); - }); - - afterEach(() => { - spyOnStoreEdit.mockReset(); - spyOnCompleteEditing.mockReset(); - }); - - it('should calling props.store.edit', () => { - expect(spyOnStoreEdit).toHaveBeenCalled(); - expect(spyOnStoreEdit.mock.calls).toHaveLength(1); - expect(spyOnStoreEdit.mock.calls[0]).toHaveLength(3); - expect(spyOnStoreEdit.mock.calls[0][0]).toEqual(row.id); - expect(spyOnStoreEdit.mock.calls[0][1]).toEqual(column.dataField); - expect(spyOnStoreEdit.mock.calls[0][2]).toEqual(newValue); - }); - - it('should calling completeEditing function', () => { - expect(spyOnCompleteEditing).toHaveBeenCalled(); - }); - - describe('if cellEdit.afterSaveCell prop defined', () => { - const aftereSaveCellCallBack = sinon.stub(); - - beforeEach(() => { - props = createTableProps({ - cellEdit: { - mode: Const.CLICK_TO_CELL_EDIT, - afterSaveCell: aftereSaveCellCallBack - } - }); - createCellEditWrapper(props); - instance.handleCellUpdate(row, column, newValue); - }); - - it('should calling cellEdit.afterSaveCell correctly', () => { - expect(aftereSaveCellCallBack.callCount).toBe(1); - expect(aftereSaveCellCallBack.calledWith( - row[column.dataField], newValue, row, column) - ).toBe(true); - }); - }); - }); - - describe('if cellEdit.beforeSaveCell prop defined', () => { - const beforeSaveCellCallBack = sinon.stub(); - beforeEach(() => { - props = createTableProps({ - cellEdit: { - mode: Const.CLICK_TO_CELL_EDIT, - beforeSaveCell: beforeSaveCellCallBack - } - }); - createCellEditWrapper(props); - instance.handleCellUpdate(row, column, newValue); - }); - - it('should calling cellEdit.beforeSaveCell correctly', () => { - expect(beforeSaveCellCallBack.callCount).toBe(1); - expect(beforeSaveCellCallBack.calledWith( - row[column.dataField], newValue, row, column) - ).toBe(true); - }); - }); - }); -}); diff --git a/packages/react-bootstrap-table2-filter/test/context.test.js b/packages/react-bootstrap-table2-filter/test/context.test.js new file mode 100644 index 0000000..4dd03d5 --- /dev/null +++ b/packages/react-bootstrap-table2-filter/test/context.test.js @@ -0,0 +1,197 @@ +import 'jsdom-global/register'; +import React from 'react'; +import { shallow } from 'enzyme'; +import _ from 'react-bootstrap-table-next/src/utils'; +import BootstrapTable from 'react-bootstrap-table-next/src/bootstrap-table'; + +import { + FILTER_TYPE +} from '../src/const'; +import createFilterContext from '../src/context'; +import { textFilter } from '../index'; + +describe('FilterContext', () => { + let wrapper; + // let filter; + let FilterContext; + + const data = [{ + id: 1, + name: 'A' + }, { + id: 2, + name: 'B' + }]; + + const columns = [{ + dataField: 'id', + text: 'ID', + filter: textFilter() + }, { + dataField: 'name', + text: 'Name', + filter: textFilter() + }]; + + // const defaultFilter = {}; + + const mockBase = jest.fn((props => ( + + ))); + + const handleFilterChange = jest.fn(); + + function shallowContext( + // customFilter = defaultFilter, + enableRemote = false + ) { + mockBase.mockReset(); + handleFilterChange.mockReset(); + FilterContext = createFilterContext( + _, + jest.fn().mockReturnValue(enableRemote), + handleFilterChange + ); + + return ( + + + { + filterProps => mockBase(filterProps) + } + + + ); + } + + describe('default render', () => { + beforeEach(() => { + wrapper = shallow(shallowContext()); + wrapper.render(); + }); + + it('should have correct Provider property after calling createFilterContext', () => { + expect(FilterContext.Provider).toBeDefined(); + }); + + it('should have correct Consumer property after calling createFilterContext', () => { + expect(FilterContext.Consumer).toBeDefined(); + }); + + it('should have correct currFilters', () => { + expect(wrapper.instance().currFilters).toEqual({}); + }); + + it('should pass correct cell editing props to children element', () => { + expect(wrapper.length).toBe(1); + expect(mockBase).toHaveBeenCalledWith({ + data, + onFilter: wrapper.instance().onFilter + }); + }); + }); + + describe('when remote filter is enable', () => { + beforeEach(() => { + wrapper = shallow(shallowContext(true)); + wrapper.render(); + wrapper.instance().currFilters = { price: { filterVal: 20, filterType: FILTER_TYPE.TEXT } }; + }); + + it('should pass original data without internal filtering', () => { + expect(wrapper.length).toBe(1); + expect(mockBase).toHaveBeenCalledWith({ + data, + onFilter: wrapper.instance().onFilter + }); + }); + }); + + describe('onFilter', () => { + let instance; + describe('when filterVal is empty or undefined', () => { + const filterVals = ['', undefined, []]; + + beforeEach(() => { + wrapper = shallow(shallowContext()); + wrapper.render(); + instance = wrapper.instance(); + }); + + it('should correct currFilters', () => { + filterVals.forEach((filterVal) => { + instance.onFilter(columns[1], FILTER_TYPE.TEXT)(filterVal); + expect(Object.keys(instance.currFilters)).toHaveLength(0); + }); + }); + }); + + describe('when filterVal is existing', () => { + const filterVal = '3'; + + beforeEach(() => { + wrapper = shallow(shallowContext()); + wrapper.render(); + instance = wrapper.instance(); + }); + + it('should correct currFilters', () => { + instance.onFilter(columns[1], FILTER_TYPE.TEXT)(filterVal); + expect(Object.keys(instance.currFilters)).toHaveLength(1); + }); + }); + + describe('when remote filter is enabled', () => { + const filterVal = '3'; + + beforeEach(() => { + wrapper = shallow(shallowContext(true)); + wrapper.render(); + instance = wrapper.instance(); + instance.onFilter(columns[1], FILTER_TYPE.TEXT)(filterVal); + }); + + it('should correct currFilters', () => { + expect(Object.keys(instance.currFilters)).toHaveLength(1); + }); + + it('should calling handleFilterChange correctly', () => { + expect(handleFilterChange).toHaveBeenCalledTimes(1); + expect(handleFilterChange).toHaveBeenCalledWith(instance.currFilters); + }); + }); + + describe('combination', () => { + beforeEach(() => { + wrapper = shallow(shallowContext()); + wrapper.render(); + instance = wrapper.instance(); + }); + + it('should set correct currFilters', () => { + instance.onFilter(columns[0], FILTER_TYPE.TEXT)('3'); + expect(Object.keys(instance.currFilters)).toHaveLength(1); + + instance.onFilter(columns[0], FILTER_TYPE.TEXT)('2'); + expect(Object.keys(instance.currFilters)).toHaveLength(1); + + instance.onFilter(columns[1], FILTER_TYPE.TEXT)('2'); + expect(Object.keys(instance.currFilters)).toHaveLength(2); + + instance.onFilter(columns[1], FILTER_TYPE.TEXT)(''); + expect(Object.keys(instance.currFilters)).toHaveLength(1); + + instance.onFilter(columns[0], FILTER_TYPE.TEXT)(''); + expect(Object.keys(instance.currFilters)).toHaveLength(0); + }); + }); + }); +}); diff --git a/packages/react-bootstrap-table2-filter/test/filter.test.js b/packages/react-bootstrap-table2-filter/test/filter.test.js index 79d0407..32956e4 100644 --- a/packages/react-bootstrap-table2-filter/test/filter.test.js +++ b/packages/react-bootstrap-table2-filter/test/filter.test.js @@ -1,5 +1,4 @@ import _ from 'react-bootstrap-table-next/src/utils'; -import Store from 'react-bootstrap-table-next/src/store'; import { filters } from '../src/filter'; import { FILTER_TYPE } from '../src/const'; @@ -16,14 +15,10 @@ for (let i = 0; i < 20; i += 1) { } describe('filter', () => { - let store; - let filterFn; let currFilters; let columns; beforeEach(() => { - store = new Store('id'); - store.data = data; currFilters = {}; columns = [{ dataField: 'id', @@ -41,10 +36,6 @@ describe('filter', () => { }); describe('filterByText', () => { - beforeEach(() => { - filterFn = filters(store, columns, _); - }); - describe('when filter value is not a String', () => { it('should transform to string and do the filter', () => { currFilters.name = { @@ -52,7 +43,7 @@ describe('filter', () => { filterType: FILTER_TYPE.TEXT }; - const result = filterFn(currFilters); + const result = filters(data, columns, _)(currFilters); expect(result).toBeDefined(); expect(result).toHaveLength(2); }); @@ -65,7 +56,7 @@ describe('filter', () => { filterType: FILTER_TYPE.TEXT }; - const result = filterFn(currFilters); + const result = filters(data, columns, _)(currFilters); expect(result).toBeDefined(); expect(result).toHaveLength(2); }); @@ -79,7 +70,7 @@ describe('filter', () => { filterType: FILTER_TYPE.TEXT }; - const result = filterFn(currFilters); + const result = filters(data, columns, _)(currFilters); expect(result).toBeDefined(); expect(result).toHaveLength(0); }); @@ -93,7 +84,7 @@ describe('filter', () => { comparator: EQ }; - const result = filterFn(currFilters); + const result = filters(data, columns, _)(currFilters); expect(result).toBeDefined(); expect(result).toHaveLength(1); }); @@ -102,7 +93,6 @@ describe('filter', () => { describe('column.filterValue is defined', () => { beforeEach(() => { columns[1].filterValue = jest.fn(); - filterFn = filters(store, columns, _); }); it('should calling custom filterValue callback correctly', () => { @@ -111,7 +101,7 @@ describe('filter', () => { filterType: FILTER_TYPE.TEXT }; - const result = filterFn(currFilters); + const result = filters(data, columns, _)(currFilters); expect(result).toBeDefined(); expect(columns[1].filterValue).toHaveBeenCalledTimes(data.length); // const calls = columns[1].filterValue.mock.calls; @@ -124,10 +114,6 @@ describe('filter', () => { }); describe('filterByArray', () => { - beforeEach(() => { - filterFn = filters(store, columns, _); - }); - describe('when filter value is empty array', () => { it('should return original data', () => { currFilters.name = { @@ -135,9 +121,9 @@ describe('filter', () => { filterType: FILTER_TYPE.MULTISELECT }; - const result = filterFn(currFilters); + const result = filters(data, columns, _)(currFilters); expect(result).toBeDefined(); - expect(result).toHaveLength(store.data.length); + expect(result).toHaveLength(data.length); }); }); @@ -150,7 +136,7 @@ describe('filter', () => { comparator: EQ }; - const result = filterFn(currFilters); + const result = filters(data, columns, _)(currFilters); expect(result).toBeDefined(); expect(result).toHaveLength(2); }); @@ -164,7 +150,7 @@ describe('filter', () => { comparator: LIKE }; - const result = filterFn(currFilters); + const result = filters(data, columns, _)(currFilters); expect(result).toBeDefined(); expect(result).toHaveLength(3); }); @@ -173,10 +159,6 @@ describe('filter', () => { }); describe('filterByNumber', () => { - beforeEach(() => { - filterFn = filters(store, columns, _); - }); - describe('when currFilters.filterVal.comparator is empty', () => { it('should returning correct result', () => { currFilters.price = { @@ -184,11 +166,11 @@ describe('filter', () => { filterType: FILTER_TYPE.NUMBER }; - let result = filterFn(currFilters); + let result = filters(data, columns, _)(currFilters); expect(result).toHaveLength(data.length); currFilters.price.filterVal.comparator = undefined; - result = filterFn(currFilters); + result = filters(result, columns, _)(currFilters); expect(result).toHaveLength(data.length); }); }); @@ -200,7 +182,7 @@ describe('filter', () => { filterType: FILTER_TYPE.NUMBER }; - const result = filterFn(currFilters); + const result = filters(data, columns, _)(currFilters); expect(result).toHaveLength(data.length); }); }); @@ -212,11 +194,11 @@ describe('filter', () => { filterType: FILTER_TYPE.NUMBER }; - let result = filterFn(currFilters); + let result = filters(data, columns, _)(currFilters); expect(result).toHaveLength(1); currFilters.price.filterVal.number = '0'; - result = filterFn(currFilters); + result = filters(result, columns, _)(currFilters); expect(result).toHaveLength(0); }); }); @@ -228,7 +210,7 @@ describe('filter', () => { filterType: FILTER_TYPE.NUMBER }; - const result = filterFn(currFilters); + const result = filters(data, columns, _)(currFilters); expect(result).toHaveLength(16); }); }); @@ -240,7 +222,7 @@ describe('filter', () => { filterType: FILTER_TYPE.NUMBER }; - const result = filterFn(currFilters); + const result = filters(data, columns, _)(currFilters); expect(result).toHaveLength(17); }); }); @@ -252,7 +234,7 @@ describe('filter', () => { filterType: FILTER_TYPE.NUMBER }; - const result = filterFn(currFilters); + const result = filters(data, columns, _)(currFilters); expect(result).toHaveLength(3); }); }); @@ -264,7 +246,7 @@ describe('filter', () => { filterType: FILTER_TYPE.NUMBER }; - const result = filterFn(currFilters); + const result = filters(data, columns, _)(currFilters); expect(result).toHaveLength(4); }); }); @@ -276,15 +258,16 @@ describe('filter', () => { filterType: FILTER_TYPE.NUMBER }; - const result = filterFn(currFilters); + const result = filters(data, columns, _)(currFilters); expect(result).toHaveLength(19); }); }); }); describe('filterByDate', () => { + let filterFn; beforeEach(() => { - filterFn = filters(store, columns, _); + filterFn = filters(data, columns, _); }); describe('when currFilters.filterVal.comparator is empty', () => { diff --git a/packages/react-bootstrap-table2-filter/test/wrapper.test.js b/packages/react-bootstrap-table2-filter/test/wrapper.test.js deleted file mode 100644 index 751fc2e..0000000 --- a/packages/react-bootstrap-table2-filter/test/wrapper.test.js +++ /dev/null @@ -1,252 +0,0 @@ -import React from 'react'; -import sinon from 'sinon'; -import { shallow } from 'enzyme'; - -import _ from 'react-bootstrap-table-next/src/utils'; -import remoteResolver from 'react-bootstrap-table-next/src/props-resolver/remote-resolver'; -import BootstrapTable from 'react-bootstrap-table-next/src/bootstrap-table'; -import Store from 'react-bootstrap-table-next/src/store'; -import filter, { textFilter } from '..'; -import wrapperFactory from '../src/wrapper'; -import { FILTER_TYPE } from '../src/const'; - -const data = []; -for (let i = 0; i < 20; i += 1) { - data.push({ - id: i, - name: `itme name ${i}`, - price: 200 + i - }); -} - -describe('Wrapper', () => { - let wrapper; - let instance; - const onTableChangeCB = sinon.stub(); - - afterEach(() => { - onTableChangeCB.reset(); - }); - - const createTableProps = (props) => { - const tableProps = { - keyField: 'id', - columns: [{ - dataField: 'id', - text: 'ID' - }, { - dataField: 'name', - text: 'Name', - filter: textFilter() - }, { - dataField: 'price', - text: 'Price', - filter: textFilter() - }], - data, - filter: filter(), - _, - store: new Store('id'), - onTableChange: onTableChangeCB, - ...props - }; - tableProps.store.data = data; - return tableProps; - }; - - const FilterWrapper = wrapperFactory(BootstrapTable, { - _, - remoteResolver - }); - - const createFilterWrapper = (props, renderFragment = true) => { - wrapper = shallow(); - instance = wrapper.instance(); - if (renderFragment) { - const fragment = instance.render(); - wrapper = shallow(
{ fragment }
); - } - }; - - describe('default filter wrapper', () => { - const props = createTableProps(); - - beforeEach(() => { - createFilterWrapper(props); - }); - - it('should rendering correctly', () => { - expect(wrapper.length).toBe(1); - }); - - it('should initializing state correctly', () => { - expect(instance.state.isDataChanged).toBeFalsy(); - expect(instance.state.currFilters).toEqual({}); - }); - - it('should rendering BootstraTable correctly', () => { - const table = wrapper.find(BootstrapTable); - expect(table.length).toBe(1); - expect(table.prop('onFilter')).toBeDefined(); - expect(table.prop('isDataChanged')).toEqual(instance.state.isDataChanged); - }); - }); - - describe('componentWillReceiveProps', () => { - let nextProps; - - describe('when props.store.filters is same as current state.currFilters', () => { - beforeEach(() => { - nextProps = createTableProps(); - instance.componentWillReceiveProps(nextProps); - }); - - it('should setting isDataChanged as false (Temporary solution)', () => { - expect(instance.state.isDataChanged).toBeFalsy(); - }); - }); - - describe('when props.isDataChanged is true', () => { - beforeEach(() => { - nextProps = createTableProps({ isDataChanged: true }); - instance.componentWillReceiveProps(nextProps); - }); - - it('should setting isDataChanged as true', () => { - expect(instance.state.isDataChanged).toBeTruthy(); - }); - }); - - describe('when props.store.filters is different from current state.currFilters', () => { - const nextData = []; - - beforeEach(() => { - nextProps = createTableProps(); - nextProps.store.filters = { price: { filterVal: 20, filterType: FILTER_TYPE.TEXT } }; - nextProps.store.setAllData(nextData); - instance.componentWillReceiveProps(nextProps); - }); - - it('should setting states correctly', () => { - expect(nextProps.store.filteredData).toEqual(nextData); - expect(instance.state.isDataChanged).toBeTruthy(); - expect(instance.state.currFilters).toBe(nextProps.store.filters); - }); - }); - - describe('when remote filter is enabled', () => { - let props; - const nextData = []; - - beforeEach(() => { - props = createTableProps({ remote: { filter: true } }); - createFilterWrapper(props); - nextProps = createTableProps({ remote: { filter: true } }); - nextProps.store.setAllData(nextData); - instance.componentWillReceiveProps(nextProps); - }); - - it('should setting states correctly', () => { - expect(nextProps.store.filteredData).toEqual(nextData); - expect(instance.state.isDataChanged).toBeTruthy(); - expect(instance.state.currFilters).toBe(nextProps.store.filters); - }); - }); - }); - - describe('onFilter', () => { - let props; - - beforeEach(() => { - props = createTableProps(); - createFilterWrapper(props); - }); - - describe('when filterVal is empty or undefined', () => { - const filterVals = ['', undefined, []]; - - it('should setting store object correctly', () => { - filterVals.forEach((filterVal) => { - instance.onFilter(props.columns[1], FILTER_TYPE.TEXT)(filterVal); - expect(props.store.filtering).toBeFalsy(); - }); - }); - - it('should setting state correctly', () => { - filterVals.forEach((filterVal) => { - instance.onFilter(props.columns[1], FILTER_TYPE.TEXT)(filterVal); - expect(instance.state.isDataChanged).toBeTruthy(); - expect(Object.keys(instance.state.currFilters)).toHaveLength(0); - }); - }); - }); - - describe('when filterVal is existing', () => { - const filterVal = '3'; - - it('should setting store object correctly', () => { - instance.onFilter(props.columns[1], FILTER_TYPE.TEXT)(filterVal); - expect(props.store.filters).toEqual(instance.state.currFilters); - }); - - it('should setting state correctly', () => { - instance.onFilter(props.columns[1], FILTER_TYPE.TEXT)(filterVal); - expect(instance.state.isDataChanged).toBeTruthy(); - expect(Object.keys(instance.state.currFilters)).toHaveLength(1); - }); - }); - - describe('when remote filter is enabled', () => { - const filterVal = '3'; - - beforeEach(() => { - props = createTableProps(); - props.remote = { filter: true }; - createFilterWrapper(props); - instance.onFilter(props.columns[1], FILTER_TYPE.TEXT)(filterVal); - }); - - it('should not setting store object correctly', () => { - expect(props.store.filters).not.toEqual(instance.state.currFilters); - }); - - it('should not setting state', () => { - expect(instance.state.isDataChanged).toBeFalsy(); - expect(Object.keys(instance.state.currFilters)).toHaveLength(0); - }); - - it('should calling props.onRemoteFilterChange correctly', () => { - expect(onTableChangeCB.calledOnce).toBeTruthy(); - }); - }); - - describe('combination', () => { - it('should setting store object correctly', () => { - instance.onFilter(props.columns[1], FILTER_TYPE.TEXT)('3'); - expect(props.store.filters).toEqual(instance.state.currFilters); - expect(instance.state.isDataChanged).toBeTruthy(); - expect(Object.keys(instance.state.currFilters)).toHaveLength(1); - - instance.onFilter(props.columns[1], FILTER_TYPE.TEXT)('2'); - expect(props.store.filters).toEqual(instance.state.currFilters); - expect(instance.state.isDataChanged).toBeTruthy(); - expect(Object.keys(instance.state.currFilters)).toHaveLength(1); - - instance.onFilter(props.columns[2], FILTER_TYPE.TEXT)('2'); - expect(props.store.filters).toEqual(instance.state.currFilters); - expect(instance.state.isDataChanged).toBeTruthy(); - expect(Object.keys(instance.state.currFilters)).toHaveLength(2); - - instance.onFilter(props.columns[2], FILTER_TYPE.TEXT)(''); - expect(props.store.filters).toEqual(instance.state.currFilters); - expect(instance.state.isDataChanged).toBeTruthy(); - expect(Object.keys(instance.state.currFilters)).toHaveLength(1); - - instance.onFilter(props.columns[1], FILTER_TYPE.TEXT)(''); - expect(props.store.filters).toEqual(instance.state.currFilters); - expect(instance.state.isDataChanged).toBeTruthy(); - expect(Object.keys(instance.state.currFilters)).toHaveLength(0); - }); - }); - }); -}); diff --git a/packages/react-bootstrap-table2-paginator/test/context.test.js b/packages/react-bootstrap-table2-paginator/test/context.test.js new file mode 100644 index 0000000..10820b5 --- /dev/null +++ b/packages/react-bootstrap-table2-paginator/test/context.test.js @@ -0,0 +1,769 @@ +import 'jsdom-global/register'; +import React from 'react'; +import { shallow } from 'enzyme'; +import BootstrapTable from 'react-bootstrap-table-next/src/bootstrap-table'; + +import Pagination from '../src/pagination'; +import Const from '../src/const'; +import createPaginationContext from '../src/context'; +import paginationFactory from '../index'; + +const data = []; +for (let i = 0; i < 100; i += 1) { + data.push({ + id: i, + name: `itme name ${i}` + }); +} + +describe('PaginationContext', () => { + let wrapper; + let PaginationContext; + + const columns = [{ + dataField: 'id', + text: 'ID' + }, { + dataField: 'name', + text: 'Name' + }]; + + const defaultPagination = { options: {} }; + + const mockBase = jest.fn((props => ( + + ))); + + const handleRemotePaginationChange = jest.fn(); + + function shallowContext( + customPagination = defaultPagination, + enableRemote = false + ) { + mockBase.mockReset(); + handleRemotePaginationChange.mockReset(); + PaginationContext = createPaginationContext( + jest.fn().mockReturnValue(enableRemote), + handleRemotePaginationChange + ); + + return ( + + + { + paginationProps => mockBase(paginationProps) + } + + + ); + } + + describe('default render', () => { + beforeEach(() => { + wrapper = shallow(shallowContext()); + wrapper.render(); + }); + + it('should have correct Provider property after calling createPaginationContext', () => { + expect(PaginationContext.Provider).toBeDefined(); + }); + + it('should have correct Consumer property after calling createPaginationContext', () => { + expect(PaginationContext.Consumer).toBeDefined(); + }); + + it('should have correct currPage', () => { + expect(wrapper.instance().currPage).toEqual(Const.PAGE_START_INDEX); + }); + + it('should have correct currSizePerPage', () => { + expect(wrapper.instance().currSizePerPage).toEqual(Const.SIZE_PER_PAGE_LIST[0]); + }); + + it('should render Pagination component correctly', () => { + expect(wrapper.length).toBe(1); + const instance = wrapper.instance(); + const pagination = wrapper.find(Pagination); + expect(pagination).toHaveLength(1); + expect(pagination.prop('dataSize')).toEqual(data.length); + expect(pagination.prop('currPage')).toEqual(instance.currPage); + expect(pagination.prop('currSizePerPage')).toEqual(instance.currSizePerPage); + expect(pagination.prop('onPageChange')).toEqual(instance.handleChangePage); + expect(pagination.prop('onSizePerPageChange')).toEqual(instance.handleChangeSizePerPage); + expect(pagination.prop('sizePerPageList')).toEqual(Const.SIZE_PER_PAGE_LIST); + expect(pagination.prop('paginationSize')).toEqual(Const.PAGINATION_SIZE); + expect(pagination.prop('pageStartIndex')).toEqual(Const.PAGE_START_INDEX); + expect(pagination.prop('withFirstAndLast')).toEqual(Const.With_FIRST_AND_LAST); + expect(pagination.prop('alwaysShowAllBtns')).toEqual(Const.SHOW_ALL_PAGE_BTNS); + expect(pagination.prop('firstPageText')).toEqual(Const.FIRST_PAGE_TEXT); + expect(pagination.prop('prePageText')).toEqual(Const.PRE_PAGE_TEXT); + expect(pagination.prop('nextPageText')).toEqual(Const.NEXT_PAGE_TEXT); + expect(pagination.prop('lastPageText')).toEqual(Const.LAST_PAGE_TEXT); + expect(pagination.prop('firstPageTitle')).toEqual(Const.FIRST_PAGE_TITLE); + expect(pagination.prop('prePageTitle')).toEqual(Const.PRE_PAGE_TITLE); + expect(pagination.prop('nextPageTitle')).toEqual(Const.NEXT_PAGE_TITLE); + expect(pagination.prop('lastPageTitle')).toEqual(Const.LAST_PAGE_TITLE); + expect(pagination.prop('hideSizePerPage')).toEqual(Const.HIDE_SIZE_PER_PAGE); + expect(pagination.prop('hideSizePerPage')).toEqual(Const.HIDE_SIZE_PER_PAGE); + expect(pagination.prop('paginationTotalRenderer')).toBeNull(); + }); + + it('should pass correct cell editing props to children element', () => { + expect(mockBase.mock.calls[0][0].data).toHaveLength(Const.SIZE_PER_PAGE_LIST[0]); + }); + }); + + describe('componentWillReceiveProps', () => { + let instance; + let nextProps; + + describe('when nextProps.pagination.options.page is existing', () => { + const onPageChange = jest.fn(); + afterEach(() => { + onPageChange.mockReset(); + }); + + describe('and if it is different with currPage', () => { + beforeEach(() => { + wrapper = shallow(shallowContext()); + instance = wrapper.instance(); + wrapper.render(); + nextProps = { + pagination: { + options: { + page: 2, + onPageChange + } + } + }; + instance.componentWillReceiveProps(nextProps); + }); + + it('should call options.onPageChange', () => { + expect(onPageChange).toHaveBeenCalledTimes(1); + expect(onPageChange).toHaveBeenCalledWith( + instance.currPage, + instance.currSizePerPage + ); + }); + + it('should set correct currPage', () => { + expect(instance.currPage).toEqual(nextProps.pagination.options.page); + }); + }); + + describe('and if it is same as currPage', () => { + beforeEach(() => { + wrapper = shallow(shallowContext()); + instance = wrapper.instance(); + wrapper.render(); + nextProps = { + pagination: { + options: { + page: 1, + onPageChange + } + } + }; + instance.componentWillReceiveProps(nextProps); + }); + + it('shouldn\'t call options.onPageChange', () => { + expect(onPageChange).not.toHaveBeenCalled(); + }); + + it('should have correct currPage', () => { + expect(instance.currPage).toEqual(nextProps.pagination.options.page); + }); + }); + }); + + describe('when nextProps.pagination.options.page is not existing', () => { + beforeEach(() => { + wrapper = shallow(shallowContext({ + ...defaultPagination, + page: 3 + })); + instance = wrapper.instance(); + wrapper.render(); + nextProps = { pagination: defaultPagination }; + instance.componentWillReceiveProps(nextProps); + }); + + it('should not set currPage', () => { + expect(instance.currPage).toEqual(3); + }); + }); + + describe('when nextProps.pagination.options.sizePerPage is existing', () => { + const onPageChange = jest.fn(); + afterEach(() => { + onPageChange.mockReset(); + }); + + describe('and if it is different with currSizePerPage', () => { + beforeEach(() => { + wrapper = shallow(shallowContext()); + instance = wrapper.instance(); + wrapper.render(); + nextProps = { + pagination: { + options: { + sizePerPage: Const.SIZE_PER_PAGE_LIST[2], + onPageChange + } + } + }; + instance.componentWillReceiveProps(nextProps); + }); + + it('should call options.onPageChange', () => { + expect(onPageChange).toHaveBeenCalledTimes(1); + expect(onPageChange).toHaveBeenCalledWith( + instance.currPage, + instance.currSizePerPage + ); + }); + + it('should set correct currSizePerPage', () => { + expect(instance.currSizePerPage).toEqual(nextProps.pagination.options.sizePerPage); + }); + }); + + describe('and if it is same as currSizePerPage', () => { + beforeEach(() => { + wrapper = shallow(shallowContext()); + instance = wrapper.instance(); + wrapper.render(); + nextProps = { + pagination: { + options: { + sizePerPage: Const.SIZE_PER_PAGE_LIST[0], + onPageChange + } + } + }; + instance.componentWillReceiveProps(nextProps); + }); + + it('shouldn\'t call options.onPageChange', () => { + expect(onPageChange).not.toHaveBeenCalled(); + }); + + it('should have correct currSizePerPage', () => { + expect(instance.currSizePerPage).toEqual(nextProps.pagination.options.sizePerPage); + }); + }); + }); + + describe('when nextProps.pagination.options.sizePerPage is not existing', () => { + beforeEach(() => { + wrapper = shallow(shallowContext({ + ...defaultPagination, + sizePerPage: Const.SIZE_PER_PAGE_LIST[2] + })); + instance = wrapper.instance(); + wrapper.render(); + nextProps = { pagination: defaultPagination }; + instance.componentWillReceiveProps(nextProps); + }); + + it('should not set currPage', () => { + expect(instance.currSizePerPage).toEqual(Const.SIZE_PER_PAGE_LIST[2]); + }); + }); + }); + + describe('handleChangePage', () => { + let instance; + const newPage = 3; + + describe('should update component correctly', () => { + beforeEach(() => { + wrapper = shallow(shallowContext()); + instance = wrapper.instance(); + jest.spyOn(instance, 'forceUpdate'); + instance.handleChangePage(newPage); + }); + + it('', () => { + expect(instance.currPage).toEqual(newPage); + expect(instance.forceUpdate).toHaveBeenCalledTimes(1); + }); + }); + + describe('if options.onPageChange is defined', () => { + const onPageChange = jest.fn(); + beforeEach(() => { + onPageChange.mockClear(); + wrapper = shallow(shallowContext({ + ...defaultPagination, + onPageChange + })); + instance = wrapper.instance(); + jest.spyOn(instance, 'forceUpdate'); + instance.handleChangePage(newPage); + }); + + it('should still update component correctly', () => { + expect(instance.currPage).toEqual(newPage); + expect(instance.forceUpdate).toHaveBeenCalledTimes(1); + }); + + it('should call options.onPageChange correctly', () => { + expect(onPageChange).toHaveBeenCalledTimes(1); + expect(onPageChange).toHaveBeenCalledWith(newPage, instance.currSizePerPage); + }); + }); + + describe('if remote pagination is enable', () => { + beforeEach(() => { + wrapper = shallow(shallowContext({ + ...defaultPagination + }, true)); + instance = wrapper.instance(); + jest.spyOn(instance, 'forceUpdate'); + instance.handleChangePage(newPage); + }); + + it('should still update component correctly', () => { + expect(instance.currPage).toEqual(newPage); + expect(instance.forceUpdate).toHaveBeenCalledTimes(0); + }); + + it('should call handleRemotePageChange correctly', () => { + expect(handleRemotePaginationChange).toHaveBeenCalledTimes(1); + expect(handleRemotePaginationChange) + .toHaveBeenCalledWith(newPage, instance.currSizePerPage); + }); + }); + }); + + describe('handleChangeSizePerPage', () => { + let instance; + const newPage = 2; + const newSizePerPage = 15; + + describe('should update component correctly', () => { + beforeEach(() => { + wrapper = shallow(shallowContext()); + instance = wrapper.instance(); + jest.spyOn(instance, 'forceUpdate'); + instance.handleChangeSizePerPage(newSizePerPage, newPage); + }); + + it('', () => { + expect(instance.currPage).toEqual(newPage); + expect(instance.currSizePerPage).toEqual(newSizePerPage); + expect(instance.forceUpdate).toHaveBeenCalledTimes(1); + }); + }); + + describe('if options.onSizePerPageChange is defined', () => { + const onSizePerPageChange = jest.fn(); + beforeEach(() => { + onSizePerPageChange.mockClear(); + wrapper = shallow(shallowContext({ + ...defaultPagination, + onSizePerPageChange + })); + instance = wrapper.instance(); + jest.spyOn(instance, 'forceUpdate'); + instance.handleChangeSizePerPage(newSizePerPage, newPage); + }); + + it('should still update component correctly', () => { + expect(instance.currPage).toEqual(newPage); + expect(instance.currSizePerPage).toEqual(newSizePerPage); + expect(instance.forceUpdate).toHaveBeenCalledTimes(1); + }); + + it('should call options.onSizePerPageChange correctly', () => { + expect(onSizePerPageChange).toHaveBeenCalledTimes(1); + expect(onSizePerPageChange).toHaveBeenCalledWith(newSizePerPage, newPage); + }); + }); + + describe('if remote pagination is enable', () => { + beforeEach(() => { + wrapper = shallow(shallowContext({ + ...defaultPagination + }, true)); + instance = wrapper.instance(); + jest.spyOn(instance, 'forceUpdate'); + instance.handleChangeSizePerPage(newSizePerPage, newPage); + }); + + it('should still update component correctly', () => { + expect(instance.currPage).toEqual(newPage); + expect(instance.currSizePerPage).toEqual(newSizePerPage); + expect(instance.forceUpdate).toHaveBeenCalledTimes(0); + }); + + it('should call handleRemotePageChange correctly', () => { + expect(handleRemotePaginationChange).toHaveBeenCalledTimes(1); + expect(handleRemotePaginationChange) + .toHaveBeenCalledWith(newPage, newSizePerPage); + }); + }); + }); + + describe('when options.page is defined', () => { + const page = 3; + + beforeEach(() => { + wrapper = shallow(shallowContext({ + ...defaultPagination, + page + })); + wrapper.render(); + }); + + it('should set correct currPage', () => { + expect(wrapper.instance().currPage).toEqual(page); + }); + + it('should rendering Pagination correctly', () => { + const pagination = wrapper.find(Pagination); + expect(pagination.length).toBe(1); + expect(pagination.prop('currPage')).toEqual(page); + }); + }); + + describe('when options.sizePerPage is defined', () => { + const sizePerPage = Const.SIZE_PER_PAGE_LIST[2]; + + beforeEach(() => { + wrapper = shallow(shallowContext({ + ...defaultPagination, + sizePerPage + })); + wrapper.render(); + }); + + it('should set correct currSizePerPage', () => { + expect(wrapper.instance().currSizePerPage).toEqual(sizePerPage); + }); + + it('should rendering Pagination correctly', () => { + const pagination = wrapper.find(Pagination); + expect(pagination.length).toBe(1); + expect(pagination.prop('currSizePerPage')).toEqual(sizePerPage); + }); + }); + + describe('when options.totalSize is defined', () => { + const totalSize = 100; + + beforeEach(() => { + wrapper = shallow(shallowContext({ + ...defaultPagination, + totalSize + })); + wrapper.render(); + }); + + it('should rendering Pagination correctly', () => { + const pagination = wrapper.find(Pagination); + expect(pagination.length).toBe(1); + expect(pagination.prop('dataSize')).toEqual(totalSize); + }); + }); + + describe('when options.showTotal is defined', () => { + const showTotal = true; + + beforeEach(() => { + wrapper = shallow(shallowContext({ + ...defaultPagination, + showTotal + })); + wrapper.render(); + }); + + it('should rendering Pagination correctly', () => { + const pagination = wrapper.find(Pagination); + expect(pagination.length).toBe(1); + expect(pagination.prop('showTotal')).toEqual(showTotal); + }); + }); + + describe('when options.pageStartIndex is defined', () => { + const pageStartIndex = -1; + + beforeEach(() => { + wrapper = shallow(shallowContext({ + ...defaultPagination, + pageStartIndex + })); + wrapper.render(); + }); + + it('should rendering Pagination correctly', () => { + const pagination = wrapper.find(Pagination); + expect(pagination.length).toBe(1); + expect(pagination.prop('pageStartIndex')).toEqual(pageStartIndex); + }); + }); + + describe('when options.sizePerPageList is defined', () => { + const sizePerPageList = [10, 40]; + + beforeEach(() => { + wrapper = shallow(shallowContext({ + ...defaultPagination, + sizePerPageList + })); + wrapper.render(); + }); + + it('should rendering Pagination correctly', () => { + const pagination = wrapper.find(Pagination); + expect(pagination.length).toBe(1); + expect(pagination.prop('sizePerPageList')).toEqual(sizePerPageList); + }); + }); + + describe('when options.paginationSize is defined', () => { + const paginationSize = 10; + + beforeEach(() => { + wrapper = shallow(shallowContext({ + ...defaultPagination, + paginationSize + })); + wrapper.render(); + }); + + it('should rendering Pagination correctly', () => { + const pagination = wrapper.find(Pagination); + expect(pagination.length).toBe(1); + expect(pagination.prop('paginationSize')).toEqual(paginationSize); + }); + }); + + describe('when options.withFirstAndLast is defined', () => { + const withFirstAndLast = false; + + beforeEach(() => { + wrapper = shallow(shallowContext({ + ...defaultPagination, + withFirstAndLast + })); + wrapper.render(); + }); + + it('should rendering Pagination correctly', () => { + const pagination = wrapper.find(Pagination); + expect(pagination.length).toBe(1); + expect(pagination.prop('withFirstAndLast')).toEqual(withFirstAndLast); + }); + }); + + describe('when options.alwaysShowAllBtns is defined', () => { + const alwaysShowAllBtns = true; + + beforeEach(() => { + wrapper = shallow(shallowContext({ + ...defaultPagination, + alwaysShowAllBtns + })); + wrapper.render(); + }); + + it('should rendering Pagination correctly', () => { + const pagination = wrapper.find(Pagination); + expect(pagination.length).toBe(1); + expect(pagination.prop('alwaysShowAllBtns')).toEqual(alwaysShowAllBtns); + }); + }); + + describe('when options.firstPageText is defined', () => { + const firstPageText = '1st'; + + beforeEach(() => { + wrapper = shallow(shallowContext({ + ...defaultPagination, + firstPageText + })); + wrapper.render(); + }); + + it('should rendering Pagination correctly', () => { + const pagination = wrapper.find(Pagination); + expect(pagination.length).toBe(1); + expect(pagination.prop('firstPageText')).toEqual(firstPageText); + }); + }); + + describe('when options.prePageText is defined', () => { + const prePageText = 'PRE'; + + beforeEach(() => { + wrapper = shallow(shallowContext({ + ...defaultPagination, + prePageText + })); + wrapper.render(); + }); + + it('should rendering Pagination correctly', () => { + const pagination = wrapper.find(Pagination); + expect(pagination.length).toBe(1); + expect(pagination.prop('prePageText')).toEqual(prePageText); + }); + }); + + describe('when options.nextPageText is defined', () => { + const nextPageText = 'NEXT'; + + beforeEach(() => { + wrapper = shallow(shallowContext({ + ...defaultPagination, + nextPageText + })); + wrapper.render(); + }); + + it('should rendering Pagination correctly', () => { + const pagination = wrapper.find(Pagination); + expect(pagination.length).toBe(1); + expect(pagination.prop('nextPageText')).toEqual(nextPageText); + }); + }); + + describe('when options.lastPageText is defined', () => { + const lastPageText = 'LAST'; + + beforeEach(() => { + wrapper = shallow(shallowContext({ + ...defaultPagination, + lastPageText + })); + wrapper.render(); + }); + + it('should rendering Pagination correctly', () => { + const pagination = wrapper.find(Pagination); + expect(pagination.length).toBe(1); + expect(pagination.prop('lastPageText')).toEqual(lastPageText); + }); + }); + + describe('when options.firstPageTitle is defined', () => { + const firstPageTitle = '1st'; + + beforeEach(() => { + wrapper = shallow(shallowContext({ + ...defaultPagination, + firstPageTitle + })); + wrapper.render(); + }); + + it('should rendering Pagination correctly', () => { + const pagination = wrapper.find(Pagination); + expect(pagination.length).toBe(1); + expect(pagination.prop('firstPageTitle')).toEqual(firstPageTitle); + }); + }); + + describe('when options.prePageTitle is defined', () => { + const prePageTitle = 'PRE'; + + beforeEach(() => { + wrapper = shallow(shallowContext({ + ...defaultPagination, + prePageTitle + })); + wrapper.render(); + }); + + it('should rendering Pagination correctly', () => { + const pagination = wrapper.find(Pagination); + expect(pagination.length).toBe(1); + expect(pagination.prop('prePageTitle')).toEqual(prePageTitle); + }); + }); + + describe('when options.nextPageTitle is defined', () => { + const nextPageTitle = 'NEXT'; + + beforeEach(() => { + wrapper = shallow(shallowContext({ + ...defaultPagination, + nextPageTitle + })); + wrapper.render(); + }); + + it('should rendering Pagination correctly', () => { + const pagination = wrapper.find(Pagination); + expect(pagination.length).toBe(1); + expect(pagination.prop('nextPageTitle')).toEqual(nextPageTitle); + }); + }); + + describe('when options.lastPageTitle is defined', () => { + const lastPageTitle = 'nth'; + + beforeEach(() => { + wrapper = shallow(shallowContext({ + ...defaultPagination, + lastPageTitle + })); + wrapper.render(); + }); + + it('should rendering Pagination correctly', () => { + const pagination = wrapper.find(Pagination); + expect(pagination.length).toBe(1); + expect(pagination.prop('lastPageTitle')).toEqual(lastPageTitle); + }); + }); + + describe('when options.hideSizePerPage is defined', () => { + const hideSizePerPage = true; + + beforeEach(() => { + wrapper = shallow(shallowContext({ + ...defaultPagination, + hideSizePerPage + })); + wrapper.render(); + }); + + it('should rendering Pagination correctly', () => { + const pagination = wrapper.find(Pagination); + expect(pagination.length).toBe(1); + expect(pagination.prop('hideSizePerPage')).toEqual(hideSizePerPage); + }); + }); + + describe('when options.hidePageListOnlyOnePage is defined', () => { + const hidePageListOnlyOnePage = true; + + beforeEach(() => { + wrapper = shallow(shallowContext({ + ...defaultPagination, + hidePageListOnlyOnePage + })); + wrapper.render(); + }); + + it('should rendering Pagination correctly', () => { + const pagination = wrapper.find(Pagination); + expect(pagination.length).toBe(1); + expect(pagination.prop('hidePageListOnlyOnePage')).toEqual(hidePageListOnlyOnePage); + }); + }); +}); diff --git a/packages/react-bootstrap-table2-paginator/test/page.test.js b/packages/react-bootstrap-table2-paginator/test/page.test.js index bd63574..28ab1e1 100644 --- a/packages/react-bootstrap-table2-paginator/test/page.test.js +++ b/packages/react-bootstrap-table2-paginator/test/page.test.js @@ -1,9 +1,8 @@ -import Store from 'react-bootstrap-table-next/src/store'; + import { getByCurrPage, alignPage } from '../src/page'; describe('Page Functions', () => { let data; - let store; const params = [ // [page, sizePerPage, pageStartIndex] [1, 10, 1], @@ -23,27 +22,21 @@ describe('Page Functions', () => { for (let i = 0; i < 100; i += 1) { data.push({ id: i, name: `test_name${i}` }); } - store = new Store('id'); - store.data = data; }); it('should always return correct data', () => { params.forEach(([page, sizePerPage, pageStartIndex]) => { - store.page = page; - store.sizePerPage = sizePerPage; - const rows = getByCurrPage(store, pageStartIndex); + const rows = getByCurrPage(data, page, sizePerPage, pageStartIndex); expect(rows).toBeDefined(); expect(Array.isArray(rows)).toBeTruthy(); expect(rows.every(row => !!row)).toBeTruthy(); }); }); - it('should return empty array when store.data is empty', () => { - store.data = []; + it('should return empty array when data is empty', () => { + data = []; params.forEach(([page, sizePerPage, pageStartIndex]) => { - store.page = page; - store.sizePerPage = sizePerPage; - const rows = getByCurrPage(store, pageStartIndex); + const rows = getByCurrPage(data, page, sizePerPage, pageStartIndex); expect(rows).toHaveLength(0); }); }); @@ -52,19 +45,17 @@ describe('Page Functions', () => { describe('alignPage', () => { const pageStartIndex = 1; const sizePerPage = 10; + const page = 2; describe('if the length of store.data is less than the end page index', () => { beforeEach(() => { data = []; for (let i = 0; i < 15; i += 1) { data.push({ id: i, name: `test_name${i}` }); } - store = new Store('id'); - store.data = data; - store.page = 2; }); it('should return pageStartIndex argument', () => { - expect(alignPage(store, pageStartIndex, sizePerPage)).toEqual(pageStartIndex); + expect(alignPage(data, page, sizePerPage, pageStartIndex)).toEqual(pageStartIndex); }); }); @@ -74,13 +65,10 @@ describe('Page Functions', () => { for (let i = 0; i < 30; i += 1) { data.push({ id: i, name: `test_name${i}` }); } - store = new Store('id'); - store.data = data; - store.page = 2; }); it('should return current page', () => { - expect(alignPage(store, pageStartIndex, sizePerPage)).toEqual(store.page); + expect(alignPage(data, page, sizePerPage, pageStartIndex)).toEqual(page); }); }); }); diff --git a/packages/react-bootstrap-table2-paginator/test/wrapper.test.js b/packages/react-bootstrap-table2-paginator/test/wrapper.test.js deleted file mode 100644 index f636fe3..0000000 --- a/packages/react-bootstrap-table2-paginator/test/wrapper.test.js +++ /dev/null @@ -1,570 +0,0 @@ -import React from 'react'; -import sinon from 'sinon'; -import { shallow } from 'enzyme'; - - -import BootstrapTable from 'react-bootstrap-table-next/src/bootstrap-table'; -import remoteResolver from 'react-bootstrap-table-next/src/props-resolver/remote-resolver'; -import Store from 'react-bootstrap-table-next/src/store'; -import paginator from '..'; -import wrapperFactory from '../src/wrapper'; -import Pagination from '../src/pagination'; -import Const from '../src/const'; - -const data = []; -for (let i = 0; i < 100; i += 1) { - data.push({ - id: i, - name: `item name ${i}` - }); -} - -describe('Wrapper', () => { - let wrapper; - let instance; - const onTableChangeCB = sinon.stub(); - - afterEach(() => { - onTableChangeCB.reset(); - }); - - const createTableProps = (props = {}) => { - const tableProps = { - keyField: 'id', - columns: [{ - dataField: 'id', - text: 'ID' - }, { - dataField: 'name', - text: 'Name' - }], - data, - pagination: paginator(props.options), - store: new Store('id'), - onTableChange: onTableChangeCB - }; - tableProps.store.data = data; - return tableProps; - }; - - const PaginationWrapper = wrapperFactory(BootstrapTable, { - remoteResolver - }); - - const createPaginationWrapper = (props, renderFragment = true) => { - wrapper = shallow(); - instance = wrapper.instance(); - if (renderFragment) { - const fragment = instance.render(); - wrapper = shallow(
{ fragment }
); - } - }; - - describe('default pagination', () => { - const props = createTableProps(); - - beforeEach(() => { - createPaginationWrapper(props); - }); - - it('should render correctly', () => { - expect(wrapper.length).toBe(1); - }); - - it('should initialize state correctly', () => { - expect(instance.state.currPage).toBeDefined(); - expect(instance.state.currPage).toEqual(Const.PAGE_START_INDEX); - expect(instance.state.currSizePerPage).toBeDefined(); - expect(instance.state.currSizePerPage).toEqual(Const.SIZE_PER_PAGE_LIST[0]); - }); - - it('should save page and sizePerPage to the store correctly', () => { - expect(props.store.page).toBe(instance.state.currPage); - expect(props.store.sizePerPage).toBe(instance.state.currSizePerPage); - }); - - it('should render BootstrapTable correctly', () => { - const table = wrapper.find(BootstrapTable); - expect(table.length).toBe(1); - expect(table.prop('data').length).toEqual(instance.state.currSizePerPage); - }); - - it('should render Pagination correctly', () => { - const pagination = wrapper.find(Pagination); - expect(pagination.length).toBe(1); - expect(pagination.prop('dataSize')).toEqual(props.store.data.length); - expect(pagination.prop('currPage')).toEqual(instance.state.currPage); - expect(pagination.prop('currSizePerPage')).toEqual(instance.state.currSizePerPage); - expect(pagination.prop('onPageChange')).toEqual(instance.handleChangePage); - expect(pagination.prop('onSizePerPageChange')).toEqual(instance.handleChangeSizePerPage); - expect(pagination.prop('sizePerPageList')).toEqual(Const.SIZE_PER_PAGE_LIST); - expect(pagination.prop('paginationSize')).toEqual(Const.PAGINATION_SIZE); - expect(pagination.prop('pageStartIndex')).toEqual(Const.PAGE_START_INDEX); - expect(pagination.prop('withFirstAndLast')).toEqual(Const.With_FIRST_AND_LAST); - expect(pagination.prop('alwaysShowAllBtns')).toEqual(Const.SHOW_ALL_PAGE_BTNS); - expect(pagination.prop('firstPageText')).toEqual(Const.FIRST_PAGE_TEXT); - expect(pagination.prop('prePageText')).toEqual(Const.PRE_PAGE_TEXT); - expect(pagination.prop('nextPageText')).toEqual(Const.NEXT_PAGE_TEXT); - expect(pagination.prop('lastPageText')).toEqual(Const.LAST_PAGE_TEXT); - expect(pagination.prop('firstPageTitle')).toEqual(Const.FIRST_PAGE_TITLE); - expect(pagination.prop('prePageTitle')).toEqual(Const.PRE_PAGE_TITLE); - expect(pagination.prop('nextPageTitle')).toEqual(Const.NEXT_PAGE_TITLE); - expect(pagination.prop('lastPageTitle')).toEqual(Const.LAST_PAGE_TITLE); - expect(pagination.prop('hideSizePerPage')).toEqual(Const.HIDE_SIZE_PER_PAGE); - expect(pagination.prop('showTotal')).toBeFalsy(); - }); - - describe('componentWillReceiveProps', () => { - let nextProps; - beforeEach(() => { - nextProps = createTableProps(); - }); - - describe('when options.page is existing', () => { - beforeEach(() => { - nextProps.pagination.options.page = 2; - instance.componentWillReceiveProps(nextProps); - }); - - it('should setting currPage state correctly', () => { - expect(instance.state.currPage).toEqual(nextProps.pagination.options.page); - }); - - it('should saving store.page correctly', () => { - expect(props.store.page).toEqual(instance.state.currPage); - }); - }); - - it('should not setting currPage state if options.page not existing', () => { - const { currPage } = instance.state; - instance.componentWillReceiveProps(nextProps); - expect(instance.state.currPage).toBe(currPage); - }); - - describe('when options.sizePerPage is existing', () => { - beforeEach(() => { - nextProps.pagination.options.sizePerPage = 20; - instance.componentWillReceiveProps(nextProps); - }); - - it('should setting currSizePerPage state correctly', () => { - expect(instance.state.currSizePerPage).toEqual(nextProps.pagination.options.sizePerPage); - }); - - it('should saving store.sizePerPage correctly', () => { - expect(props.store.sizePerPage).toEqual(instance.state.currSizePerPage); - }); - }); - - it('should not setting currSizePerPage state if options.sizePerPage not existing', () => { - const { currSizePerPage } = instance.state; - instance.componentWillReceiveProps(nextProps); - expect(instance.state.currSizePerPage).toBe(currSizePerPage); - }); - - describe('when nextProps.isDataChanged is true', () => { - beforeEach(() => { - nextProps.isDataChanged = true; - instance.componentWillReceiveProps(nextProps); - }); - - it('should setting currPage state correctly', () => { - expect(instance.state.currPage).toBe(Const.PAGE_START_INDEX); - }); - - it('should saving store.page correctly', () => { - expect(props.store.page).toEqual(instance.state.currPage); - }); - }); - }); - }); - - describe('when options.page is defined', () => { - const page = 3; - const props = createTableProps({ options: { page } }); - beforeEach(() => { - createPaginationWrapper(props); - }); - - it('should setting correct state.currPage', () => { - expect(instance.state.currPage).toEqual(page); - }); - - it('should rendering Pagination correctly', () => { - const pagination = wrapper.find(Pagination); - expect(wrapper.length).toBe(1); - expect(pagination.length).toBe(1); - expect(pagination.prop('currPage')).toEqual(page); - }); - }); - - describe('when options.sizePerPage is defined', () => { - const sizePerPage = 30; - const props = createTableProps({ options: { sizePerPage } }); - beforeEach(() => { - createPaginationWrapper(props); - }); - - it('should setting correct state.currPage', () => { - expect(instance.state.currSizePerPage).toEqual(sizePerPage); - }); - - it('should rendering Pagination correctly', () => { - const pagination = wrapper.find(Pagination); - expect(wrapper.length).toBe(1); - expect(pagination.length).toBe(1); - expect(pagination.prop('currSizePerPage')).toEqual(sizePerPage); - }); - }); - - describe('when options.totalSize is defined', () => { - const totalSize = 100; - const props = createTableProps({ options: { totalSize } }); - beforeEach(() => { - createPaginationWrapper(props); - }); - - it('should rendering Pagination correctly', () => { - const pagination = wrapper.find(Pagination); - expect(wrapper.length).toBe(1); - expect(pagination.length).toBe(1); - expect(pagination.prop('dataSize')).toEqual(totalSize); - }); - }); - - describe('when options.showTotal is defined', () => { - const props = createTableProps({ options: { showTotal: true } }); - beforeEach(() => { - createPaginationWrapper(props); - }); - - it('should render Pagination correctly', () => { - const pagination = wrapper.find(Pagination); - expect(wrapper.length).toBe(1); - expect(pagination.length).toBe(1); - expect(pagination.prop('showTotal')).toBeTruthy(); - }); - }); - - describe('when options.pageStartIndex is defined', () => { - const pageStartIndex = -1; - const props = createTableProps({ options: { pageStartIndex } }); - beforeEach(() => { - createPaginationWrapper(props); - }); - - it('should setting correct state.currPage', () => { - expect(instance.state.currPage).toEqual(pageStartIndex); - }); - - it('should rendering Pagination correctly', () => { - const pagination = wrapper.find(Pagination); - expect(wrapper.length).toBe(1); - expect(pagination.length).toBe(1); - expect(pagination.prop('pageStartIndex')).toEqual(pageStartIndex); - }); - }); - - describe('when options.sizePerPageList is defined', () => { - const sizePerPageList = [10, 40]; - const props = createTableProps({ options: { sizePerPageList } }); - beforeEach(() => { - createPaginationWrapper(props); - }); - - it('should rendering Pagination correctly', () => { - const pagination = wrapper.find(Pagination); - expect(wrapper.length).toBe(1); - expect(pagination.length).toBe(1); - expect(pagination.prop('sizePerPageList')).toEqual(sizePerPageList); - }); - }); - - describe('when options.paginationSize is defined', () => { - const paginationSize = 10; - const props = createTableProps({ options: { paginationSize } }); - beforeEach(() => { - createPaginationWrapper(props); - }); - - it('should rendering Pagination correctly', () => { - const pagination = wrapper.find(Pagination); - expect(wrapper.length).toBe(1); - expect(pagination.length).toBe(1); - expect(pagination.prop('paginationSize')).toEqual(paginationSize); - }); - }); - - describe('when options.withFirstAndLast is defined', () => { - const withFirstAndLast = false; - const props = createTableProps({ options: { withFirstAndLast } }); - beforeEach(() => { - createPaginationWrapper(props); - }); - - it('should rendering Pagination correctly', () => { - const pagination = wrapper.find(Pagination); - expect(wrapper.length).toBe(1); - expect(pagination.length).toBe(1); - expect(pagination.prop('withFirstAndLast')).toEqual(withFirstAndLast); - }); - }); - - describe('when options.alwaysShowAllBtns is defined', () => { - const alwaysShowAllBtns = true; - const props = createTableProps({ options: { alwaysShowAllBtns } }); - beforeEach(() => { - createPaginationWrapper(props); - }); - - it('should rendering Pagination correctly', () => { - const pagination = wrapper.find(Pagination); - expect(wrapper.length).toBe(1); - expect(pagination.length).toBe(1); - expect(pagination.prop('alwaysShowAllBtns')).toEqual(alwaysShowAllBtns); - }); - }); - - describe('when options.firstPageText is defined', () => { - const firstPageText = '1st'; - const props = createTableProps({ options: { firstPageText } }); - beforeEach(() => { - createPaginationWrapper(props); - }); - - it('should rendering Pagination correctly', () => { - const pagination = wrapper.find(Pagination); - expect(wrapper.length).toBe(1); - expect(pagination.length).toBe(1); - expect(pagination.prop('firstPageText')).toEqual(firstPageText); - }); - }); - - describe('when options.prePageText is defined', () => { - const prePageText = 'PRE'; - const props = createTableProps({ options: { prePageText } }); - beforeEach(() => { - createPaginationWrapper(props); - }); - - it('should rendering Pagination correctly', () => { - const pagination = wrapper.find(Pagination); - expect(wrapper.length).toBe(1); - expect(pagination.length).toBe(1); - expect(pagination.prop('prePageText')).toEqual(prePageText); - }); - }); - - describe('when options.nextPageText is defined', () => { - const nextPageText = 'NEXT'; - const props = createTableProps({ options: { nextPageText } }); - beforeEach(() => { - createPaginationWrapper(props); - }); - - it('should rendering Pagination correctly', () => { - const pagination = wrapper.find(Pagination); - expect(wrapper.length).toBe(1); - expect(pagination.length).toBe(1); - expect(pagination.prop('nextPageText')).toEqual(nextPageText); - }); - }); - - describe('when options.lastPageText is defined', () => { - const lastPageText = 'nth'; - const props = createTableProps({ options: { lastPageText } }); - beforeEach(() => { - createPaginationWrapper(props); - }); - - it('should rendering Pagination correctly', () => { - const pagination = wrapper.find(Pagination); - expect(wrapper.length).toBe(1); - expect(pagination.length).toBe(1); - expect(pagination.prop('lastPageText')).toEqual(lastPageText); - }); - }); - - describe('when options.firstPageTitle is defined', () => { - const firstPageTitle = '1st'; - const props = createTableProps({ options: { firstPageTitle } }); - beforeEach(() => { - createPaginationWrapper(props); - }); - - it('should rendering Pagination correctly', () => { - const pagination = wrapper.find(Pagination); - expect(wrapper.length).toBe(1); - expect(pagination.length).toBe(1); - expect(pagination.prop('firstPageTitle')).toEqual(firstPageTitle); - }); - }); - - describe('when options.prePageTitle is defined', () => { - const prePageTitle = 'PRE'; - const props = createTableProps({ options: { prePageTitle } }); - beforeEach(() => { - createPaginationWrapper(props); - }); - - it('should rendering Pagination correctly', () => { - const pagination = wrapper.find(Pagination); - expect(wrapper.length).toBe(1); - expect(pagination.length).toBe(1); - expect(pagination.prop('prePageTitle')).toEqual(prePageTitle); - }); - }); - - describe('when options.nextPageTitle is defined', () => { - const nextPageTitle = 'NEXT'; - const props = createTableProps({ options: { nextPageTitle } }); - beforeEach(() => { - createPaginationWrapper(props); - }); - - it('should rendering Pagination correctly', () => { - const pagination = wrapper.find(Pagination); - expect(wrapper.length).toBe(1); - expect(pagination.length).toBe(1); - expect(pagination.prop('nextPageTitle')).toEqual(nextPageTitle); - }); - }); - - describe('when options.lastPageTitle is defined', () => { - const lastPageTitle = 'nth'; - const props = createTableProps({ options: { lastPageTitle } }); - beforeEach(() => { - createPaginationWrapper(props); - }); - - it('should rendering Pagination correctly', () => { - const pagination = wrapper.find(Pagination); - expect(wrapper.length).toBe(1); - expect(pagination.length).toBe(1); - expect(pagination.prop('lastPageTitle')).toEqual(lastPageTitle); - }); - }); - - describe('when options.hideSizePerPage is defined', () => { - const hideSizePerPage = true; - const props = createTableProps({ options: { hideSizePerPage } }); - beforeEach(() => { - createPaginationWrapper(props); - }); - - it('should rendering Pagination correctly', () => { - const pagination = wrapper.find(Pagination); - expect(wrapper.length).toBe(1); - expect(pagination.length).toBe(1); - expect(pagination.prop('hideSizePerPage')).toEqual(hideSizePerPage); - }); - }); - - describe('when options.hidePageListOnlyOnePage is defined', () => { - const hidePageListOnlyOnePage = true; - const props = createTableProps({ options: { hidePageListOnlyOnePage } }); - beforeEach(() => { - createPaginationWrapper(props); - }); - - it('should rendering Pagination correctly', () => { - const pagination = wrapper.find(Pagination); - expect(wrapper.length).toBe(1); - expect(pagination.length).toBe(1); - expect(pagination.prop('hidePageListOnlyOnePage')).toEqual(hidePageListOnlyOnePage); - }); - }); - - describe('handleChangePage', () => { - const newPage = 3; - const props = createTableProps({ options: { onPageChange: sinon.stub() } }); - beforeEach(() => { - createPaginationWrapper(props, false); - instance.handleChangePage(newPage); - }); - - afterEach(() => { - props.pagination.options.onPageChange.reset(); - }); - - it('should setting state.currPage correctly', () => { - expect(instance.state.currPage).toEqual(newPage); - }); - - it('should calling options.onPageChange correctly when it is defined', () => { - const { onPageChange } = props.pagination.options; - expect(onPageChange.calledOnce).toBeTruthy(); - expect(onPageChange.calledWith(newPage, instance.state.currSizePerPage)).toBeTruthy(); - }); - - it('should saving page and sizePerPage to store correctly', () => { - expect(props.store.page).toBe(newPage); - expect(props.store.sizePerPage).toBe(instance.state.currSizePerPage); - }); - - describe('when pagination remote is enable', () => { - beforeEach(() => { - props.remote = true; - createPaginationWrapper(props, false); - onTableChangeCB.reset(); - instance.handleChangePage(newPage); - }); - - it('should not setting state.currPage', () => { - expect(instance.state.currPage).not.toEqual(newPage); - }); - - it('should calling props.onRemotePageChange correctly', () => { - expect(onTableChangeCB.calledOnce).toBeTruthy(); - }); - }); - }); - - describe('handleChangeSizePerPage', () => { - const newPage = 2; - const newSizePerPage = 30; - const props = createTableProps({ options: { onSizePerPageChange: sinon.stub() } }); - beforeEach(() => { - createPaginationWrapper(props, false); - instance.handleChangeSizePerPage(newSizePerPage, newPage); - }); - - afterEach(() => { - props.pagination.options.onSizePerPageChange.reset(); - }); - - it('should setting state.currPage and state.currSizePerPage correctly', () => { - expect(instance.state.currPage).toEqual(newPage); - expect(instance.state.currSizePerPage).toEqual(newSizePerPage); - }); - - it('should calling options.onSizePerPageChange correctly when it is defined', () => { - const { onSizePerPageChange } = props.pagination.options; - expect(onSizePerPageChange.calledOnce).toBeTruthy(); - expect(onSizePerPageChange.calledWith(newSizePerPage, newPage)).toBeTruthy(); - }); - - it('should saving page and sizePerPage to store correctly', () => { - expect(props.store.page).toBe(newPage); - expect(props.store.sizePerPage).toBe(newSizePerPage); - }); - - describe('when pagination remote is enable', () => { - beforeEach(() => { - props.remote = true; - createPaginationWrapper(props, false); - onTableChangeCB.reset(); - instance.handleChangeSizePerPage(newSizePerPage, newPage); - }); - - it('should not setting state.currPage', () => { - expect(instance.state.currPage).not.toEqual(newPage); - expect(instance.state.currSizePerPage).not.toEqual(newSizePerPage); - }); - - it('should calling props.onRemotePageChange correctly', () => { - expect(onTableChangeCB.calledOnce).toBeTruthy(); - }); - }); - }); -});