Fluid if condition fails to detect image?

Question

I am looping over a list of categories and trying to render an image if it exists.

My problem is the IF condition comes up false. If I remove the condition it will render the image just fine, but it will break the site if there is no image.

<f:for each="{categories}" as="cat">
    <f:if condition="{cat.image}"><f:image image="{cat.image}" /></f:if>
    <span>{cat.title}</span>
</f:for>

Edit - A Workaround:

As this template is an override for a third party extension, I cannot fix the core issue. But I came up with a workaround:

I can use <f:cObject typoscriptObjectPath="lib.getCatImg" data="{img: cat.image }" />

Then I created a basic FLUIDTEMPLATE in typoscript:

lib.getCatImg = FLUIDTEMPLATE
lib.getCatImg {
    templateName = CatImage
    templateRootPaths.10 = EXT:my_site/Resources/Private/Templates/
}

Finally, in the new template I can use <f:if condition="{data.img}"> and it works as expected. If there is a simpler way, let me know.

Answer 1

In general, the code looks good.

Without more information about the category model and the image property, the following is just a hunch.
TYPO3 v9 (and TYPO3 v10) uses Fluid 2.6 and there are problems with the variables if the property uses a LazyLoadingProxy. This problem should be fixed from TYPO3 v11 using Fluid 2.7.

If my assumption is correct there are the following solutions:

1. remove the LazyLoadingProxy in the model for the image property.
2. maybe it helps not to check for {cat.image} itself in Fluid but to generate the image URL - so use {f:uri:image(image:cat.image)} in the condition.
3. rather in the mid-term but quite recommended: Update to TYPO3 v11.
   TYPO3 v9 LTS reached its end of free support on 30 September 2021