render json ld to products metadata sheet

[hannessolo]

Adds json LD to metadata sheet generation

Test URLs:

• Before: https://main--aem-boilerplate-commerce--hlxsites.aem.live/
• After: https://json-ld-metadata--aem-boilerplate-commerce--hlxsites.aem.live/

[aem-code-sync]

Hello, I'm the AEM Code Sync Bot and I will run some actions to deploy your branch and validate page speed.
In case there are problems, just click a checkbox below to rerun the respective action.

• Re-run PSI checks
• Re-sync branch

Commits

• b29c1ec 🔄 (latest)
• 382d9bc ✅

[aem-code-sync]

	Page	Scores	Audits	Google
📱	/
🖥️	/

[herzog31]

For a SimpleProductView we can add a single offer like done here. For a ComplexProductView we should add all available variants.

For this we can use a query like this:

{
  variants(sku: "MJ12", optionIds: [], pageSize: 100) {
    variants {
      selections
      product {
        sku
        inStock
        __typename
        images(roles: "image") {
          url
        }
        ... on SimpleProductView {
          price {
            ...priceFields
          }
        }
      }
    }
    cursor
  }
}

If desired by the customer this could also be limited to specific variant axis (e.g. show color variants, but not the size ones).

[hannessolo]

I don't think this was done in the client-side setJsonLd so far:

aem-boilerplate-commerce/blocks/product-details-custom/product-details-custom.js

Line 36 in e4d9117

async function setJsonLdProduct(product) {

Should we update the client side function too?

[herzog31]

Good point. I think we were actually waiting for the variants query to be available on prod CS. If you can re-use the same code, feel free to update PDP as well. Otherwise we can also handle it in a separate issue.