wagtail-grapple icon indicating copy to clipboard operation
wagtail-grapple copied to clipboard

URL handling in RichTextBlock output

Open indirectlylit opened this issue 5 years ago • 4 comments
trafficstars

I'm not sure what the expected behavior here is, but I ran into an unexpected inconsistency between the rendering behavior of RichTextBlock and other blocks: RichTextBlock uses absolute URLs (e.g. for internal links and image source URLs) while image renditions use fully-qualified URLs.

For example, here I'm rendering a StreamField that includes both rich text blocks and images:

{
  pages {
    ... on BlogPage {
      body {
        blockType
        ... on RichTextBlock {
          value
        }
        ... on ImageChooserBlock {
          image {
            rendition(width:500) {
              src
            }
          }
        }
      }
    }
  }
}

The output is

{
  "data": {
    "pages": [
      {
        "body": [
          {
            "blockType": "ImageChooserBlock",
            "image": {
              "rendition": {
                "src": "http://localhost:8000/media/images/test.width-500.png"
              }
            }
          },
          {
            "blockType": "RichTextBlock",
            "value": "<div class=\"rich-text\"><p>paragraph. <a href=\"/\">Link to another page</a></p><img alt=\"right-aligned test\" class=\"richtext-image right\" height=\"500\" src=\"/media/images/test.width-500.jpg\" width=\"500\"><p></p></div>"
          }
        ]
      }
    ]
  }
}

Note that both link and image in the rich text block use path-only URLs that are not fully qualified with the domain name, protocol, and port. In the context of a headless CMS, this would complicate rendering.

Possibly related: https://github.com/wagtail/wagtail/issues/2695 (in particular the last comment in the thread)

indirectlylit avatar Jan 08 '20 01:01 indirectlylit

Good find! I believe it is related to that core issue.

/cc @NathHorrigan

zerolab avatar Jan 08 '20 09:01 zerolab

+1 I'm experiencing exactly like this.

Junatum avatar Feb 29 '20 05:02 Junatum

+1 I'm experiencing exactly like this.

mdfathi99 avatar Sep 10 '22 13:09 mdfathi99

I did a test today and confirmed that RichTextBlocks are still creating relative urls /media/images/wagtail-grapple.width-800.png to images while ImageFields and ImageChooserBlocks are generating fully qualified URLS http://localhost:8000/media/original_images/wagtail-grapple.png

dopry avatar May 12 '23 17:05 dopry