linkstate/test/index.js at a92f86be3ae09e536fc3aef2677dea587cc712c3 · developit/linkstate · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
import linkState from '../src';
import chai, { expect } from 'chai';
import { stub } from 'sinon';
import sinonChai from 'sinon-chai';
chai.use(sinonChai);

describe('linkstate', () => {
	let component, linkFunction;

	function Component() {
		this.state = {};
	}
	Component.prototype.setState = stub();

	beforeEach( () => {
		component = new Component();
		component.setState.reset();
	});

	it('should be a function', () => {
		expect(linkState).to.be.a('function');
	});

	it('should produce a function', () => {
		expect(linkState(component, 'testStateKey')).to.be.a('function');
	});

	it('should be memoized', () => {
		expect(linkState(component, 'a')).to.equal(linkState(component, 'a'));
		expect(linkState(component, 'a', 'x')).to.equal(linkState(component, 'a', 'x'));

		expect(linkState(component, 'a')).not.to.equal(linkState(component, 'b'));
		expect(linkState(component, 'a')).not.to.equal(linkState(component, 'a', 'x'));
		expect(linkState(component, 'a', 'x')).not.to.equal(linkState(component, 'a', 'y'));
	});

	describe('linkState without eventPath argument', () => {
		beforeEach( () => {
			linkFunction = linkState(component, 'testStateKey');
		});

		it('should use value attribute on text input when no eventPath is supplied', () => {
			let element = document.createElement('input');
			element.type= 'text';
			element.value = 'newValue';

			linkFunction({
				currentTarget: element,
				target: element
			});

			expect(component.setState).to.have.been.calledOnce;
			expect(component.setState).to.have.been.calledWith({'testStateKey': 'newValue'});

			linkFunction.call(element);

			expect(component.setState).to.have.been.calledTwice;
			expect(component.setState.secondCall).to.have.been.calledWith({'testStateKey': 'newValue'});
		});

		it('should use checked attribute on checkbox input when no eventPath is supplied', () => {
			let checkboxElement = document.createElement('input');
			checkboxElement.type= 'checkbox';
			checkboxElement.checked = true;

			linkFunction({
				currentTarget: checkboxElement,
				target: checkboxElement
			});

			expect(component.setState).to.have.been.calledOnce;
			expect(component.setState).to.have.been.calledWith({'testStateKey': true});
		});

		it('should use checked attribute on radio input when no eventPath is supplied', () => {
			let radioElement = document.createElement('input');
			radioElement.type= 'radio';
			radioElement.checked = true;

			linkFunction({
				currentTarget: radioElement,
				target: radioElement
			});

			expect(component.setState).to.have.been.calledOnce;
			expect(component.setState).to.have.been.calledWith({'testStateKey': true});
		});


		it('should set dot notated state key appropriately', () => {
			linkFunction = linkState(component,'nested.state.key');
			let element = document.createElement('input');
			element.type= 'text';
			element.value = 'newValue';

			linkFunction({
				currentTarget: element,
				target: element
			});

			expect(component.setState).to.have.been.calledOnce;
			expect(component.setState).to.have.been.calledWith({nested: {state: {key: 'newValue'}}});
		});

		it('should set dot notated state key with index support appropriately', () => {
			linkFunction = linkState(component,'nested.state.0.key');
			let element = document.createElement('input');
			element.type= 'text';
			element.value = 'newValue';

			linkFunction({
				currentTarget: element,
				target: element
			});

			expect(component.setState).to.have.been.calledOnce;
			expect(component.setState).to.have.been.calledWith({nested: {state: [{key: 'newValue'}]}});
		});

	});

	describe('linkState with eventPath argument', () => {
		before( () => {
			linkFunction = linkState(component,'testStateKey', 'nested.path');
			expect(linkFunction).to.be.a('function');
		});

		it('should give precedence to nested.path on event over nested.path on component', () => {
			let event = {nested: {path: 'nestedPathValueFromEvent'}};

			linkFunction.call(component, event);

			expect(component.setState).to.have.been.calledOnce;
			expect(component.setState).to.have.been.calledWith({'testStateKey': 'nestedPathValueFromEvent'});
		});
	});
});