Skip to content

Commit c17d02e

Browse files
quinnlangillequinnlangille
authored
Merge branch 'v0.17.0' into feat/custom-titles-in-pagination
2 parents 783c60a + de9a54a commit c17d02e

File tree

10 files changed

+456
-405
lines changed

10 files changed

+456
-405
lines changed

‎package.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -56,11 +56,12 @@
5656
"eslint-plugin-prettier": "^2.6.0",
5757
"eslint-plugin-vue": "^4.0.0",
5858
"html-webpack-plugin": "^3.2.0",
59-
"html2jade": "^0.8.6",
6059
"husky": "^0.12.0",
6160
"isparta": "^4.0.0",
6261
"isparta-loader": "^2.0.0",
6362
"jest": "^23.5.0",
63+
"jest-serializer-vue": "^2.0.2",
64+
"lint-staged": "^8.1.0",
6465
"prettier": "^1.10.2",
6566
"prettier-eslint": "^8.8.1",
6667
"prettier-eslint-cli": "^4.7.0",

‎tests/client.jest.json

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,9 @@
44
"transform": {
55
".*\\.(js|vue)$": "<rootDir>/tests/preprocessor.js"
66
},
7+
"snapshotSerializers": [
8+
"jest-serializer-vue"
9+
],
710
"testPathIgnorePatterns": [
811
"/node_modules/",
912
"/debug/"

‎tests/client/components/__snapshots__/carousel.spec.js.snap

Lines changed: 229 additions & 188 deletions
Large diffs are not rendered by default.

‎tests/client/components/__snapshots__/navigation.spec.js.snap

Lines changed: 60 additions & 75 deletions
Original file line numberDiff line numberDiff line change
@@ -1,91 +1,76 @@
11
// Jest Snapshot v1, https://goo.gl/fbAQLP
22

33
exports[`Navigation should mount successfully 1`] = `
4-
".VueCarousel-wrapper
5-
.VueCarousel-inner(style='transform: translate(0px, 0); visibility: hidden; height: auto;')
6-
.VueCarousel-slide(tabindex='-1', role='tabpanel', aria-hidden='true')
7-
.VueCarousel-slide.VueCarousel-slide-active.VueCarousel-slide-center(tabindex='-1', role='tabpanel')
8-
|
9-
.VueCarousel-navigation
10-
button.VueCarousel-navigation-button.VueCarousel-navigation-prev(type='button', aria-label='Previous page', tabindex='0', style='padding: 8px; margin-right: -8px;') &#x25C0;
11-
|
12-
button.VueCarousel-navigation-button.VueCarousel-navigation-next.VueCarousel-navigation--disabled(type='button', aria-label='Next page', tabindex='-1', style='padding: 8px; margin-left: -8px;') &#x25B6;
13-
|
14-
.VueCarousel-pagination(style='')
15-
.VueCarousel-dot-container(role='tablist', style='margin-top: 20px;')
16-
button.VueCarousel-dot(aria-hidden='false', role='tab', title='Item 0', value='Item 0', aria-label='Item 0', aria-selected='false', style='margin-top: 20px; padding: 10px; width: 10px; height: 10px; background-color: rgb(239, 239, 239);')
17-
button.VueCarousel-dot.VueCarousel-dot--active(aria-hidden='false', role='tab', title='Item 1', value='Item 1', aria-label='Item 1', aria-selected='true', style='margin-top: 20px; padding: 10px; width: 10px; height: 10px; background-color: rgb(0, 0, 0);')
18-
"
4+
<section class="VueCarousel">
5+
<div class="VueCarousel-wrapper">
6+
<div class="VueCarousel-inner" style="transform: translate(0px, 0); visibility: hidden; height: auto;">
7+
<div tabindex="-1" role="tabpanel" class="VueCarousel-slide" aria-hidden="true"></div>
8+
<div tabindex="-1" role="tabpanel" class="VueCarousel-slide VueCarousel-slide-active VueCarousel-slide-center"></div>
9+
</div>
10+
</div>
11+
<div class="VueCarousel-navigation"><button type="button" aria-label="Previous page" tabindex="0" class="VueCarousel-navigation-button VueCarousel-navigation-prev" style="padding: 8px; margin-right: -8px;">◀</button> <button type="button" aria-label="Next page" tabindex="-1" class="VueCarousel-navigation-button VueCarousel-navigation-next VueCarousel-navigation--disabled" style="padding: 8px; margin-left: -8px;">▶</button></div>
12+
<div class="VueCarousel-pagination" style="">
13+
<div role="tablist" class="VueCarousel-dot-container" style="margin-top: 20px;"><button aria-hidden="false" role="tab" title="Item 0" value="Item 0" aria-label="Item 0" aria-selected="false" class="VueCarousel-dot" style="margin-top: 20px; padding: 10px; width: 10px; height: 10px; background-color: rgb(239, 239, 239);"></button><button aria-hidden="false" role="tab" title="Item 1" value="Item 1" aria-label="Item 1" aria-selected="true" class="VueCarousel-dot VueCarousel-dot--active" style="margin-top: 20px; padding: 10px; width: 10px; height: 10px; background-color: rgb(0, 0, 0);"></button></div>
14+
</div>
15+
</section>
1916
`;
2017

2118
exports[`Navigation should render a next button 1`] = `
22-
".VueCarousel-wrapper
23-
.VueCarousel-inner(style='transform: translate(0px, 0); visibility: hidden; height: auto;')
24-
.VueCarousel-slide(tabindex='-1', role='tabpanel', aria-hidden='true')
25-
.VueCarousel-slide.VueCarousel-slide-active.VueCarousel-slide-center(tabindex='-1', role='tabpanel')
26-
|
27-
.VueCarousel-navigation
28-
button.VueCarousel-navigation-button.VueCarousel-navigation-prev(type='button', aria-label='Previous page', tabindex='0', style='padding: 8px; margin-right: -8px;') &#x25C0;
29-
|
30-
button.VueCarousel-navigation-button.VueCarousel-navigation-next.VueCarousel-navigation--disabled(type='button', aria-label='Next page', tabindex='-1', style='padding: 8px; margin-left: -8px;') &#x25B6;
31-
|
32-
.VueCarousel-pagination(style='')
33-
.VueCarousel-dot-container(role='tablist', style='margin-top: 20px;')
34-
button.VueCarousel-dot(aria-hidden='false', role='tab', title='Item 0', value='Item 0', aria-label='Item 0', aria-selected='false', style='margin-top: 20px; padding: 10px; width: 10px; height: 10px; background-color: rgb(239, 239, 239);')
35-
button.VueCarousel-dot.VueCarousel-dot--active(aria-hidden='false', role='tab', title='Item 1', value='Item 1', aria-label='Item 1', aria-selected='true', style='margin-top: 20px; padding: 10px; width: 10px; height: 10px; background-color: rgb(0, 0, 0);')
36-
"
19+
<section class="VueCarousel">
20+
<div class="VueCarousel-wrapper">
21+
<div class="VueCarousel-inner" style="transform: translate(0px, 0); visibility: hidden; height: auto;">
22+
<div tabindex="-1" role="tabpanel" class="VueCarousel-slide" aria-hidden="true"></div>
23+
<div tabindex="-1" role="tabpanel" class="VueCarousel-slide VueCarousel-slide-active VueCarousel-slide-center"></div>
24+
</div>
25+
</div>
26+
<div class="VueCarousel-navigation"><button type="button" aria-label="Previous page" tabindex="0" class="VueCarousel-navigation-button VueCarousel-navigation-prev" style="padding: 8px; margin-right: -8px;">◀</button> <button type="button" aria-label="Next page" tabindex="-1" class="VueCarousel-navigation-button VueCarousel-navigation-next VueCarousel-navigation--disabled" style="padding: 8px; margin-left: -8px;">▶</button></div>
27+
<div class="VueCarousel-pagination" style="">
28+
<div role="tablist" class="VueCarousel-dot-container" style="margin-top: 20px;"><button aria-hidden="false" role="tab" title="Item 0" value="Item 0" aria-label="Item 0" aria-selected="false" class="VueCarousel-dot" style="margin-top: 20px; padding: 10px; width: 10px; height: 10px; background-color: rgb(239, 239, 239);"></button><button aria-hidden="false" role="tab" title="Item 1" value="Item 1" aria-label="Item 1" aria-selected="true" class="VueCarousel-dot VueCarousel-dot--active" style="margin-top: 20px; padding: 10px; width: 10px; height: 10px; background-color: rgb(0, 0, 0);"></button></div>
29+
</div>
30+
</section>
3731
`;
3832

3933
exports[`Navigation should render a prev button 1`] = `
40-
".VueCarousel-wrapper
41-
.VueCarousel-inner(style='transform: translate(0px, 0); visibility: hidden; height: auto;')
42-
.VueCarousel-slide(tabindex='-1', role='tabpanel', aria-hidden='true')
43-
.VueCarousel-slide.VueCarousel-slide-active.VueCarousel-slide-center(tabindex='-1', role='tabpanel')
44-
|
45-
.VueCarousel-navigation
46-
button.VueCarousel-navigation-button.VueCarousel-navigation-prev(type='button', aria-label='Previous page', tabindex='0', style='padding: 8px; margin-right: -8px;') &#x25C0;
47-
|
48-
button.VueCarousel-navigation-button.VueCarousel-navigation-next.VueCarousel-navigation--disabled(type='button', aria-label='Next page', tabindex='-1', style='padding: 8px; margin-left: -8px;') &#x25B6;
49-
|
50-
.VueCarousel-pagination(style='')
51-
.VueCarousel-dot-container(role='tablist', style='margin-top: 20px;')
52-
button.VueCarousel-dot(aria-hidden='false', role='tab', title='Item 0', value='Item 0', aria-label='Item 0', aria-selected='false', style='margin-top: 20px; padding: 10px; width: 10px; height: 10px; background-color: rgb(239, 239, 239);')
53-
button.VueCarousel-dot.VueCarousel-dot--active(aria-hidden='false', role='tab', title='Item 1', value='Item 1', aria-label='Item 1', aria-selected='true', style='margin-top: 20px; padding: 10px; width: 10px; height: 10px; background-color: rgb(0, 0, 0);')
54-
"
34+
<section class="VueCarousel">
35+
<div class="VueCarousel-wrapper">
36+
<div class="VueCarousel-inner" style="transform: translate(0px, 0); visibility: hidden; height: auto;">
37+
<div tabindex="-1" role="tabpanel" class="VueCarousel-slide" aria-hidden="true"></div>
38+
<div tabindex="-1" role="tabpanel" class="VueCarousel-slide VueCarousel-slide-active VueCarousel-slide-center"></div>
39+
</div>
40+
</div>
41+
<div class="VueCarousel-navigation"><button type="button" aria-label="Previous page" tabindex="0" class="VueCarousel-navigation-button VueCarousel-navigation-prev" style="padding: 8px; margin-right: -8px;">◀</button> <button type="button" aria-label="Next page" tabindex="-1" class="VueCarousel-navigation-button VueCarousel-navigation-next VueCarousel-navigation--disabled" style="padding: 8px; margin-left: -8px;">▶</button></div>
42+
<div class="VueCarousel-pagination" style="">
43+
<div role="tablist" class="VueCarousel-dot-container" style="margin-top: 20px;"><button aria-hidden="false" role="tab" title="Item 0" value="Item 0" aria-label="Item 0" aria-selected="false" class="VueCarousel-dot" style="margin-top: 20px; padding: 10px; width: 10px; height: 10px; background-color: rgb(239, 239, 239);"></button><button aria-hidden="false" role="tab" title="Item 1" value="Item 1" aria-label="Item 1" aria-selected="true" class="VueCarousel-dot VueCarousel-dot--active" style="margin-top: 20px; padding: 10px; width: 10px; height: 10px; background-color: rgb(0, 0, 0);"></button></div>
44+
</div>
45+
</section>
5546
`;
5647

5748
exports[`Navigation should trigger page advance backward when prev is clicked 1`] = `
58-
".VueCarousel-wrapper
59-
.VueCarousel-inner(style='transform: translate(0px, 0); visibility: hidden; height: auto;')
60-
.VueCarousel-slide(tabindex='-1', role='tabpanel', aria-hidden='true')
61-
.VueCarousel-slide.VueCarousel-slide-active.VueCarousel-slide-center(tabindex='-1', role='tabpanel')
62-
|
63-
.VueCarousel-navigation
64-
button.VueCarousel-navigation-button.VueCarousel-navigation-prev(type='button', aria-label='Previous page', tabindex='0', style='padding: 8px; margin-right: -8px;') &#x25C0;
65-
|
66-
button.VueCarousel-navigation-button.VueCarousel-navigation-next.VueCarousel-navigation--disabled(type='button', aria-label='Next page', tabindex='-1', style='padding: 8px; margin-left: -8px;') &#x25B6;
67-
|
68-
.VueCarousel-pagination(style='')
69-
.VueCarousel-dot-container(role='tablist', style='margin-top: 20px;')
70-
button.VueCarousel-dot(aria-hidden='false', role='tab', title='Item 0', value='Item 0', aria-label='Item 0', aria-selected='false', style='margin-top: 20px; padding: 10px; width: 10px; height: 10px; background-color: rgb(239, 239, 239);')
71-
button.VueCarousel-dot.VueCarousel-dot--active(aria-hidden='false', role='tab', title='Item 1', value='Item 1', aria-label='Item 1', aria-selected='true', style='margin-top: 20px; padding: 10px; width: 10px; height: 10px; background-color: rgb(0, 0, 0);')
72-
"
49+
<section class="VueCarousel">
50+
<div class="VueCarousel-wrapper">
51+
<div class="VueCarousel-inner" style="transform: translate(0px, 0); visibility: hidden; height: auto;">
52+
<div tabindex="-1" role="tabpanel" class="VueCarousel-slide" aria-hidden="true"></div>
53+
<div tabindex="-1" role="tabpanel" class="VueCarousel-slide VueCarousel-slide-active VueCarousel-slide-center"></div>
54+
</div>
55+
</div>
56+
<div class="VueCarousel-navigation"><button type="button" aria-label="Previous page" tabindex="0" class="VueCarousel-navigation-button VueCarousel-navigation-prev" style="padding: 8px; margin-right: -8px;">◀</button> <button type="button" aria-label="Next page" tabindex="-1" class="VueCarousel-navigation-button VueCarousel-navigation-next VueCarousel-navigation--disabled" style="padding: 8px; margin-left: -8px;">▶</button></div>
57+
<div class="VueCarousel-pagination" style="">
58+
<div role="tablist" class="VueCarousel-dot-container" style="margin-top: 20px;"><button aria-hidden="false" role="tab" title="Item 0" value="Item 0" aria-label="Item 0" aria-selected="false" class="VueCarousel-dot" style="margin-top: 20px; padding: 10px; width: 10px; height: 10px; background-color: rgb(239, 239, 239);"></button><button aria-hidden="false" role="tab" title="Item 1" value="Item 1" aria-label="Item 1" aria-selected="true" class="VueCarousel-dot VueCarousel-dot--active" style="margin-top: 20px; padding: 10px; width: 10px; height: 10px; background-color: rgb(0, 0, 0);"></button></div>
59+
</div>
60+
</section>
7361
`;
7462

7563
exports[`Navigation should trigger page advance when next is clicked 1`] = `
76-
".VueCarousel-wrapper
77-
.VueCarousel-inner(style='transform: translate(0px, 0); visibility: hidden; height: auto;')
78-
.VueCarousel-slide(tabindex='-1', role='tabpanel', aria-hidden='true')
79-
.VueCarousel-slide.VueCarousel-slide-active.VueCarousel-slide-center(tabindex='-1', role='tabpanel')
80-
|
81-
.VueCarousel-navigation
82-
button.VueCarousel-navigation-button.VueCarousel-navigation-prev(type='button', aria-label='Previous page', tabindex='0', style='padding: 8px; margin-right: -8px;') &#x25C0;
83-
|
84-
button.VueCarousel-navigation-button.VueCarousel-navigation-next.VueCarousel-navigation--disabled(type='button', aria-label='Next page', tabindex='-1', style='padding: 8px; margin-left: -8px;') &#x25B6;
85-
|
86-
.VueCarousel-pagination(style='')
87-
.VueCarousel-dot-container(role='tablist', style='margin-top: 20px;')
88-
button.VueCarousel-dot(aria-hidden='false', role='tab', title='Item 0', value='Item 0', aria-label='Item 0', aria-selected='false', style='margin-top: 20px; padding: 10px; width: 10px; height: 10px; background-color: rgb(239, 239, 239);')
89-
button.VueCarousel-dot.VueCarousel-dot--active(aria-hidden='false', role='tab', title='Item 1', value='Item 1', aria-label='Item 1', aria-selected='true', style='margin-top: 20px; padding: 10px; width: 10px; height: 10px; background-color: rgb(0, 0, 0);')
90-
"
64+
<section class="VueCarousel">
65+
<div class="VueCarousel-wrapper">
66+
<div class="VueCarousel-inner" style="transform: translate(0px, 0); visibility: hidden; height: auto;">
67+
<div tabindex="-1" role="tabpanel" class="VueCarousel-slide" aria-hidden="true"></div>
68+
<div tabindex="-1" role="tabpanel" class="VueCarousel-slide VueCarousel-slide-active VueCarousel-slide-center"></div>
69+
</div>
70+
</div>
71+
<div class="VueCarousel-navigation"><button type="button" aria-label="Previous page" tabindex="0" class="VueCarousel-navigation-button VueCarousel-navigation-prev" style="padding: 8px; margin-right: -8px;">◀</button> <button type="button" aria-label="Next page" tabindex="-1" class="VueCarousel-navigation-button VueCarousel-navigation-next VueCarousel-navigation--disabled" style="padding: 8px; margin-left: -8px;">▶</button></div>
72+
<div class="VueCarousel-pagination" style="">
73+
<div role="tablist" class="VueCarousel-dot-container" style="margin-top: 20px;"><button aria-hidden="false" role="tab" title="Item 0" value="Item 0" aria-label="Item 0" aria-selected="false" class="VueCarousel-dot" style="margin-top: 20px; padding: 10px; width: 10px; height: 10px; background-color: rgb(239, 239, 239);"></button><button aria-hidden="false" role="tab" title="Item 1" value="Item 1" aria-label="Item 1" aria-selected="true" class="VueCarousel-dot VueCarousel-dot--active" style="margin-top: 20px; padding: 10px; width: 10px; height: 10px; background-color: rgb(0, 0, 0);"></button></div>
74+
</div>
75+
</section>
9176
`;

‎tests/client/components/__snapshots__/slide.spec.js.snap

Lines changed: 11 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,15 @@
11
// Jest Snapshot v1, https://goo.gl/fbAQLP
22

33
exports[`Slide should mount successfully 1`] = `
4-
".VueCarousel-wrapper
5-
.VueCarousel-inner(style='transform: translate(0px, 0); visibility: hidden; height: auto;')
6-
.VueCarousel-slide(tabindex='-1', aria-hidden='true', role='tabpanel')
7-
//
8-
.VueCarousel-pagination(style='display: none;')
9-
.VueCarousel-dot-container(role='tablist', style='margin-top: 20px;')
10-
button.VueCarousel-dot.VueCarousel-dot--active(aria-hidden='false', role='tab', title='Item 0', value='Item 0', aria-label='Item 0', aria-selected='true', style='margin-top: 20px; padding: 10px; width: 10px; height: 10px; background-color: rgb(0, 0, 0);')
11-
"
4+
<section class="VueCarousel">
5+
<div class="VueCarousel-wrapper">
6+
<div class="VueCarousel-inner" style="transform: translate(0px, 0); visibility: hidden; height: auto;">
7+
<div tabindex="-1" aria-hidden="true" role="tabpanel" class="VueCarousel-slide"></div>
8+
</div>
9+
</div>
10+
<!---->
11+
<div class="VueCarousel-pagination" style="display: none;">
12+
<div role="tablist" class="VueCarousel-dot-container" style="margin-top: 20px;"><button aria-hidden="false" role="tab" title="Item 0" value="Item 0" aria-label="Item 0" aria-selected="true" class="VueCarousel-dot VueCarousel-dot--active" style="margin-top: 20px; padding: 10px; width: 10px; height: 10px; background-color: rgb(0, 0, 0);"></button></div>
13+
</div>
14+
</section>
1215
`;

0 commit comments

Comments
 (0)