Mingus.createTestCase('HeaderTest', {
testRender() {
const columnIndex = 0;
const column = fixtures.columns[columnIndex];
const rendered = this.renderComponent(
<Header
column={column}
columnIndex={columnIndex} />
);
const title = this.getChildren(rendered)[0];
this.assertIsType(rendered, 'th');
this.assertIsType(title, 'span');
this.assertEqual(title.props.title, 'This is the user id.');
},
testOnClick() {
const onHeaderClick = this.stub();
const columnIndex = 1;
const column = fixtures.columns[columnIndex];
const component = this.createComponent(
<Header
column={column}
columnIndex={columnIndex}
onHeaderClick={onHeaderClick} />
);
this.stub(component, 'setState');
component.onClick('mock evt');
this.assertEqual(onHeaderClick.callCount, 1);
this.assertEqual(component.setState.callCount, 1);
this.assertTrue(onHeaderClick.calledWith(
'mock evt',
column,
columnIndex,
undefined,
undefined,
1
));
this.assertTrue(component.setState.calledWith({numClicks: 1}));
},
testGetClassName() {
const columnIndex = 0;
const column = fixtures.columns[columnIndex];
const component = this.createComponent(
<Header
activeHeader={0}
column={column}
columnIndex={columnIndex} />
);
this.assertEqual(
component.getClassName(),
'react-ui-grid-header react-ui-grid-header-active'
);
}
});
Mingus.createTestCase('CellTest', {
testRender() {
const rendered = this.renderComponent(
<Cell
activeCell={[0, 0]}
columns={fixtures.columns}
column={fixtures.columns[0]}
record={fixtures.data[0]} />
);
this.assertIsType(rendered, 'td');
this.assertNumChildren(rendered, 1);
},
testColumnRenderer() {
const rendered = this.renderComponent(
<Cell
activeCell={[0, 0]}
columns={fixtures.columns}
column={fixtures.columns[1]}
columnIndex={5}
record={fixtures.data[0]}
rowIndex={4} />
);
const content = this.getChildren(this.getChildren(rendered)[0]);
this.assertSomeChildIsType(rendered, 'div');
this.assertNumChildren(rendered, 1);
this.assertEqual(content, 'My name is Cool McCool - column: 5 row: 4');
},
testOnClick() {
const onCellClick = this.stub();
const component = this.createComponent(
<Cell
activeCell={[0, 0]}
column={fixtures.columns[0]}
columnIndex={0}
onCellClick={onCellClick}
record={fixtures.data[0]}
rowIndex={0} />
);
this.stub(component, 'setState');
component.onClick('mock evt');
this.assertEqual(onCellClick.callCount, 1);
this.assertEqual(component.setState.callCount, 1);
this.assertTrue(onCellClick.calledWith(
'mock evt',
fixtures.columns[0],
0,
0,
fixtures.data[0],
1
));
this.assertTrue(component.setState.calledWith({
numClicks: 1
}));
},
testGetClassName() {
const component = this.createComponent(
<Cell
activeCell={[0, 0]}
column={fixtures.columns[0]}
columnIndex={0}
record={fixtures.data[0]}
rowIndex={0} />
);
this.assertEqual(
component.getClassName(),
'react-ui-grid-cell react-ui-grid-cell-active'
);
}
});
Mingus.createTestCase('DatePickerTest', {
testRender() {
const rendered = this.renderComponent(<DatePicker />);
this.assertIsType(rendered, 'div');
this.assertNumChildren(rendered, 3);
},
testComponentWillUnmount() {
const component = this.createComponent(<DatePicker />);
component.delayBlur = {cancel: this.stub()};
component.componentWillUnmount();
this.assertEqual(component.delayBlur.cancel.callCount, 1);
},
testRenderDefaultValue() {
const date = new Date(2015, 6, 1);
const rendered = this.renderComponent(
<DatePicker defaultValue={date} />
);
const input = this.getChildren(rendered)[0];
this.assertEqual(input.props.value, '2015-7-1');
},
testRenderOpenDropDown() {
const component = this.createComponent(<DatePicker />);
component.state.showCalendar = true;
this.assertHasClass(component.render(), 'react-ui-date-picker-open');
},
testOnBlur() {
const component = this.createComponent(<DatePicker />);
this.stub(component, 'hideCalendar');
component.onBlur();
this.assertEqual(component.hideCalendar.callCount, 1);
},
testOnBlurCanNotHide() {
const component = this.createComponent(<DatePicker />);
this.stub(component, 'hideCalendar');
component.canHideCalendar = false;
component.onBlur();
this.assertEqual(component.hideCalendar.callCount, 0);
},
testOnClearClick() {
const onClearClick = this.stub();
const component = this.createComponent(
<DatePicker onClearClick={onClearClick} />
);
const mockEvt = {stopPropagation: this.stub()};
this.stub(component, 'clear');
component.onClearClick(mockEvt);
this.assertEqual(mockEvt.stopPropagation.callCount, 1);
this.assertEqual(onClearClick.callCount, 1);
this.assertEqual(component.clear.callCount, 1);
this.assertTrue(onClearClick.calledWith(mockEvt));
},
testOnClick() {
const onClick = this.stub();
const component = this.createComponent(
<DatePicker onClick={onClick} />
);
this.stub(component, 'hideCalendar');
this.stub(component, 'showCalendar');
component.onClick('mock evt');
this.assertEqual(onClick.callCount, 1);
this.assertEqual(component.hideCalendar.callCount, 0);
this.assertEqual(component.showCalendar.callCount, 1);
this.assertTrue(onClick.calledWith('mock evt', false));
component.state.showCalendar = true;
component.onClick('mock evt');
this.assertEqual(onClick.callCount, 2);
this.assertEqual(component.showCalendar.callCount, 1);
this.assertEqual(component.hideCalendar.callCount, 1);
this.assertTrue(onClick.calledWith('mock evt', true));
},
testOnClickDisabled() {
const onClick = this.stub();
const component = this.createComponent(
<DatePicker disabled={true} onClick={onClick} />
);
this.stub(component, 'hideCalendar');
this.stub(component, 'showCalendar');
component.onClick('mock evt');
this.assertEqual(onClick.callCount, 0);
this.assertEqual(component.hideCalendar.callCount, 0);
this.assertEqual(component.showCalendar.callCount, 0);
},
testOnCalendarMouseDown() {
const component = this.createComponent(<DatePicker />);
this.assertTrue(component.canHideCalendar);
component.onCalendarMouseDown();
this.assertFalse(component.canHideCalendar);
},
testOnCalendarMouseUp() {
const component = this.createComponent(<DatePicker />);
component.canHideCalender = false;
component.onCalendarMouseUp();
this.assertTrue(component.canHideCalendar);
},
testOnCancelBlur() {
const component = this.createComponent(<DatePicker />);
const mockEvt = {stopPropagation: this.stub()};
component.delayBlur = {cancel: this.stub()};
component.onCancelBlur(mockEvt);
this.assertEqual(mockEvt.stopPropagation.callCount, 1);
this.assertEqual(component.delayBlur.cancel.callCount, 1);
},
testOnDateClick() {
const mockEvt = {stopPropagation: this.stub()};
const onDateClick = this.stub();
const component = this.createComponent(
<DatePicker onDateClick={onDateClick} />
);
const date = new Date(2015, 1, 3);
this.stub(component, 'setState');
component.delayBlur = {cancel: this.stub()};
component.onDateClick(date, true, mockEvt);
this.assertEqual(mockEvt.stopPropagation.callCount, 1);
this.assertEqual(component.delayBlur.cancel.callCount, 1);
this.assertEqual(onDateClick.callCount, 0);
this.assertEqual(component.setState.callCount, 0);
component.onDateClick(date, false, mockEvt);
this.assertEqual(mockEvt.stopPropagation.callCount, 2);
this.assertEqual(component.delayBlur.cancel.callCount, 2);
this.assertEqual(onDateClick.callCount, 1);
this.assertEqual(component.setState.callCount, 1);
this.assertTrue(onDateClick.calledWith(mockEvt, date));
this.assertTrue(component.setState.calledWith({
selectedMonth: new Date(2015, 1, 1),
showCalendar: false,
value: date
}));
},
testOnChangeMonth() {
const mockEvt = {
stopPropagation: this.stub(),
target: {
options: [{value: 4}],
selectedIndex: 0
}
};
const date = new Date(2015, 1, 1);
const component = this.createComponent(
<DatePicker defaultValue={date} />
);
component.delayBlur = {cancel: this.stub()};
this.stub(component, 'setState');
component.onChangeMonth(mockEvt);
this.assertEqual(mockEvt.stopPropagation.callCount, 1);
this.assertEqual(component.delayBlur.cancel.callCount, 1);
this.assertEqual(component.setState.callCount, 1);
this.assertTrue(component.setState.calledWith({
selectedMonth: new Date(2015, 4, 1)
}));
},
testOnChangeYear() {
const mockEvt = {
stopPropagation: this.stub(),
target: {
options: [{value: 1987}],
selectedIndex: 0
}
};
const date = new Date(2015, 1, 1);
const component = this.createComponent(
<DatePicker defaultValue={date} />
);
component.delayBlur = {cancel: this.stub()};
this.stub(component, 'setState');
component.onChangeYear(mockEvt);
this.assertEqual(mockEvt.stopPropagation.callCount, 1);
this.assertEqual(component.delayBlur.cancel.callCount, 1);
this.assertEqual(component.setState.callCount, 1);
this.assertTrue(component.setState.calledWith({
selectedMonth: new Date(1987, 1, 1)
}));
},
testOnNextClick() {
const mockEvt = {stopPropagation: this.stub()};
const date = new Date(2015, 0, 8);
const component = this.createComponent(
<DatePicker defaultValue={date} />
);
component.delayBlur = {cancel: this.stub()};
this.stub(component, 'setState');
component.onNextClick(mockEvt);
this.assertEqual(mockEvt.stopPropagation.callCount, 1);
this.assertEqual(component.delayBlur.cancel.callCount, 1);
this.assertEqual(component.setState.callCount, 1);
this.assertTrue(component.setState.calledWith({
selectedMonth: new Date(2015, 1, 1)
}));
},
testOnPreviousClick() {
const mockEvt = {stopPropagation: this.stub()};
const date = new Date(2015, 0, 8);
const component = this.createComponent(
<DatePicker defaultValue={date} />
);
component.delayBlur = {cancel: this.stub()};
this.stub(component, 'setState');
component.onPreviousClick(mockEvt);
this.assertEqual(mockEvt.stopPropagation.callCount, 1);
this.assertEqual(component.delayBlur.cancel.callCount, 1);
this.assertEqual(component.setState.callCount, 1);
this.assertTrue(component.setState.calledWith({
selectedMonth: new Date(2014, 11, 1)
}));
},
testClear() {
const component = this.createComponent(<DatePicker />);
this.stub(component, 'setState');
component.clear();
this.assertEqual(component.setState.callCount, 1);
this.assertTrue(component.setState.calledWith({
value: undefined
}));
},
testHideCalendar() {
const component = this.createComponent(<DatePicker />);
this.stub(component, 'setState');
component.hideCalendar();
this.assertEqual(component.setState.callCount, 1);
this.assertTrue(component.setState.calledWith({
showCalendar: false
}));
},
testShowCalendar() {
const component = this.createComponent(<DatePicker />);
this.stub(component, 'setState');
component.showCalendar();
this.assertEqual(component.setState.callCount, 1);
this.assertTrue(component.setState.calledWith({
showCalendar: true
}));
}
});