Skip to content
This repository was archived by the owner on Nov 19, 2024. It is now read-only.

Commit 807f1b2

Browse files
doboothDonald BoothkeharperDonald BoothDonald Booth
authored
Reworked GraphQL tutorial (#8046)
* Updates * Reworked graphql tutorial * Dusting off the lint * That wasn't me. * Update src/guides/v2.3/graphql/tutorials/checkout/checkout-add-product-to-cart.md Co-authored-by: Kevin Harper <[email protected]> * Apply suggestions from code review Co-authored-by: Kevin Harper <[email protected]> * Removed query per review * Fixup per review * Code block fixup * Review fixups * Reversion per review * Added link * Fix codeblock * Update src/guides/v2.3/graphql/tutorials/checkout/checkout-coupon.md Co-authored-by: Kevin Harper <[email protected]> * Updates * Updated shipping address steps * Linty * Updated steps * trailing space * Small tweak to coupon instructions. * Added shipping method steps. * Update checkout-shipping-address.md Co-authored-by: Donald Booth <[email protected]> Co-authored-by: Kevin Harper <[email protected]> Co-authored-by: Donald Booth <[email protected]> Co-authored-by: Donald Booth <[email protected]>
1 parent 6d916a9 commit 807f1b2

12 files changed

+162
-493
lines changed

src/guides/v2.3/graphql/index.md

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -10,22 +10,22 @@ landing-page: GraphQL Developer's Guide
1010

1111
As of Magento 2.3.4, GraphQL provides the following features:
1212

13-
* Support for all product types, payment methods, and shipping methods
14-
* Achieved <.5 sec average response times with 500 concurrent requests
15-
* Redesigned a feature rich layered navigation
13+
- Support for all product types, payment methods, and shipping methods
14+
- Achieved <.5 sec average response times with 500 concurrent requests
15+
- Redesigned a feature rich layered navigation
1616

1717
## Where we're going
1818

1919
The `graphql-ce` Community Engineering repository has been archived. Development for Magento 2.3.5 will be limited to bug fixes.
2020

2121
For the 2.4.0 and 2.4.1 releases, Magento teams are working toward completing GraphQL coverage for Business to Consumer (B2C) uses cases, with emphasis on the following:
2222

23-
* Reorders
24-
* Inventory Management store pickups
25-
* Order history for logged in customers
26-
* Replace product-specific mutations that add products to a cart with a single mutation that can handle all product types
27-
* Gift wrapping and messages
28-
* Saved payment methods
23+
- Reorders
24+
- Inventory Management store pickups
25+
- Order history for logged in customers
26+
- Replace product-specific mutations that add products to a cart with a single mutation that can handle all product types
27+
- Gift wrapping and messages
28+
- Saved payment methods
2929

3030
We also expect to begin adding coverage for B2B scenarios.
3131

src/guides/v2.3/graphql/tutorials/checkout/checkout-add-product-to-cart.md

Lines changed: 22 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -31,9 +31,11 @@ If you add a product to the shopping cart as a registered customer, be sure to s
3131

3232
## Add a simple product into the shopping cart
3333

34-
`{ CART_ID }` is the unique shopping cart ID from [Step 2. Create empty cart]({{ page.baseurl }}/graphql/tutorials/checkout/checkout-add-product-to-cart.html).
34+
The following mutation adds a simple product into the shopping cart.
3535

36-
The following mutation adds a **simple product** into shopping cart.
36+
Replace `{ CART_ID }` with the unique shopping cart ID from [Step 2. Create empty cart]({{ page.baseurl }}/graphql/tutorials/checkout/checkout-add-product-to-cart.html).
37+
38+
In this example, we will add the Aim Analog Watch (SKU 24-MG04) from the default Luma catalog to the cart. The SKU identifies the product to be added.
3739

3840
**Request:**
3941

@@ -46,7 +48,7 @@ mutation {
4648
{
4749
data: {
4850
quantity: 1
49-
sku: "simple-product"
51+
sku: "24-MG04"
5052
}
5153
}
5254
]
@@ -75,9 +77,9 @@ mutation {
7577
"cart": {
7678
"items": [
7779
{
78-
"id": "508",
80+
"id": "5",
7981
"product": {
80-
"sku": "simple-product",
82+
"sku": "24-MG04",
8183
"stock_status": "IN_STOCK"
8284
},
8385
"quantity": 1
@@ -91,7 +93,8 @@ mutation {
9193

9294
## Add a virtual product into the shopping cart
9395

94-
The following mutation adds a **virtual product** into shopping cart.
96+
The following mutation adds a virtual product into the shopping cart.
97+
In this example, we add the Beginner's Yoga video downloadable product (SKU 240-LV04).
9598

9699
**Request:**
97100

@@ -104,7 +107,7 @@ mutation {
104107
{
105108
data: {
106109
quantity: 1
107-
sku: "virtual-product"
110+
sku: "240-LV04"
108111
}
109112
}
110113
]
@@ -133,9 +136,17 @@ mutation {
133136
"cart": {
134137
"items": [
135138
{
136-
"id": "509",
139+
"id": "5",
137140
"product": {
138-
"sku": "virtual-product",
141+
"sku": "24-MG04",
142+
"stock_status": "IN_STOCK"
143+
},
144+
"quantity": 1
145+
},
146+
{
147+
"id": "6",
148+
"product": {
149+
"sku": "240-LV04",
139150
"stock_status": "IN_STOCK"
140151
},
141152
"quantity": 1
@@ -147,6 +158,8 @@ mutation {
147158
}
148159
```
149160

161+
The response lists all items currently in the cart, including the just-added video download.
162+
150163
## Verify this step {#verify-step}
151164

152165
1. Sign in as a customer to the website using the email `[email protected]` and password `b1b2b3l@w+`.

src/guides/v2.3/graphql/tutorials/checkout/checkout-billing-address.md

Lines changed: 8 additions & 234 deletions
Original file line numberDiff line numberDiff line change
@@ -17,21 +17,16 @@ contributor_link: https://www.atwix.com/
1717
{:.bs-callout-tip}
1818
You must always set the billing address to place an order.
1919

20-
Use the [setBillingAddressOnCart]({{ page.baseurl }}/graphql/mutations/set-billing-address.html) mutation to set a billing address. You can set the billing address in the following ways:
20+
Use the [setBillingAddressOnCart]({{ page.baseurl }}/graphql/mutations/set-billing-address.html) mutation to set a billing address.
2121

22-
* Add a new billing address
23-
* Add a new billing address and set it as the shipping addresses
24-
* Use an address from the logged-in customer's address book
22+
## Add a billing address to the cart
2523

26-
## Add a new billing address
24+
Similar to the shipping address, add a billing address to the cart. `{ CART_ID }` is the unique shopping cart ID from [Step 2. Create empty cart]({{ page.baseurl }}/graphql/tutorials/checkout/checkout-add-product-to-cart.html). The street address is also different, so we can see that different addresses are being created.
2725

28-
The following mutation adds a new billing address. `{ CART_ID }` is the unique shopping cart ID from [Step 2. Create empty cart]({{ page.baseurl }}/graphql/tutorials/checkout/checkout-add-product-to-cart.html).
26+
Send the customer's authorization token in the `Authorization` parameter of the header. See [Authorization tokens]({{page.baseurl}}/graphql/authorization-tokens.html) for more information.
2927

3028
**Request:**
3129

32-
{:.bs-callout .bs-callout-info}
33-
For logged-in customers, send the customer's authorization token in the `Authorization` parameter of the header. See [Authorization tokens]({{page.baseurl}}/graphql/authorization-tokens.html) for more information.
34-
3530
```graphql
3631
mutation {
3732
setBillingAddressOnCart(
@@ -42,236 +37,15 @@ mutation {
4237
firstname: "John"
4338
lastname: "Doe"
4439
company: "Company Name"
45-
street: ["320 N Crescent Dr", "Beverly Hills"]
40+
street: ["64 Strawberry Dr", "Beverly Hills"]
4641
city: "Los Angeles"
4742
region: "CA"
43+
region_id: 12
4844
postcode: "90210"
4945
country_code: "US"
5046
telephone: "123-456-0000"
51-
save_in_address_book: false
52-
}
53-
}
54-
}
55-
) {
56-
cart {
57-
billing_address {
58-
firstname
59-
lastname
60-
company
61-
street
62-
city
63-
region{
64-
code
65-
label
66-
}
67-
postcode
68-
telephone
69-
country {
70-
code
71-
label
72-
}
73-
}
74-
}
75-
}
76-
}
77-
```
78-
79-
**Response:**
80-
81-
```json
82-
{
83-
"data": {
84-
"setBillingAddressOnCart": {
85-
"cart": {
86-
"billing_address": {
87-
"firstname": "John",
88-
"lastname": "Doe",
89-
"company": "Company Name",
90-
"street": [
91-
"320 N Crescent Dr",
92-
"Beverly Hills"
93-
],
94-
"city": "Los Angeles",
95-
"region": {
96-
"code": "CA",
97-
"label": "California"
98-
},
99-
"postcode": "90210",
100-
"telephone": "123-456-0000",
101-
"country": {
102-
"code": "US",
103-
"label": "US"
104-
}
105-
}
106-
}
107-
}
108-
}
109-
}
110-
```
111-
112-
## Add a new address for billing and shipping
113-
114-
The following mutation includes the `same_as_shipping` attribute, which allows the same address to be used for billing and shipping.
115-
116-
**Request:**
117-
118-
```text
119-
mutation {
120-
setBillingAddressOnCart(
121-
input: {
122-
cart_id: "{ CART_ID }"
123-
billing_address: {
124-
address: {
125-
firstname: "John"
126-
lastname: "Doe"
127-
company: "Company Name"
128-
street: ["320 N Crescent Dr", "Beverly Hills"]
129-
city: "Los Angeles"
130-
region: "CA"
131-
postcode: "90210"
132-
country_code: "US"
133-
telephone: "123-456-0000"
134-
save_in_address_book: false
135-
}
136-
same_as_shipping: true
137-
}
138-
}
139-
) {
140-
cart {
141-
billing_address {
142-
firstname
143-
lastname
144-
company
145-
street
146-
city
147-
region{
148-
code
149-
label
150-
}
151-
postcode
152-
telephone
153-
country {
154-
code
155-
label
156-
}
157-
}
158-
shipping_addresses {
159-
firstname
160-
lastname
161-
company
162-
street
163-
city
164-
postcode
165-
telephone
166-
country {
167-
code
168-
label
169-
}
170-
}
171-
}
172-
}
173-
}
174-
```
175-
176-
**Response:**
177-
178-
```json
179-
{
180-
"data": {
181-
"setBillingAddressOnCart": {
182-
"cart": {
183-
"billing_address": {
184-
"firstname": "John",
185-
"lastname": "Doe",
186-
"company": "Company Name",
187-
"street": [
188-
"320 N Crescent Dr",
189-
"Beverly Hills"
190-
],
191-
"city": "Los Angeles",
192-
"region": {
193-
"code": "CA",
194-
"label": "California"
195-
},
196-
"postcode": "90210",
197-
"telephone": "123-456-0000",
198-
"country": {
199-
"code": "US",
200-
"label": "US"
201-
}
202-
},
203-
"shipping_addresses": [
204-
{
205-
"firstname": "John",
206-
"lastname": "Doe",
207-
"company": "Company Name",
208-
"street": [
209-
"320 N Crescent Dr",
210-
"Beverly Hills"
211-
],
212-
"city": "Los Angeles",
213-
"postcode": "90210",
214-
"telephone": "123-456-0000",
215-
"country": {
216-
"code": "US",
217-
"label": "US"
218-
}
219-
}
220-
]
221-
}
222-
}
223-
}
224-
}
225-
```
226-
227-
## Use an existing customer address
228-
229-
First, query the customer to return the list of address IDs.
230-
231-
**Request:**
232-
233-
```text
234-
query {
235-
customer {
236-
addresses {
237-
id
238-
default_billing
239-
default_shipping
240-
}
241-
}
242-
}
243-
```
244-
245-
**Response:**
246-
247-
```text
248-
"data": {
249-
"customer": {
250-
"addresses": [
251-
{
252-
"id": 2,
253-
"default_billing": true,
254-
"default_shipping": true
47+
save_in_address_book: true
25548
}
256-
]
257-
}
258-
}
259-
}
260-
```
261-
262-
Set `{ CUSTOMER_ADDRESS_ID }` to an `id` returned in the query.
263-
264-
`{ CART_ID }` is the unique shopping cart ID from [Step 2. Create empty cart]({{ page.baseurl }}/graphql/tutorials/checkout/checkout-add-product-to-cart.html).
265-
266-
**Request:**
267-
268-
```text
269-
mutation {
270-
setBillingAddressOnCart(
271-
input: {
272-
cart_id: "{ CART_ID }"
273-
billing_address: {
274-
customer_address_id: { CUSTOMER_ADDRESS_ID }
27549
}
27650
}
27751
) {
@@ -310,7 +84,7 @@ mutation {
31084
"lastname": "Doe",
31185
"company": "Company Name",
31286
"street": [
313-
"320 N Crescent Dr",
87+
"64 Strawberry Dr",
31488
"Beverly Hills"
31589
],
31690
"city": "Los Angeles",

0 commit comments

Comments
 (0)