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
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions