Conditional images within Repeater field return null

[miacias]

Description

I have existing data that I cannot retrieve from ACF via WPGraphQL. Specifically, the productImage field, nested within two repeaters, is returning null when images are saved.

Steps to reproduce

I'm not sure if the conditional element matters or the styled layout of the repeater fields, so here is everything from my experience that caused the issue:

1. Create a field group called "Sale" that applies to a Post's category
2. Add a repeater field to the field group called "Categories" with a layout of Block
3. Add a checkbox field to the Categories field group called "Category Name" with a pre-filled choice list
4. Add a repeater field called "Products" with a layout of Table inside the Categories repeater
5. Add a true/false field inside the Products repeater called "Popular"
6. Add an image field called "Product Image" that conditionally appears only when the "Popular" true/false field's value is true (checked) with a return format of Image URL
7. Create a Post, select the given category, "Sale," that will populate the "Products" field group
8. Make a set of 5 products with some popular and some not popular. For products that are popular, add an image
9. Query the post by databaseId

---

example query:

query GetSalePostById($databaseId: ID!, $asPreview: Boolean = false) {
  post(id: $databaseId, idType: DATABASE_ID, asPreview: $asPreview) {
    databaseId
    sale {
      popular
      productImage {
        node {
          sourceUrl
          mediaDetails {
            width
            height
          }
        }
      }
    }
  }
}

example query variables:

{
  "databaseId": "467"
}

PHP or JSON export of the ACF Field Group(s)

acf-export-2024-09-16.zip

Additional context

No response

WPGraphQL Version

1.28.1

WPGraphQL For ACF Version

2.4.1

ACF (Advanced Custom Fields) Version. Free or Pro?

Pro 6.3.6

WordPress Version

6.6.2

PHP Version

8.3.8

Additional enviornment details

additional plugins

• Faustjs v1.4.1

coding environment

• LocalWP v9.0.5+6706
• MySQL v8.0.16

Front end framework: Nextjs

package.json

"dependencies": {
    "@apollo/client": "^3.11.8",
    "@faustwp/cli": "^3.1.0",
    "@faustwp/core": "^3.1.0",
    "@fortawesome/fontawesome-free": "^6.6.0",
    "@fortawesome/fontawesome-svg-core": "^6.6.0",
    "@fortawesome/free-brands-svg-icons": "^6.6.0",
    "@fortawesome/free-regular-svg-icons": "^6.6.0",
    "@fortawesome/free-solid-svg-icons": "^6.6.0",
    "@fortawesome/react-fontawesome": "^0.2.2",
    "@wordpress/base-styles": "^5.7.0",
    "@wordpress/block-library": "^9.7.0",
    "classnames": "^2.5.1",
    "graphql": "^16.9.0",
    "next": "^14.2.11",
    "react": "18.3.1",
    "react-dom": "18.3.1",
    "sass": "^1.78.0",
    "sharp": "^0.33.5"
  },
  "devDependencies": {
    "next-secure-headers": "^2.2.0"
  },
  "engines": {
    "node": ">=18",
    "npm": ">=8"
  }

Please confirm that you have searched existing issues in the repo.

• [X] Yes

Please confirm that you have disabled ALL plugins except for WPGraphQL, WPGraphQL For ACF, ACF, etc.

• [X] Yes
• [ ] My issue is with compatibility with a specific WordPress plugin, and I have listed all my installed plugins (and version info) above.

[miacias]

This looks similar https://github.com/wp-graphql/wpgraphql-acf/issues/208

[miacias]

Here are some screenshots showing this issue in action where the images exist but return null:

[miacias]

Results from testing with other ACF types below within the given constraints from above (field nested in repeater, nested in repeater):

unexpected behavior:

• gallery returns empty array
• file returns null
• image returns null

expected behavior:

• number returns number
• text returns text
• true/false returns true/false
• wysiwyg editor returns html string
• embed link returns embed link

[jamiemorganward]

I have had a similar issue. Image fields inside a nested repeater with a return_format of 'url' will always show up as 'null' in the GraphQL response.

I haven't been able to work out exactly what is going on, but it seems to be because all image GraphQL fields are registered as a MediaItem connection in the schema, but the entire repeater field array is passed into the resolver. In this case the value of the image field is a URL, which doesn't match the schema.

I haven't tested it but I'd assume it's the same situation with files too. I also added some Page Links and they consistently show up as null. Again page links are strings but the schema defines them as connections as mentioned in #208.

It seems that there's an issue with repeater fields where the schema of nested fields doesn't always match what's returned by ACF.

In my case I was simply able to change the return_format of the image field to 'array' and that fixed it.

[miacias]

@jamiemorganward very good! Thank you for your insight on getting around this. I'm curious how this will be handled moving forward. Do you think this classes as a bug or is technically working as intended?

[adamhake]

We've run into this issue as well with an image field nested in a repeater field. @jamiemorganward 's insight worked for us: we changed the return type from image URL to image array to work around it.