Hi,
After updating SP Page Builder to version 6.3.0, accessing the list of items in a Dynamic Collection containing an "Image" field results in a broken page in the Joomla backend.
The browser console shows the following error during the XHR request to task=/collections.list:
SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data
I want to point out that to be sure, I tried to download the full installer of the Agentik and Artolio versions, and I managed to reproduce the same problem also in your installation in Joomla 6, when you upgrade from Joomla 6.0.x to 6.0.3 and Page Builder 6.2.3 to 6.3.0.
To reproduce, just follow these steps:
- Create a Dynamic Collection.
- Add an "Image" field to the collection.
- Add a new item, upload/select an image, and save.
- Return to the Collection Items list. The page breaks.
In v6.3.0, the Image field now correctly saves data as a JSON string to include the Alt Text (e.g., {"src":"...","alt":""}).
You can understand this if you try a downgrade from 6.3.0 to 6.2.3, because in the image path field we find, between curly brackets, everything including the path and the alt text.
However, the backend service preparing the list wasn't updated to decode this new format.
In administrator/components/com_sppagebuilder/dynamic-content/Services/CollectionItemsService.php, inside the makeCollectionItem() method (around line 801), the code does this:
if ($value->field_type === FieldTypes::IMAGE) {
$value->value = CollectionHelper::getImageUrl($value->value);
}
Since CollectionHelper::getImageUrl() expects a plain string path but receives a JSON string, it throws a PHP Warning. This PHP Warning gets printed before the actual JSON response, corrupting the payload and causing the React/JS frontend to crash during JSON.parse().
To fix the issue, I made a change to the above file and applied it locally, and it fixed the issue for me:
if ($value->field_type === FieldTypes::IMAGE) {
$imageValue = $value->value;
// Check if it's the new JSON format (v6.3.0+)
if (is_string($imageValue) && strpos(trim($imageValue), '{') === 0) {
$decodedData = json_decode($imageValue, true);
if (is_array($decodedData) && isset($decodedData['src'])) {
$imageValue = $decodedData['src'];
}
}
// Pass the clean string to the helper
$value->value = CollectionHelper::getImageUrl($imageValue);
}
Hope this helps the team release a quick fix in the next update!
I want to point out that in the tests performed on the Agentik and Artolio installations, to reproduce the error, all I had to do was enter an existing collection where an image was expected, access a record, save, and return to the list. This step, requiring the image URL field to be saved in the new json include format, immediately displayed the error.