storyblok / storyblok-js-client

Universal JavaScript client for Storyblok's API
MIT License
129 stars 87 forks source link

richTextRenderer doesnt properly handle empty links #489

Closed SebbeJohansson closed 1 year ago

SebbeJohansson commented 1 year ago

Somehow (I still don't know how the editor managed this one) it is possible to add empty link object to the richtext field in the editor. These empty objects are not handled properly by the richTextRenderer.

Expected Behavior

I expect the rich text renderer to disregard any incorrect text elements.

Current Behavior

The rich text renderer fails to render which results in a loop that crashes the site.

Steps to Reproduce

  1. Open a storyblok project.
  2. Try to render an object that has en empty link mark. image
  3. It fails. MicrosoftTeams-image (4) image

Example rich text blok data:

{
    "type": "doc",
    "content": [
        {
            "type": "paragraph",
            "content": [
                {
                    "text": "Läs mer:",
                    "type": "text",
                    "marks": [
                        {
                            "type": "bold"
                        }
                    ]
                },
                {
                    "text": " ",
                    "type": "text"
                },
                {
                    "text": "Vad är DWR och hur fungerar det?",
                    "type": "text",
                    "marks": [
                        {
                            "type": "link",
                            "attrs": {
                                "href": "/sv/blog/vad-ar-dwr",
                                "uuid": "3d3c1cbf-5bef-425a-a2e8-0f5d5707a521",
                                "anchor": null,
                                "custom": {},
                                "target": "_self",
                                "linktype": "story",
                                "story": {
                                    "name": "What is DWR",
                                    "id": 246343515,
                                    "uuid": "3d3c1cbf-5bef-425a-a2e8-0f5d5707a521",
                                    "slug": "what-is-dwr",
                                    "url": "blog/what-is-dwr",
                                    "full_slug": "sv/blog/vad-ar-dwr",
                                    "_stopResolving": true
                                }
                            }
                        },
                        {
                            "type": "underline"
                        }
                    ]
                },
                {
                    "text": " ",
                    "type": "text",
                    "marks": [
                        {
                            "type": "link"
                        }
                    ]
                }
            ]
        }
    ]
}

It is the last part that is the issue.

scottapow commented 1 year ago

I came across this as well and the way it was produced was with a link, followed by a hard break, then more text.

Currently I'm just overriding the link mark in a custom schema to get around this.

[
    {
        "type": "paragraph",
        "content": [
            {
                "text": "...",
                "type": "text",
                "marks": [
                    {
                        "type": "textStyle",
                        "attrs": {
                            "color": "rgb(23, 43, 77)"
                        }
                    }
                ]
            },
            {
                "type": "hard_break"
            },
            {
                "text": "...",
                "type": "text",
                "marks": [
                    {
                        "type": "link",
                        "attrs": {
                            "href": "...",
                            "uuid": null,
                            "anchor": null,
                            "target": null,
                            "linktype": "url"
                        }
                    }
                ]
            },
            {
                "type": "hard_break"
            },
            {
                "text": "...",
                "type": "text",
                "marks": [
                    {
                        "type": "link"
                    }
                ]
            }
        ]
    }
]
thiagosaife commented 1 year ago

Hello gentleman. We're looking into this one.

thiagosaife commented 1 year ago

Hello @SebbeJohansson Could you please have a look into our latest version. This should be solved by now. Thanks @ademarCardoso

thiagosaife commented 1 year ago

I'll close this one. Feel free to open another one if needed.

SebbeJohansson commented 1 year ago

@thiagosaife Thanks! Ill try to take a look!