Skip to content

Commit b4bda14

Browse files
writing more tests
1 parent 823034c commit b4bda14

File tree

6 files changed

+323
-110
lines changed

6 files changed

+323
-110
lines changed

cypress/templates/testData.ts

+167
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,167 @@
1+
import {
2+
array as yupArray,
3+
number as yupNumber,
4+
string as yupString,
5+
object as yupObject,
6+
} from 'yup';
7+
8+
9+
const answers = {
10+
// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Page 1 //
11+
firstName: null,
12+
lastName: null,
13+
email: null,
14+
password: null,
15+
phone: null,
16+
url: null,
17+
number: null,
18+
selectAnimal: null,
19+
selectsMultipleAnimals: null,
20+
autocompleteAnimal: null,
21+
autoCompleteMultipleAnimals: null,
22+
description: null,
23+
24+
// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Page 2 //
25+
isThisBoxChecked: null,
26+
checkboxMultiple: null,
27+
isSingleRadioSelected: null,
28+
switchQuestion: null,
29+
// autocomplete: undefined,
30+
// autocomplete: 'foo',
31+
// buttonField: [],
32+
// color: '#ff0000',
33+
// combobox: null,
34+
// combobox: 'Foo',
35+
// combobox: 'foo',
36+
// combobox: null,
37+
// combobox: { title: 'Foo', value: 'foo' },
38+
// customFoo: null,
39+
// customBar: null,
40+
// file: null,
41+
// radioMultiple: ['option1', 'option3'],
42+
// selectField: null,
43+
// selectField: 'foo',
44+
};
45+
46+
const finalAnswer = {
47+
// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Page 1 //
48+
firstName: 'Bunny',
49+
lastName: 'Rabbit',
50+
51+
password: 'password1',
52+
phone: '555-555-5555',
53+
url: 'https://test.com',
54+
number: 100,
55+
selectAnimal: 'rabbit',
56+
selectsMultipleAnimals: ['rabbit', 'duck'],
57+
autocompleteAnimal: 'rabbit',
58+
autoCompleteMultipleAnimals: ['rabbit', 'duck'],
59+
description: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam nec pur',
60+
61+
// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Page 2 //
62+
isThisBoxChecked: 'yes',
63+
checkboxMultiple: ['option1', 'option3'],
64+
isSingleRadioSelected: 'yes',
65+
switchQuestion: 'yes',
66+
};
67+
68+
const items = [
69+
{ title: 'Bear', value: 'bear' },
70+
{ title: 'Bearded Dragon', value: 'bearded-dragon' },
71+
{ title: 'Budgie', value: 'budgie' },
72+
{ title: 'Bulldog', value: 'bulldog' },
73+
{ title: 'Cat', value: 'cat' },
74+
{ title: 'Chicken', value: 'chicken' },
75+
{ title: 'Chinchilla', value: 'chinchilla' },
76+
{ title: 'Cobra', value: 'cobra' },
77+
{ title: 'Cockatiel', value: 'cockatiel' },
78+
{ title: 'Cow', value: 'cow' },
79+
{ title: 'Dog', value: 'dog' },
80+
{ title: 'Donkey', value: 'donkey' },
81+
{ title: 'Dragon', value: 'dragon' },
82+
{ title: 'Duck', value: 'duck' },
83+
{ title: 'Eagle', value: 'eagle' },
84+
{ title: 'Elephant', value: 'elephant' },
85+
{ title: 'Ferret', value: 'ferret' },
86+
{ title: 'Fox', value: 'fox' },
87+
{ title: 'Goat', value: 'goat' },
88+
{ title: 'Gorilla', value: 'gorilla' },
89+
{ title: 'Guinea Pig', value: 'guinea-pig' },
90+
{ title: 'Hamster', value: 'hamster' },
91+
{ title: 'Horse', value: 'horse' },
92+
{ title: 'Leopard', value: 'leopard' },
93+
{ title: 'Lion', value: 'lion' },
94+
{ title: 'Otter', value: 'otter' },
95+
{ title: 'Panda', value: 'panda' },
96+
{ title: 'Parrot', value: 'parrot' },
97+
{ title: 'Penguin', value: 'penguin' },
98+
{ title: 'Pig', value: 'pig' },
99+
{ title: 'Pomeranian', value: 'pomeranian' },
100+
{ title: 'Poodle', value: 'poodle' },
101+
{ title: 'Rabbit', value: 'rabbit' },
102+
{ title: 'Shark', value: 'shark' },
103+
{ title: 'Sheep', value: 'sheep' },
104+
{ title: 'Sphynx', value: 'sphynx' },
105+
{ title: 'Tarantula', value: 'tarantula' },
106+
{ title: 'Tiger', value: 'tiger' },
107+
{ title: 'Whale', value: 'whale' },
108+
{ title: 'Wolf', value: 'wolf' },
109+
];
110+
111+
const validationSchema = yupObject({
112+
// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Page 1 //
113+
firstName: yupString().required(isRequired('First Name')),
114+
lastName: yupString().required(isRequired('Last Name')),
115+
email: yupString().email('Must be a valid Email').required(isRequired('Email')),
116+
password: yupString().required(isRequired('Password'))
117+
.min(5, 'Password must have at least ${min} characters'),
118+
phone: yupString().required(isRequired('Phone')),
119+
url: yupString().required(isRequired('URL'))
120+
.url('Must be a valid URL'),
121+
number: yupNumber().required(isRequired('Number'))
122+
.min(finalAnswer.number, 'Number must be at least ${min}'),
123+
description: yupString().required(isRequired('Description')),
124+
selectAnimal: yupString().required(isRequired('Select Animal')),
125+
selectsMultipleAnimals: yupArray().required(isRequired('Select Multiple Animals')),
126+
autocompleteAnimal: yupString().required(isRequired('Autocomplete Animal')),
127+
autoCompleteMultipleAnimals: yupArray().required(isRequired('Autocomplete Multiple Animal')),
128+
129+
// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Page 2 //
130+
isThisBoxChecked: yupString().required(isRequired('Checkbox Single')),
131+
checkboxMultiple: yupArray().required(isRequired('Checkbox Multiple'))
132+
.min(2, 'Must select at least ${min} options'),
133+
isSingleRadioSelected: yupString().required(isRequired('Radio Single'))
134+
.matches(/(yes|no)/, 'Only "yes" or "no" is allowed'),
135+
switchQuestion: yupString().required(isRequired('Switch Question'))
136+
.matches(/(yes)/, 'Only "yes" is allowed'),
137+
138+
// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ //
139+
// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ //
140+
// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ //
141+
// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ //
142+
// autocomplete: yupString().required(isRequired('Autocomplete')),
143+
// autocomplete: yupArray().required(isRequired('Autocomplete')),
144+
// buttonField: yupArray().required(isRequired('Button Field')),
145+
// buttonField: yupString().required(isRequired('Button Field')).matches(/(yes|no)/, 'Only "yes" or "no" is allowed'),
146+
// .matches(/(^true)/, isRequired('Checkbox Single')),
147+
// .matches(/(^false)/, 'Checkbox must be not false'),
148+
// color: yupString().required(isRequired('Color')),
149+
// combobox: yupArray().required(isRequired('Combobox'))
150+
// .length(1, 'Must select at least ${length} option.'),
151+
// customFoo: yupString().required(isRequired('Custom Foo')),
152+
// customBar: yupString().required(isRequired('Custom Bar')),
153+
// file: yupString().required(isRequired('File')),
154+
// selectField: yupString().required(isRequired('Select Field')),
155+
});
156+
157+
function isRequired(field: string) {
158+
return `${field} is required`;
159+
}
160+
161+
162+
export {
163+
answers,
164+
finalAnswer,
165+
items,
166+
validationSchema,
167+
};

src/plugin/VStepperForm.vue

+2
Original file line numberDiff line numberDiff line change
@@ -78,6 +78,7 @@
7878
<v-stepper-window-item
7979
v-for="page, i in computedPages"
8080
:key="`${getIndex(i)}-content`"
81+
:data-cy="page.isSummary ? 'vsf-page-summary' : `vsf-page-${getIndex(i)}`"
8182
:reverse-transition="transitionComputed"
8283
:transition="transitionComputed"
8384
:value="getIndex(i)"
@@ -90,6 +91,7 @@
9091
:fieldColumns="settings?.fieldColumns"
9192
:index="getIndex(i)"
9293
:page="page"
94+
:pageIndex="getIndex(i)"
9395
:settings="settings"
9496
@validate="onFieldValidate($event, next)"
9597
>

0 commit comments

Comments
 (0)