Synchronise ecom frontend to backend

Ask the community
, , ,
1

I am writing javascript to add products to cart. when i use AddToCurrentCartFunction(), i can see on the console that the product has been added, however when i click on the cart icon it takes me to a different cart that is empty. When I use wixEcomFrontend.navigateToCartPage() I have the same result. When I use getcurrentcart() it returns the correct information for the same cart used in the add to cart function. I have deleted current cart and started again but seen no change. I assume I have to synchronise the ecom frontend with backend (at least that is chatgpt reccomendation) but I dont know how.
Any help would be appreciated, thanks :slight_smile:

import { myCreateCartFunction } from “backend/my-backend-file.web”;
import { myGetCurrentCartFunction } from “backend/my-backend-file.web”;
import { myAddToCurrentCartFunction } from “backend/my-backend-file.web”;
import { myUpdateCurrentCartFunction } from “backend/my-backend-file.web”;
import { cart } from “wix-stores”;
import { myDeleteCurrentCartFunction } from “backend/my-backend-file.web”;
import { myAddToCartFunction } from “backend/my-backend-file.web”;
import wixEcomFrontend from “wix-ecom-frontend”;
import wixEcomBackend from “wix-ecom-backend”;

let cartId = “0”;

$w.onReady(function () {

$w('#button4').onClick(() => {
    let proceed = check1();
    console.log(`is answer correct: ${proceed}`);

    if (proceed === 1) {
        myAddToCurrentCartFunction(options1)
            .then((updatedCurrentCart) => {
                console.log('Success! Updated cart:', updatedCurrentCart);
                wixEcomFrontend.navigateToCartPage();
            })
            .catch((error) => {
                console.error(error);
            });

    }

    $w(`#text35`).onClick(() => {
        wixEcomFrontend.navigateToCartPage();
    })

 


    // Add event listener for cart changes
    cart.onChange((cart) => {
        updateCartIcon(cart);
    });

    // Function to update the cart icon
    function updateCartIcon(cart) {
        const totalQuantity = cart.lineItems.reduce((sum, item) => sum + item.quantity, 0);
        $w('#shoppingCartIcon2').show = totalQuantity.toString();
    }
})

function check1() {
    let answer1 = $w("#radioGroup1").value;
    let correctAnswer1 = "answer";
    let quantity1 = $w("#slider1").value;
    console.log(`answer1=${answer1} Correct answer=${correctAnswer1} Quantity=${quantity1}`);
    if (correctAnswer1 === answer1) {
        let correct = 1;
        return correct;
    } else {
        let correct = 0;
        return correct;
    }
}

const options1 = {
    "lineItems": [{
        "catalogReference": {
            "appId": "215238eb-22a5-4c36-9e7b-e7c08025e04e",
            "catalogItemId": "1b42195a-f966-6e38-9bc6-a7125fed0061",
            "options": {}
        },
        "quantity": $w("#slider1").value
    }]
};

$w('#text33').onClick(() => {
    myDeleteCurrentCartFunction()
        .then(() => {
            console.log("Success! Deleted current cart");
            return;
        })
        .catch((error) => {
            console.error(error);
            // Handle the error
        });
})

$w('#text34').onClick(() => {

    myGetCurrentCartFunction()
        .then((myCurrentCart) => {
            const formattedCartTotal = myCurrentCart.subtotal.formattedAmount;
            //const numberOfCartLineItems = myCurrentCart.lineItems.length;

            console.log("Success! Retrieved current cart:", myCurrentCart);
            cartId = myCurrentCart._id;
            console.log(`cart ID = ${cartId}`);
            return myCurrentCart;
        })
        .catch((error) => {
            console.error(error);
            // Handle the error
        });
})

});