Fix action sending for advanced ecommerce

react/events/enhancedCommerce.ts

@@ -1,9 +1,5 @@
 import { getCategory } from './../utils'
 
-/** Product viewed event
- * https://developers.google.com/analytics/devguides/collection/analyticsjs/enhanced-ecommerce#measuring-actvities
- */
-
 interface Item {
   itemId: string
   name: string
@@ -22,6 +18,9 @@ interface Product {
 const getSkuName = (selectedSku: string, items: Item[]) =>
   (items.find((item: Item) => selectedSku === item.itemId) || ({} as Item)).name
 
+/** Product viewed event
+ * https://developers.google.com/analytics/devguides/collection/analyticsjs/enhanced-ecommerce#measuring-actvities
+ */
 export const productDetail = (product: Product) => {
   ga('ec:addProduct', {
     brand: product.brand,
@@ -56,7 +55,11 @@ export const productClick = (product: Product) => {
     variant: getSkuName(product.selectedSku, product.items),
   })
   ga('ec:setAction', 'click')
-  ga('send', 'event', 'productClick', 'click')
+  ga('send', 'event', {
+    eventAction: 'Click',
+    eventCategory: 'Product',
+    nonInteraction: 1,
+  })
 }
 
 /** Purchase event

react/index.tsx

@@ -1,5 +1,9 @@
 import { orderPlaced } from './events/commonEvents'
-import { productDetail, purchase } from './events/enhancedCommerce'
+import {
+  productDetail,
+  productClick,
+  purchase,
+} from './events/enhancedCommerce'
 
 const gaId = window.__SETTINGS__.gaId
 
@@ -47,6 +51,12 @@ window.addEventListener('message', e => {
     return
   }
 
+  // Event listener for productClick
+  if (e.data.event === 'productClick') {
+    productClick(e.data.product)
+    return
+  }
+
   // Event listener for orderPlaced
   if (e.data.event === 'orderPlaced') {
     orderPlaced(e.data)