How To Demo "Add Product with Options to Cart"

Step #1

Create a product with options.

---

Step #2

Create cartId.

Example Mutation:

 mutation {
   createEmptyCart
 }

Example Response:

 {
   "data": {
     "createEmptyCart": "dM1ZlCDjKPfNH85CIWU5RJyY8dYuMiwT"
   }
 }

---

Step #3

Add Product to cart.

Example Mutation: (edit and left the only fields you need)

mutation{
  addProductsToCart(
    cartId: "type your cartId here", 
    cartItems: 
  [
           {
                sku: "type created product SKU here"
                quantity: 1
                    selected_options: [
                    	"Dropdown Option UID",                # for customizable option
                        "Radio Buttons Option UID",           # for customizable option
                        "Checkbox Option UID",                # for customizable option
                        "Multiple Select Option 1 UID",       # for customizable option
                        "Multiple Select Option 2 UID",       # for customizable option
                        "Configurable Product Option 1 UID",  
                        "Configurable Product Option 2 UID",  
                        "Bundle Product Option 1 UID",        
                        "Bundle Product Option 2 UID",
                        "Downloadable Product Option 1 UID",        
                        "Downloadable Product Option 2 UID"          
                   ],
                    entered_options: [{
                        uid: "Text Field UID"         # for customizable option
                        value: "Text Field Text"
                    },
                      {
                        uid: "Text Area UID"          # for customizable option
                        value: "Text Area Text"
                    },
                   {
                        uid: "Date Option UID"        # for customizable option
                        value: "2020-09-02 17:16:18"
                    },
                   {
                        uid: "Date&Time Option UID"   # for customizable option
                        value: "2020-09-02 17:16:18"
                    },
                   {
                        uid: "Time Option UID"        # for customizable option
                        value: "2020-09-02 17:16:18"
                    },
                    ]
            }
  ]
  ) {
    cart
    {
      id
      items
      {
        id
        quantity
        product
        {
          id
          name
        }
      }
    }
    user_errors
    {
      message
      code
    }
  }
}

---

Step #4

Expected Result - product is added to Cart with selected options.

Exemple Response:

---

Consider The Following

Product Types and Options Mapping

Customizable Options is available for all product types, see additional info in Customizable Options Section

---

Customizable Options:

Customizable Options Types

Selectable Types: (need just UID)

• Drop-down
• Radio Buttons
• Checkbox
• Multiple Select

Enterable Types: (need UID and value)

• Text Field
• Text Area
• File
• Date
• Date & Time
• Time

Required Customizable Options

The product shouldn't be added to the cart until all required customizable options are selected or entered.

Error Message Example:

      "user_errors": [
        {
          "message": "The product's required option(s) weren't entered. Make sure the options are entered and try again.",
          "code": "UNDEFINED"
        }
      ]

Multiple Select Customizable Option Type

Several UID could be specified at one time

---