Working on a custom reviews list on our product page. When we try to add the review form we get a "Uncaught SyntaxError: "undefined" is not valid JSON" error, which points to layouts.js:
if (cached) {
cachedConfig[_.keys(nodes)[0]] = JSON.parse(JSON.stringify(nodes));
}
Our catalog_product_view.xml:
<?xml version="1.0"?>
<page layout="1column" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<body>
...
<referenceContainer name="content">
<!-- Add custom reviews block -->
<container name="div.reviews" as="div.reviews" after="div.product_disclaimer" htmlTag="div" htmlId="reviews">
<block class="Magento\Review\Block\Product\View\ListView" name="product_review_block" as="product_review_block" template="product/view/list.phtml" ifconfig="catalog/review/active"/>
</container>
<!-- Load review form -->
<container name="div.review-form" as="div.review-form" after="div.reviews" htmlTag="div" htmlId="review-form">
<block class="Magento\Review\Block\Form" name="product.review.form" as="review_form" ifconfig="catalog/review/active">
<container name="product.review.form.fields.before" as="form_fields_before" label="Review Form Fields Before"/>
</block>
</container>
</referenceContainer>
....
<!-- remove default reviews tab -->
<referenceBlock name="reviews.tab" remove="true"/>
</body>
</page>
The review form shows up and works fine, however some other javascript functions break on the page because of the syntax error. Any ideas what's causing this? It's should load the default Magento review form.
update: it seems like the $block->getJsLayout()
function inside the form.phtml returns nothing. So there is no component identifier. By copying and setting the component manually, the error does dissappear, but the review form stops working.. not sure how to properly overwrite this form.phtml.
"[data-role=product-review-form]": {
"Magento_Ui/js/core/app": {"components":{"review-form":{"component":"Magento_Review\/js\/view\/review"}}}
}