diff --git a/src/dateinput/ffe-dateinput.js b/src/dateinput/ffe-dateinput.js
index 1bf7fa62fe..a248786ce9 100644
--- a/src/dateinput/ffe-dateinput.js
+++ b/src/dateinput/ffe-dateinput.js
@@ -1,11 +1,13 @@
import React, { PropTypes } from 'react';
+import classNames from 'classnames';
import KalenderIkon from 'ffe-icons-react/kalender-ikon';
-function FFEDateInput(props) {
- const defaultProps = props.inputProps || {};
- const defaultClassName = defaultProps.className || '';
- const inputProps = { ...defaultProps,
- className: `ffe-dateinput__field ffe-input-field ${defaultClassName}`,
+export default function FFEDateInput(props) {
+ const givenInputProps = props.inputProps || {};
+
+ const inputProps = {
+ ...givenInputProps,
+ className: classNames('ffe-dateinput__field', 'ffe-input-field', givenInputProps.className),
};
return (
@@ -30,5 +32,3 @@ FFEDateInput.propTypes = {
value: PropTypes.string.isRequired,
inputProps: PropTypes.object,
};
-
-export default FFEDateInput;
diff --git a/src/dateinput/ffe-dateinput.test.js b/src/dateinput/ffe-dateinput.test.js
index bcf15a2520..15776329b9 100644
--- a/src/dateinput/ffe-dateinput.test.js
+++ b/src/dateinput/ffe-dateinput.test.js
@@ -2,19 +2,63 @@
import { shallow } from 'enzyme';
import { assert } from 'chai';
+import { spy } from 'sinon';
import React from 'react';
import FFEDateInput from './ffe-dateinput';
describe('', () => {
- const dateinput = ;
+ const onChange = spy();
+ const onFocus = spy();
+ const onKeyDown = spy();
+
+ const component = shallow();
it('should render a wrapper for the input field', () => {
- const wrapper = shallow(dateinput);
- assert.equal(wrapper.find('.ffe-dateinput').length, 1);
+ assert.isTrue(component.is('.ffe-dateinput'));
});
- it('should render an input field', () => {
- const wrapper = shallow(dateinput);
- assert.equal(wrapper.find('input.ffe-dateinput__field').length, 1);
+ describe('nested input field', () => {
+ const input = component.find('input');
+
+ it('should be a single input field', () => {
+ assert.equal(component.length, 1);
+ });
+
+ it('should have BEM element class name', () => {
+ assert.isTrue(input.hasClass('ffe-dateinput__field'));
+ });
+
+ it('should have given value', () => {
+ assert.equal(input.prop('value'), '2016-03-07');
+ });
+
+ it('should have property from input props', () => {
+ assert.equal(input.prop('placeholder'), 'Given placeholder');
+ });
+
+ it('should have class name from input props', () => {
+ assert.isTrue(input.hasClass('given-class-name'));
+ });
+
+ it('should delegate change events', () => {
+ input.simulate('change');
+ assert.isTrue(onChange.calledOnce);
+ });
+
+ it('should delegate focus events', () => {
+ input.simulate('focus');
+ assert.isTrue(onFocus.calledOnce);
+ });
+
+ it('should delegate key down events', () => {
+ input.simulate('keypress');
+ assert.isTrue(onKeyDown.calledOnce);
+ });
});
});