Question:I am trying to connect a custom catalog to Wix stores but whenever I do, I receive this Error “Cannot read properties of undefined (reading ‘catalogItemId’)”. Once I press the add to cart button. everything is supposed to be added to the cart, but I end up with that error.
The CMS
Product:I am using Wix studios
What are you trying to achieve:I am trying to have my CMS items go to my cart. for example the price, picture and name.
What have you already tried:I am following these documentations
Connect a Custom Catalog to Wix Stores
eCommerce Catalog Service Plugin
Wix service plugins (formerly SPIs and custom extensions) allow you to implement custom logic to change how your site behaves and displays. For example, when you set up a Wix eCommerce site, there are a limited number of catalogs to choose from and...
addToCart( )
https://dev.wix.com/docs/velo/api-reference/wix-ecom-backend/cart/add-to-cart
Additional information:Here i will post my code and below I will post my Errors from my log and developer console.
Dynamic page (Custom Products (Iteam ))
import { addTocart } from 'backend/cart.web';
$w.onReady(function () {
$w("#addToCartButton").onClick(addCustomProductToCart);
});
async function addCustomProductToCart() {
$w("#dynamicDataset").onReady(async ()=>{
const currentItem =$w('#dynamicDataset').getCurrentItem();
const productId = currentItem._id;
const updatedCart = await addTocart(productId);
console.log("updated cart", updatedCart);
})
}
Cart.web.js (Backend)
import { Permissions, webMethod } from "wix-web-module";
import { currentCart } from "wix-ecom-backend";
export const addTocart = webMethod(
Permissions.Anyone,
async (productId) => {
const options = {
"lineItems": [
{
"catalogReference": {
"catalogItemId": "productId",
"appId": "5e82be8d-8a7c-4fda-ad42-47012802dd16",
},
"quantity": 1
}]
}
try {
const updatedCart = await currentCart.addToCurrentCart(options);
console.log("Updated cart:", updatedCart);
return updatedCart;
} catch (error) {
console.error("Error adding to cart:", error);
//throw error;
}
}
);
my-catalog-config.js (service plug in)
export function getConfig() {
return {};
}
my-catalog.js (service plug in)
import wixData from 'wix-data';
export const getCatalogItems = async (options, context) => {
const {catalogReferences} = options;
console.log("catalog refrences", catalogReferences);
let catalogIteams = [];
for (let reference of catalogReferences){
const {catalogReferences} = reference;
const customProductsQueryResult = await wixData.query("CustomProducts").eq("_id", catalogReferences.catalogItemId).find({ suppressAuth: true });
console.log("query result", customProductsQueryResult);
const catalogItem = customProductsQueryResult.items[0];
const data = {
productName: {
original: catalogItem.productName,
},
itemType: {
preset: "PHYSICAL"
},
price: catalogItem.productPrice.toString(),
media: catalogItem.productImage,
}
catalogIteams.push({catalogReferences, data});
}
console.log("catalog iteams", catalogIteams);
return {catalogIteams};
};
Errors from my log and developer console.Log Errors/INFO
INFO
Details
“root”:{
“insertId”:
“…4JecGrFCC06AwEwNSjcGwB”
“timestamp”:
“2024-12-16T21:54:50.381Z”
“labels”:{
“siteUrl”:
“n/a”
“revision”:
“1324”
“namespace”:
“Velo”
“tenantId”:
“ba0bddbf-e6fc-409f-ad76-8654d2ecbea8”
“viewMode”:
“Site”
}
“sourceLocation”:{
“file”:
“backend/spi/ecom-catalog/my-catalog/my-catalog.js”
“line”:
36
“column”:
12
}
“operation”:{
“id”:
“1734386088.6453572523896132954317”
“producer”:
“backend”
}
“jsonPayload”:{
“message”:
“catalog refrences [{“catalogReference”:{“catalogItemId”:“productId”,“appId”:“5e82be8d-8a7c-4fda-ad42-47012802dd16”},“quantity”:1}]”
}
“receiveTimestamp”:
“2024-12-16T21:54:50.477Z”
}
ERROR
Details
“root”:{
“insertId”:
“…8JecGrFCC06AwEwNSjcGwB”
“timestamp”:
“2024-12-16T21:54:50.394Z”
“labels”:{
“siteUrl”:
“n/a”
“revision”:
“1324”
“namespace”:
“Velo”
“tenantId”:
“ba0bddbf-e6fc-409f-ad76-8654d2ecbea8”
“viewMode”:
“Site”
}
“sourceLocation”:{
“file”:
“backend/spi/ecom-catalog/my-catalog/my-catalog.js”
“line”:
42
“column”:
109
}
“operation”:{
“id”:
“1734386088.6453572523896132954317”
“producer”:
“backend”
}
“jsonPayload”:{
“message”:
“Cannot read properties of undefined (reading ‘catalogItemId’)”
}
“severity”:
“ERROR”
“receiveTimestamp”:
“2024-12-16T21:54:50.476Z”
}
ERROR
Details
“root”:{
“insertId”:
“…59bqz_FV0.xNrgtAYDCTSQ”
“timestamp”:
“2024-12-16T21:54:50.469Z”
“labels”:{
“revision”:
“-1”
“namespace”:
“Velo”
“tenantId”:
“ba0bddbf-e6fc-409f-ad76-8654d2ecbea8”
“viewMode”:
“Preview”
}
“sourceLocation”:{
“file”:
“backend/cart.web.js”
“line”:
26
“column”:
ERROR
Details
“root”:{
“insertId”:
“…59bqz_FV0.xNrgtAYDCTSQ”
“timestamp”:
“2024-12-16T21:54:50.469Z”
“labels”:{
“revision”:
“-1”
“namespace”:
“Velo”
“tenantId”:
“ba0bddbf-e6fc-409f-ad76-8654d2ecbea8”
“viewMode”:
“Preview”
}
“sourceLocation”:{
“file”:
“backend/cart.web.js”
“line”:
26
“column”:
20
}
“operation”:{
“id”:
“1734386088.6453572523896132954317”
“producer”:
“backend”
}
“jsonPayload”:{
“message”:
“Error adding to cart: message: Cannot read properties of undefined (reading ‘catalogItemId’) details: applicationError: description: Cannot read properties of undefined (reading ‘catalogItemId’) code: USER_CODE_UNKNOWN_EXCEPTION data: {}”
}
“severity”:
“ERROR”
“receiveTimestamp”:
“2024-12-16T21:54:50.588Z”
}
INFO
Details
“root”:{
“insertId”:
“…BxT9H5sU01Iua9vrSdHtMr”
“timestamp”:
“2024-12-16T21:54:50.522Z”
“labels”:{
“revision”:
“-1”
“namespace”:
“Velo”
“tenantId”:
“ba0bddbf-e6fc-409f-ad76-8654d2ecbea8”
“viewMode”:
“Preview”
}
“sourceLocation”:{
“file”:
“Custom Products (Item)”
}
“operation”:{
“id”:
“…Bso0sdzh87rvPsYksSNNoG”
}
“jsonPayload”:{
“message”:
“updated cart undefined”
}
“receiveTimestamp”:
“2024-12-16T21:54:50.792Z”
}
Developer Console
updated cart undefinedCustom Products (Item) Line 16
Error adding to cart: message: Cannot read properties of undefined (reading ‘catalogItemId’)details:applicationError:description: Cannot read properties of undefined (reading ‘catalogItemId’)code: USER_CODE_UNKNOWN_EXCEPTIONdata: {}B cart.web.js Line 26
Hi Aaron, Thanks for providing a detailed outline of the issue - this is a perfect model of how to ask a question in a way that allows others to provide assistance efficiently. One thing that caught my eye is that you are passing "productId" as a string to the catalogItemId:
This means that instead of passing the actual Id of the product when the add to cart function is called, it is just passing that same string. Does that help? Best, Eitan