Help with invalid product

Support
, ,
#1

I’m unable to get a test order from checkout and see it in the dashboard. I’m using a Nuxt 2 site with a Strapi backend where you can create products and it’s pulled in via API to the Nuxt components. My product component looks like:

image
image1496×608 70.9 KB

Error message I keep getting: An attempt to create an order with invalid products has been made.

image
image2014×240 38.4 KB

I’ve tried looking at the JSON crawler but I don’t have a backend to work off of so really stuck.

Link to product on netlify vapedcrusader

Been stuck on this for months can anyone please help me get my orders working?

#2

The message Found 0 snipcart-add-item elements with ids [] suggests that document.querySelectorAll is not finding that button.

And from my experience data-item-id can be any product id even “xxxxxx” and the item will be added to the cart. Perhaps verified later on purchase but it will be added

#3

Thanks for replying. I’m able to add to cart and checkout but it fails on when using test payment method. If I inspect the product in console I can see all the right things the url, the product id, price etc:

image
image1474×184 64.4 KB

The message I get is to do with product crawling failed. As it’s vue and using binded vars I’m guessing the snipcart crawler is unable to find it via a live site somehow which doesn’t make sense. If there is a way around then I’m not sure, but so far everything points to using the JSON Crawler and I’m not sure how to implement that with no backend and in Vue only.

Here is the full dev log:

image
image2020×394 73.1 KB

#4

It possible that you may simply need to add that domain (https://incandescent…) in the Dashboard.

Log into your dashboard, go to Settings > General and in the Allowed domains & subdomains section click on Manage domains .

Alternatively,
The crawling it seems comes during the final checkout process – not when an item is added. There isn’t great documentation on the crawling process actually. In my opinion each product needs to be associated with their own snipcart-add-item button. Just finding the data-item-id in the page is not sufficient.

I see you have variations of Size and Flavour.

So, if you have several variations and then use a js script to change the data-item-id and other data attributes to the that snipcart-add-item button then the crawl will actually not find the product in the cart. That was my experience.

What I did was create one page with all product variations with their own f*n snipcart button. And provided that one in the data-item-url. Stupid but it worked.

#5

I went to your site. The button seems fine. The issue imho: Your products are not know by the backend.

I believe you need to goto your Dashboard. Goto Products and then FETCH. Provide the URL of that product . Try this link with your login: Login - Snipcart

Then you will have a product with an ID of ‘1’