checkout.ts
3.03 KB
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
import { Customer } from '../types/customer';
import { el } from './utils/element';
class Checkout {
protected step: string;
get heading(): Cypress.Chainable {
return cy.get(`h3:contains("${Cypress._.capitalize(this.step)}")`);
}
get firstName(): Cypress.Chainable {
return el(`${this.step}-firstName`, 'input');
}
get lastName(): Cypress.Chainable {
return el(`${this.step}-lastName`);
}
get streetName(): Cypress.Chainable {
return el(`${this.step}-streetName`);
}
get apartment(): Cypress.Chainable {
return el(`${this.step}-apartment`);
}
get city(): Cypress.Chainable {
return el(`${this.step}-city`);
}
get state(): Cypress.Chainable {
return el(`${this.step}-state`, 'input');
}
get country(): Cypress.Chainable {
return el(`${this.step}-country`, 'select');
}
get zipcode(): Cypress.Chainable {
return el(`${this.step}-zipcode`);
}
get phone(): Cypress.Chainable {
return el(`${this.step}-phone`);
}
}
class Shipping extends Checkout {
constructor() {
super();
this.step = 'shipping';
}
get continueToBillingButton(): Cypress.Chainable {
return cy.contains('Continue to billing');
}
get selectShippingButton(): Cypress.Chainable {
return cy.contains('Select shipping method');
}
get shippingMethods(): Cypress.Chainable {
return el('shipping-method', 'label');
}
public fillForm(customer: Customer) {
this.firstName.type(customer.firstName);
this.lastName.type(customer.lastName);
this.streetName.type(customer.address.shipping.streetName);
this.apartment.type(customer.address.shipping.apartment);
this.city.type(customer.address.shipping.city);
this.country.select(customer.address.shipping.country);
this.state.type(customer.address.shipping.state);
this.zipcode.type(customer.address.shipping.zipcode);
this.phone.type(customer.address.shipping.phone);
}
}
class Billing extends Checkout {
constructor() {
super();
this.step = 'billing';
}
get continueToPaymentButton(): Cypress.Chainable {
return cy.contains('Continue to payment');
}
public fillForm(customer: Customer) {
this.firstName.type(customer.firstName);
this.lastName.type(customer.lastName);
this.streetName.type(customer.address.billing.streetName);
this.apartment.type(customer.address.billing.apartment);
this.city.type(customer.address.billing.city);
this.country.select(customer.address.billing.country);
this.state.type(customer.address.billing.state);
this.zipcode.type(customer.address.billing.zipcode);
this.phone.type(customer.address.billing.phone);
}
}
class Payment {
get makeAnOrderButton(): Cypress.Chainable {
return cy.contains('Make an order');
}
get paymentMethods(): Cypress.Chainable {
return el('payment-method');
}
get terms(): Cypress.Chainable {
return el('terms', 'label');
}
}
class ThankYou {
get heading(): Cypress.Chainable {
return el('thank-you-banner', 'h2');
}
}
export {
Shipping,
Billing,
Payment,
ThankYou
};