gatsby-source-contentful not downloading images with downloadLocal true

Preliminary Checks

• This issue is not a duplicate. Before opening a new issue, please search existing issues: https://github.com/gatsbyjs/gatsby/issues
• This issue is not a question, feature request, RFC, or anything other than a bug report directly related to Gatsby. Please post those things in GitHub Discussions: https://github.com/gatsbyjs/gatsby/discussions

Description

There seems to be an issue with downloading images from contentful to local if downloadLocal is true. So this config seems to have bugs:

{
      resolve: `gatsby-source-contentful`,
      options: {
        spaceId: `1234`,
        accessToken: "1234",
        downloadLocal: true,
      },
    },

I tried it twice with two different contentful repositories and two gatsby sites. Sometimes no image is local, sometimes one, sometimes all. I tried different things such as downloadLocal: false then true so the images are loaded for gatsby develop. I also tried gatsby build + serve but same issues here. The images are always accessible without localFile in graphql which means that the images are correctly configured.

This is what I get:

{
    "edges": [
        {
            "node": {
                "localFile": {
                    "id": "6f1d839c-97d8-5694-b529-ab8f735a5418"
                }
            }
        },
        {
            "node": {
                "localFile": null
            }
        },
        {
            "node": {
                "localFile": null
            }
        }
    ]
}

I have a minimal reproduction repo at https://github.com/pbizimis/gatsby-contentful-bug. I used a new contentful account so if you need to check something there let me know and I give you the credentials.

(Images are from Unsplash and the config of the repo is not sensitive because the account is a throwaway)

Thanks!

Reproduction Link

https://github.com/pbizimis/gatsby-contentful-bug

Steps to Reproduce

1. Start it up
2. On localhost:8000/, there should be a console log that shows an object with an array of three (you should see that at least one is null).

Expected Result

localFile data is available for all images

Actual Result

localFile data is not available for all images

Environment

System:
    OS: Linux 5.11 Ubuntu 20.04.3 LTS (Focal Fossa)
    CPU: (16) x64 Intel(R) Core(TM) i9-9900K CPU @ 3.60GHz
    Shell: 5.8 - /usr/bin/zsh
  Binaries:
    Node: 14.17.6 - ~/.nvm/versions/node/v14.17.6/bin/node
    npm: 8.1.2 - ~/.nvm/versions/node/v14.17.6/bin/npm
  Browsers:
    Chrome: 95.0.4638.54
    Firefox: 94.0
  npmPackages:
    gatsby: ^4.1.0 => 4.1.0 
    gatsby-plugin-gatsby-cloud: ^4.1.0 => 4.1.0 
    gatsby-plugin-image: ^2.1.0 => 2.1.0 
    gatsby-plugin-manifest: ^4.1.0 => 4.1.0 
    gatsby-plugin-offline: ^5.1.0 => 5.1.0 
    gatsby-plugin-react-helmet: ^5.1.0 => 5.1.0 
    gatsby-plugin-sharp: ^4.1.0 => 4.1.0 
    gatsby-source-contentful: ^6.1.0 => 6.1.0 
    gatsby-source-filesystem: ^4.1.0 => 4.1.0 
    gatsby-transformer-sharp: ^4.1.0 => 4.1.0 
  npmGlobalPackages:
    gatsby-cli: 4.1.0

Config Flags

No response

[afladmark]

I’ve tested this fix via @next on our builds and confirm it resolves our issue. Thank you so much for fixing this @wardpeet! We can finally upgrade to Gatsby 4!

[afladmark]

As with @julrich we also use Contentful Assets local download option via a custom resolver (to enable custom localization fallbacks to English images). In Gatsby Cloud, we get empty localFile nodes 100% of the time. On local develop it mostly/often works and with local builds it often succeeds. After a gatsby clean it generally fails. We couldn’t build in any case until we moved the resolvers from createResolvers to createSchemaCustomization via buildObjectType, but we’re basically dead in the water with Gatsby 4 at this point as well due to this issue. We have updated all our logic to reflect the changes introduced in the fix PR as well. Prior to that it was completely broken in all environments.