Skip to content

bug(gatsby-source-strapi): With external and Strapi images in Markdown, some Strapi images are missing/blended #425

@hrenaud

Description

@hrenaud

Describe the bug

When I add some images in a Markdown field in Strapi, if I use external images (https://domain.tld/image.png) and Strapi images, the medias array doesn't contain / blend data for some images.

To Reproduce

Copy/adapt this snippet into your richtext.

## External image
![Internet img](https://raw.githubusercontent.com/NovaGaia/strapi-plugin-mock-datas/main/docs/Capture-2023-04-15-102849.png)

## Strapi Image
![Strapi img 1](/uploads/Capture_d_ecran_2022_10_22_192013_1_f3850ccdca.png)

![Strapi img 2](/uploads/lac_1_ceb35aeb78.png)

Result of medias

[
    {
        "alternativeText": "Internet img",
        "file": {
            "alternativeText": ""
        },
        "localFile": {
            "childImageSharp": {
                "gatsbyImageData": {
                    "layout": "constrained",
                    "backgroundColor": "#384868",
                    "images": {
                        "fallback": {
                            "src": "/static/cc395cbe6efc81c57d440d2c13c94fda/e2861/Capture_d_ecran_2022_10_22_192013_1_f3850ccdca.png",
                            "srcSet": "/static/cc395cbe6efc81c57d440d2c13c94fda/13424/Capture_d_ecran_2022_10_22_192013_1_f3850ccdca.png 256w,\n/static/cc395cbe6efc81c57d440d2c13c94fda/37319/Capture_d_ecran_2022_10_22_192013_1_f3850ccdca.png 512w,\n/static/cc395cbe6efc81c57d440d2c13c94fda/e2861/Capture_d_ecran_2022_10_22_192013_1_f3850ccdca.png 1023w",
                            "sizes": "(min-width: 1023px) 1023px, 100vw"
                        },
                        "sources": [
                            {
                                "srcSet": "/static/cc395cbe6efc81c57d440d2c13c94fda/0c128/Capture_d_ecran_2022_10_22_192013_1_f3850ccdca.webp 256w,\n/static/cc395cbe6efc81c57d440d2c13c94fda/5d10f/Capture_d_ecran_2022_10_22_192013_1_f3850ccdca.webp 512w,\n/static/cc395cbe6efc81c57d440d2c13c94fda/b724a/Capture_d_ecran_2022_10_22_192013_1_f3850ccdca.webp 1023w",
                                "type": "image/webp",
                                "sizes": "(min-width: 1023px) 1023px, 100vw"
                            }
                        ]
                    },
                    "width": 1023,
                    "height": 575
                }
            }
        },
        "src": "https://raw.githubusercontent.com/NovaGaia/strapi-plugin-mock-datas/main/docs/Capture-2023-04-15-102849.png",
        "url": "https://raw.githubusercontent.com/NovaGaia/strapi-plugin-mock-datas/main/docs/Capture-2023-04-15-102849.png"
    },
    {
        "alternativeText": "Strapi img 1",
        "file": {
            "alternativeText": null
        },
        "localFile": {
            "childImageSharp": {
                "gatsbyImageData": {
                    "layout": "constrained",
                    "backgroundColor": "#f8f8f8",
                    "images": {
                        "fallback": {
                            "src": "/static/5c012d011772fa184e4d1bc971ecf887/cd293/lac_1_ceb35aeb78.png",
                            "srcSet": "/static/5c012d011772fa184e4d1bc971ecf887/78e2e/lac_1_ceb35aeb78.png 256w,\n/static/5c012d011772fa184e4d1bc971ecf887/90381/lac_1_ceb35aeb78.png 512w,\n/static/5c012d011772fa184e4d1bc971ecf887/cd293/lac_1_ceb35aeb78.png 1023w",
                            "sizes": "(min-width: 1023px) 1023px, 100vw"
                        },
                        "sources": [
                            {
                                "srcSet": "/static/5c012d011772fa184e4d1bc971ecf887/344d9/lac_1_ceb35aeb78.webp 256w,\n/static/5c012d011772fa184e4d1bc971ecf887/e0e76/lac_1_ceb35aeb78.webp 512w,\n/static/5c012d011772fa184e4d1bc971ecf887/f7bc7/lac_1_ceb35aeb78.webp 1023w",
                                "type": "image/webp",
                                "sizes": "(min-width: 1023px) 1023px, 100vw"
                            }
                        ]
                    },
                    "width": 1023,
                    "height": 682
                }
            }
        },
        "src": "/uploads/Capture_d_ecran_2022_10_22_192013_1_f3850ccdca.png",
        "url": "http://localhost:1337/uploads/Capture_d_ecran_2022_10_22_192013_1_f3850ccdca.png"
    }
]

Expected behavior

I'm waiting for an array with 3 images, with data who aren't blended.

System Info

Please provide information about your site via these means as possible:

  • Run: yarn gatsby info --clipboard in your project directory
System:
    OS: Linux 6.1 Debian GNU/Linux 11 (bullseye) 11 (bullseye)
    CPU: (8) x64 Intel(R) Core(TM) i5-8257U CPU @ 1.40GHz
    Shell: 5.1.4 - /bin/bash
  Binaries:
    Node: 16.14.0 - /tmp/yarn--1681645892480-0.5793483802096153/node
    Yarn: 1.22.19 - /tmp/yarn--1681645892480-0.5793483802096153/yarn
    npm: 8.3.1 - /usr/local/share/nvm/versions/node/v16.14.0/bin/npm
  npmPackages:
    gatsby: ^4.6.1 => 4.25.6
    gatsby-plugin-image: ^2.6.0 => 2.25.0
    gatsby-plugin-manifest: ^4.2.0 => 4.25.0
    gatsby-plugin-matomo: ^0.11.0 => 0.11.1
    gatsby-plugin-mdx: ^3.2.0 => 3.20.0
    gatsby-plugin-meta-redirect: ^1.1.1 => 1.1.1
    gatsby-plugin-postcss: ^5.2.0 => 5.25.0
    gatsby-plugin-purgecss: ^6.1.0 => 6.2.1
    gatsby-plugin-react-helmet: ^5.2.0 => 5.25.0
    gatsby-plugin-robots-txt: ~1.7.1 => 1.7.1
    gatsby-plugin-schema-snapshot: ^3.24.0 => 3.25.0
    gatsby-plugin-sharp: ^4.6.0 => 4.25.1
    gatsby-plugin-sitemap: ^5.2.0 => 5.25.0
    gatsby-plugin-tailwindcss: ^1.0.3 => 1.0.3
    gatsby-plugin-webpack-bundle-analyser-v2: ^1.1.30 => 1.1.30
    gatsby-source-filesystem: ^4.2.0 => 4.25.0
    gatsby-source-strapi: ^3.2.0 => 3.2.0
    gatsby-transformer-remark: ^5.6.0 => 5.25.1
    gatsby-transformer-sharp: ^4.6.0 => 4.25.0
  • Provide a link to a repository if it is publicly available
    I can't share, it's a private repository.

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions