adobe / aem-core-cif-components

A set of configurations and components to get you started with AEM Commerce development
Apache License 2.0
103 stars 80 forks source link

Change eventInfo["@id"] to eventInfo.path to align with WCM core components #855

Closed knennigtri closed 2 years ago

knennigtri commented 2 years ago

User Story

Currently the WCM core components have a standard for ACDL onClick events to be something like:

"eventInfo": {
    "path": "component.<cmpID>"
}

Or

"eventInfo": {
    "path": "page.<pageCmpID>"
}

But for some reason the cif:addToCart and cif:addToWishList use something like:

"eventInfo": {
    "@id": "<cmpID>"
    "xdm:SKU": "<item.sku>",
    "xdm:quantity": "<item.quantity>"
}

This makes it difficult to easily find the associated cif component in a similar fashion as wcm core components. Further, the @id field seems wrong when injected into the data layer. The data layer might have:

"component": {
{
    "product-7fc286dec9": {
        "xdm:currencyCode": "USD",
        "xdm:categories": [ ... ],
        "xdm:SKU": "VT11",
        "xdm:assets": [ ... ],
        "xdm:listPrice": 68,
        "dc:description": "<p>The Valeria Tank features two layers of possibility. The loose fit flatters without impacting comfort and the tiered material hangs beautifully. Wear alone or add a belt for a little more definition. </p><p>Features:</p><ul><li>Scoop neck</li><li>Sleeveless</li><li>Sits below the hips</li><li>Two layers</li><li>Machine wash, tumble dry low</li></ul>",
        "dc:title": "Valeria Two-Layer Tank",
        "@type": "venia/components/commerce/product",
        "parentId": "page-f9dfabef95"
    }
}
}

but then the cif:addToCart event will output:

{
    "event": "cif:addToCart",
    "eventInfo": {
        "@id": "product-959e7c2ecb",
        "xdm:SKU": "VT11-RN-M",
        "xdm:quantity": "1"
    }
}

In an ideal world (in line with wcm core components) the expected behavior should be:

{
    "event": "cif:addToCart",
    "eventInfo": {
        "path": "component.product-7fc286dec9",
        "xdm:SKU": "VT11-RN-M",
        "xdm:quantity": "1"
    }
}

Where there is eventInfo.path and the path can quickly be injected to get the associated component. adobeDataLayer.getState(event.message.eventInfo.path)

buuhuu commented 2 years ago

Tracked as part of CIF-2865