Skip to content

Commit 6a5d3bd

Browse files
mathieuancelinmathieuancelin
committed
Test like feature on Wine
1 parent 9014154 commit 6a5d3bd

File tree

12 files changed

+438
-0
lines changed

12 files changed

+438
-0
lines changed

‎step-4-done/tests/bootstrap.js

+2
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,8 @@ export function bootstrapEnv(body = '') {
1414
}
1515
global.document = doc;
1616
global.window = win;
17+
global.TEST = true;
18+
global.window.TEST = true;
1719
propagateToGlobal(win);
1820
// console.log('\nENV setup is done !!!');
1921
}

‎step-4-done/tests/components/wine.spec.js

+61
Original file line numberDiff line numberDiff line change
@@ -47,4 +47,65 @@ describe('<Wine />', () => {
4747
</div>
4848
)).to.equal(true);
4949
});
50+
it('doit afficher un bon vin avec le like', () => {
51+
const wrapper = shallow(
52+
<Wine wine={blackHorse} liked onToggleLike={nothing} />
53+
);
54+
const spans = wrapper.find('span');
55+
const divs = wrapper.find('div');
56+
const img = wrapper.find('img').get(0);
57+
expect(wrapper.equals(
58+
<div {...divs.get(0).props}>
59+
<img {...img.props} src={`/api/wines/${blackHorse.id}/image`} />
60+
<div {...divs.get(1).props}>{blackHorse.name}</div>
61+
<div {...divs.get(2).props}>
62+
<span {...spans.get(0).props}>Type</span>{blackHorse.type}
63+
</div>
64+
<div {...divs.get(3).props}>
65+
<span {...spans.get(1).props}>Région</span>{blackHorse.appellation.region}
66+
</div>
67+
<div {...divs.get(4).props}>
68+
<span {...spans.get(2).props}>Appellation</span>{blackHorse.appellation.name}
69+
</div>
70+
<div {...divs.get(5).props}>
71+
<span {...spans.get(3).props}>Cépages</span>{blackHorse.grapes.join(', ')}
72+
</div>
73+
<div {...divs.get(6).props}>
74+
<span {...spans.get(4).props}>unlike</span>
75+
</div>
76+
</div>
77+
)).to.equal(true);
78+
});
79+
it('doit gérer un click sur le like', () => {
80+
const onToggleLike = sinon.spy();
81+
const wrapper = shallow(
82+
<Wine wine={blackHorse} liked onToggleLike={onToggleLike} />
83+
);
84+
const spans = wrapper.find('span');
85+
const divs = wrapper.find('div');
86+
const img = wrapper.find('img').get(0);
87+
expect(wrapper.equals(
88+
<div {...divs.get(0).props}>
89+
<img {...img.props} src={`/api/wines/${blackHorse.id}/image`} />
90+
<div {...divs.get(1).props}>{blackHorse.name}</div>
91+
<div {...divs.get(2).props}>
92+
<span {...spans.get(0).props}>Type</span>{blackHorse.type}
93+
</div>
94+
<div {...divs.get(3).props}>
95+
<span {...spans.get(1).props}>Région</span>{blackHorse.appellation.region}
96+
</div>
97+
<div {...divs.get(4).props}>
98+
<span {...spans.get(2).props}>Appellation</span>{blackHorse.appellation.name}
99+
</div>
100+
<div {...divs.get(5).props}>
101+
<span {...spans.get(3).props}>Cépages</span>{blackHorse.grapes.join(', ')}
102+
</div>
103+
<div {...divs.get(6).props}>
104+
<span {...spans.get(4).props}>unlike</span>
105+
</div>
106+
</div>
107+
)).to.equal(true);
108+
spans.at(4).simulate('click', { target: { getAttribute: () => null }});
109+
expect(onToggleLike.calledOnce).to.equal(true);
110+
});
50111
});

‎step-4/tests/bootstrap.js

+2
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,8 @@ export function bootstrapEnv(body = '') {
1414
}
1515
global.document = doc;
1616
global.window = win;
17+
global.TEST = true;
18+
global.window.TEST = true;
1719
propagateToGlobal(win);
1820
// console.log('\nENV setup is done !!!');
1921
}

‎step-4/tests/components/wine.spec.js

+61
Original file line numberDiff line numberDiff line change
@@ -47,4 +47,65 @@ describe('<Wine />', () => {
4747
</div>
4848
)).to.equal(true);
4949
});
50+
it('doit afficher un bon vin avec le like', () => {
51+
const wrapper = shallow(
52+
<Wine wine={blackHorse} liked onToggleLike={nothing} />
53+
);
54+
const spans = wrapper.find('span');
55+
const divs = wrapper.find('div');
56+
const img = wrapper.find('img').get(0);
57+
expect(wrapper.equals(
58+
<div {...divs.get(0).props}>
59+
<img {...img.props} src={`/api/wines/${blackHorse.id}/image`} />
60+
<div {...divs.get(1).props}>{blackHorse.name}</div>
61+
<div {...divs.get(2).props}>
62+
<span {...spans.get(0).props}>Type</span>{blackHorse.type}
63+
</div>
64+
<div {...divs.get(3).props}>
65+
<span {...spans.get(1).props}>Région</span>{blackHorse.appellation.region}
66+
</div>
67+
<div {...divs.get(4).props}>
68+
<span {...spans.get(2).props}>Appellation</span>{blackHorse.appellation.name}
69+
</div>
70+
<div {...divs.get(5).props}>
71+
<span {...spans.get(3).props}>Cépages</span>{blackHorse.grapes.join(', ')}
72+
</div>
73+
<div {...divs.get(6).props}>
74+
<span {...spans.get(4).props}>unlike</span>
75+
</div>
76+
</div>
77+
)).to.equal(true);
78+
});
79+
it('doit gérer un click sur le like', () => {
80+
const onToggleLike = sinon.spy();
81+
const wrapper = shallow(
82+
<Wine wine={blackHorse} liked onToggleLike={onToggleLike} />
83+
);
84+
const spans = wrapper.find('span');
85+
const divs = wrapper.find('div');
86+
const img = wrapper.find('img').get(0);
87+
expect(wrapper.equals(
88+
<div {...divs.get(0).props}>
89+
<img {...img.props} src={`/api/wines/${blackHorse.id}/image`} />
90+
<div {...divs.get(1).props}>{blackHorse.name}</div>
91+
<div {...divs.get(2).props}>
92+
<span {...spans.get(0).props}>Type</span>{blackHorse.type}
93+
</div>
94+
<div {...divs.get(3).props}>
95+
<span {...spans.get(1).props}>Région</span>{blackHorse.appellation.region}
96+
</div>
97+
<div {...divs.get(4).props}>
98+
<span {...spans.get(2).props}>Appellation</span>{blackHorse.appellation.name}
99+
</div>
100+
<div {...divs.get(5).props}>
101+
<span {...spans.get(3).props}>Cépages</span>{blackHorse.grapes.join(', ')}
102+
</div>
103+
<div {...divs.get(6).props}>
104+
<span {...spans.get(4).props}>unlike</span>
105+
</div>
106+
</div>
107+
)).to.equal(true);
108+
spans.at(4).simulate('click', { target: { getAttribute: () => null }});
109+
expect(onToggleLike.calledOnce).to.equal(true);
110+
});
50111
});

‎step-5-done/tests/bootstrap.js

+2
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,8 @@ export function bootstrapEnv(body = '') {
1414
}
1515
global.document = doc;
1616
global.window = win;
17+
global.TEST = true;
18+
global.window.TEST = true;
1719
propagateToGlobal(win);
1820
// console.log('\nENV setup is done !!!');
1921
}

‎step-5-done/tests/components/wine.spec.js

+61
Original file line numberDiff line numberDiff line change
@@ -47,4 +47,65 @@ describe('<Wine />', () => {
4747
</div>
4848
)).to.equal(true);
4949
});
50+
it('doit afficher un bon vin avec le like', () => {
51+
const wrapper = shallow(
52+
<Wine wine={blackHorse} liked onToggleLike={nothing} />
53+
);
54+
const spans = wrapper.find('span');
55+
const divs = wrapper.find('div');
56+
const img = wrapper.find('img').get(0);
57+
expect(wrapper.equals(
58+
<div {...divs.get(0).props}>
59+
<img {...img.props} src={`/api/wines/${blackHorse.id}/image`} />
60+
<div {...divs.get(1).props}>{blackHorse.name}</div>
61+
<div {...divs.get(2).props}>
62+
<span {...spans.get(0).props}>Type</span>{blackHorse.type}
63+
</div>
64+
<div {...divs.get(3).props}>
65+
<span {...spans.get(1).props}>Région</span>{blackHorse.appellation.region}
66+
</div>
67+
<div {...divs.get(4).props}>
68+
<span {...spans.get(2).props}>Appellation</span>{blackHorse.appellation.name}
69+
</div>
70+
<div {...divs.get(5).props}>
71+
<span {...spans.get(3).props}>Cépages</span>{blackHorse.grapes.join(', ')}
72+
</div>
73+
<div {...divs.get(6).props}>
74+
<span {...spans.get(4).props}>unlike</span>
75+
</div>
76+
</div>
77+
)).to.equal(true);
78+
});
79+
it('doit gérer un click sur le like', () => {
80+
const onToggleLike = sinon.spy();
81+
const wrapper = shallow(
82+
<Wine wine={blackHorse} liked onToggleLike={onToggleLike} />
83+
);
84+
const spans = wrapper.find('span');
85+
const divs = wrapper.find('div');
86+
const img = wrapper.find('img').get(0);
87+
expect(wrapper.equals(
88+
<div {...divs.get(0).props}>
89+
<img {...img.props} src={`/api/wines/${blackHorse.id}/image`} />
90+
<div {...divs.get(1).props}>{blackHorse.name}</div>
91+
<div {...divs.get(2).props}>
92+
<span {...spans.get(0).props}>Type</span>{blackHorse.type}
93+
</div>
94+
<div {...divs.get(3).props}>
95+
<span {...spans.get(1).props}>Région</span>{blackHorse.appellation.region}
96+
</div>
97+
<div {...divs.get(4).props}>
98+
<span {...spans.get(2).props}>Appellation</span>{blackHorse.appellation.name}
99+
</div>
100+
<div {...divs.get(5).props}>
101+
<span {...spans.get(3).props}>Cépages</span>{blackHorse.grapes.join(', ')}
102+
</div>
103+
<div {...divs.get(6).props}>
104+
<span {...spans.get(4).props}>unlike</span>
105+
</div>
106+
</div>
107+
)).to.equal(true);
108+
spans.at(4).simulate('click', { target: { getAttribute: () => null }});
109+
expect(onToggleLike.calledOnce).to.equal(true);
110+
});
50111
});

‎step-5/tests/bootstrap.js

+2
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,8 @@ export function bootstrapEnv(body = '') {
1414
}
1515
global.document = doc;
1616
global.window = win;
17+
global.TEST = true;
18+
global.window.TEST = true;
1719
propagateToGlobal(win);
1820
// console.log('\nENV setup is done !!!');
1921
}

‎step-5/tests/components/wine.spec.js

+61
Original file line numberDiff line numberDiff line change
@@ -47,4 +47,65 @@ describe('<Wine />', () => {
4747
</div>
4848
)).to.equal(true);
4949
});
50+
it('doit afficher un bon vin avec le like', () => {
51+
const wrapper = shallow(
52+
<Wine wine={blackHorse} liked onToggleLike={nothing} />
53+
);
54+
const spans = wrapper.find('span');
55+
const divs = wrapper.find('div');
56+
const img = wrapper.find('img').get(0);
57+
expect(wrapper.equals(
58+
<div {...divs.get(0).props}>
59+
<img {...img.props} src={`/api/wines/${blackHorse.id}/image`} />
60+
<div {...divs.get(1).props}>{blackHorse.name}</div>
61+
<div {...divs.get(2).props}>
62+
<span {...spans.get(0).props}>Type</span>{blackHorse.type}
63+
</div>
64+
<div {...divs.get(3).props}>
65+
<span {...spans.get(1).props}>Région</span>{blackHorse.appellation.region}
66+
</div>
67+
<div {...divs.get(4).props}>
68+
<span {...spans.get(2).props}>Appellation</span>{blackHorse.appellation.name}
69+
</div>
70+
<div {...divs.get(5).props}>
71+
<span {...spans.get(3).props}>Cépages</span>{blackHorse.grapes.join(', ')}
72+
</div>
73+
<div {...divs.get(6).props}>
74+
<span {...spans.get(4).props}>unlike</span>
75+
</div>
76+
</div>
77+
)).to.equal(true);
78+
});
79+
it('doit gérer un click sur le like', () => {
80+
const onToggleLike = sinon.spy();
81+
const wrapper = shallow(
82+
<Wine wine={blackHorse} liked onToggleLike={onToggleLike} />
83+
);
84+
const spans = wrapper.find('span');
85+
const divs = wrapper.find('div');
86+
const img = wrapper.find('img').get(0);
87+
expect(wrapper.equals(
88+
<div {...divs.get(0).props}>
89+
<img {...img.props} src={`/api/wines/${blackHorse.id}/image`} />
90+
<div {...divs.get(1).props}>{blackHorse.name}</div>
91+
<div {...divs.get(2).props}>
92+
<span {...spans.get(0).props}>Type</span>{blackHorse.type}
93+
</div>
94+
<div {...divs.get(3).props}>
95+
<span {...spans.get(1).props}>Région</span>{blackHorse.appellation.region}
96+
</div>
97+
<div {...divs.get(4).props}>
98+
<span {...spans.get(2).props}>Appellation</span>{blackHorse.appellation.name}
99+
</div>
100+
<div {...divs.get(5).props}>
101+
<span {...spans.get(3).props}>Cépages</span>{blackHorse.grapes.join(', ')}
102+
</div>
103+
<div {...divs.get(6).props}>
104+
<span {...spans.get(4).props}>unlike</span>
105+
</div>
106+
</div>
107+
)).to.equal(true);
108+
spans.at(4).simulate('click', { target: { getAttribute: () => null }});
109+
expect(onToggleLike.calledOnce).to.equal(true);
110+
});
50111
});

‎step-6-done/tests/components/wine.spec.js

+61
Original file line numberDiff line numberDiff line change
@@ -47,4 +47,65 @@ describe('<Wine />', () => {
4747
</div>
4848
)).to.equal(true);
4949
});
50+
it('doit afficher un bon vin avec le like', () => {
51+
const wrapper = shallow(
52+
<Wine wine={blackHorse} liked onToggleLike={nothing} />
53+
);
54+
const spans = wrapper.find('span');
55+
const divs = wrapper.find('div');
56+
const img = wrapper.find('img').get(0);
57+
expect(wrapper.equals(
58+
<div {...divs.get(0).props}>
59+
<img {...img.props} src={`/api/wines/${blackHorse.id}/image`} />
60+
<div {...divs.get(1).props}>{blackHorse.name}</div>
61+
<div {...divs.get(2).props}>
62+
<span {...spans.get(0).props}>Type</span>{blackHorse.type}
63+
</div>
64+
<div {...divs.get(3).props}>
65+
<span {...spans.get(1).props}>Région</span>{blackHorse.appellation.region}
66+
</div>
67+
<div {...divs.get(4).props}>
68+
<span {...spans.get(2).props}>Appellation</span>{blackHorse.appellation.name}
69+
</div>
70+
<div {...divs.get(5).props}>
71+
<span {...spans.get(3).props}>Cépages</span>{blackHorse.grapes.join(', ')}
72+
</div>
73+
<div {...divs.get(6).props}>
74+
<span {...spans.get(4).props}>unlike</span>
75+
</div>
76+
</div>
77+
)).to.equal(true);
78+
});
79+
it('doit gérer un click sur le like', () => {
80+
const onToggleLike = sinon.spy();
81+
const wrapper = shallow(
82+
<Wine wine={blackHorse} liked onToggleLike={onToggleLike} />
83+
);
84+
const spans = wrapper.find('span');
85+
const divs = wrapper.find('div');
86+
const img = wrapper.find('img').get(0);
87+
expect(wrapper.equals(
88+
<div {...divs.get(0).props}>
89+
<img {...img.props} src={`/api/wines/${blackHorse.id}/image`} />
90+
<div {...divs.get(1).props}>{blackHorse.name}</div>
91+
<div {...divs.get(2).props}>
92+
<span {...spans.get(0).props}>Type</span>{blackHorse.type}
93+
</div>
94+
<div {...divs.get(3).props}>
95+
<span {...spans.get(1).props}>Région</span>{blackHorse.appellation.region}
96+
</div>
97+
<div {...divs.get(4).props}>
98+
<span {...spans.get(2).props}>Appellation</span>{blackHorse.appellation.name}
99+
</div>
100+
<div {...divs.get(5).props}>
101+
<span {...spans.get(3).props}>Cépages</span>{blackHorse.grapes.join(', ')}
102+
</div>
103+
<div {...divs.get(6).props}>
104+
<span {...spans.get(4).props}>unlike</span>
105+
</div>
106+
</div>
107+
)).to.equal(true);
108+
spans.at(4).simulate('click', { target: { getAttribute: () => null }});
109+
expect(onToggleLike.calledOnce).to.equal(true);
110+
});
50111
});

0 commit comments

Comments
 (0)