Recipe instructions in object-form should be importable

[callingshotgun]

Imported a recipe from this URL: https://justcook.butcherbox.com/cuts/pork/pork-loin-roast/ , which has the recipe in JSON-LD format embedded in the web page.

Image, name, ingredient list, and cooking time were imported just fine, but instructions are not imported, if one looks at the raw json generated, the "recipeInstructions" is an empty array.

Especially odd because if one looks at the JSON-LD that's in the web page in question, recipeInstructions is clearly a populated array. Problem is likely related to the fact this recipe divides its steps into sections.

For convenience, I used getld and jq to extract and inspect raw json from the original recipe URL in question, like so:

# get CLI tool for extracting JSON-LD from urls
go get github.com/daetal-us/getld

# json swiss army knife
sudo apt-get install jq

# get recipe, format it for human eyeball compatibility.
getld https://justcook.butcherbox.com/cuts/pork/pork-loin-roast/ | jq . > readable-recipe.json

[christianlupus]

I just looked at the named recipe. The problem is an incompatibility with the current version of the NC app. For now, we are assuming the individual recipe steps to be of pure textual form. The recipe you mentioned uses an object to represent an instruction. This is valid according to the standard (schema.org) but not (yet) implemented in the app.

[christianlupus]

@sam-19 I see this as a mere Vue related issue. Thus, I add you as assignee. If you think there is anything, I can do from the backend perspective, just ping me.

If anyone else wants to give it a try, just write a comment here for synchronization.

[ptoulouse]

Same here with this recipe. It has HowToSections.

[Baton4986]

Hi, are there any plans to fix this? We have the same problem in our club with a lot of sites following the standard of schema.org.

Example:
https://www.alnatura.de/de-de/rezepte/suche/salatwraps-mit-erdnuss-orangen-sauce-105569/

[sam-19]

This issue was assigned to me in the past, since it was thought to be Vue-related. Looking back at the source code (which has since changed quite a bit, for the better), this doesn't seem to be the case, at least not anymore. Here the recipe link is simply sent via API call to the backend, where I assume the parsing happens:

cookbook/src/components/AppNavi.vue

Line 267 in fadfb68

url: `${this.$window.baseUrl}/import`,

So if the instructions are not passed into the generated raw JSON file, the problem most likely lies in the backend.

[christianlupus]

I just tried and it seems most probably here is a problem in the backend. The recipe instructions are stored as [] within the JSON in NC. However, I need to investigate further.

I will remove @sam-19 as assignee as it is indeed a backend problem. Sorry, I thought the JSON would not be tweaked and just the presentation layer in Vue was broken. I see I was wrong, my apologies.