HTML-formatted Media Captions not supported by Element client

[RannerDesign]

Steps to reproduce

HTML-formatted Media Captions not supported by Element client

The Client-Server-API describes in chapter 10.2.2.7 how to set up captions for media https://spec.matrix.org/unstable/client-server-api/#media-captions

Unfortunately the support for HTML-formatted captions could not be verified in the following tests.

The tests were performed in the following environments:

Element Desktop on Windows 10 pro 22H2 (Build 19045.4780) Version von Element: 1.11.74 Krypto-Version: Rust SDK 0.7.1 (c8c9d15), Vodozemac 0.6.0

Element Web Version von Element: 1.11.74 Krypto-Version: Rust SDK 0.7.1 (c8c9d15), Vodozemac 0.6.0 accessed with Chrome Version 127.0.6533.120 (Offizieller Build) (64-Bit)

Element IOS client Element 1.11.16 (20240723142348) Matrix SDK 0.27.11 Rust Crypto SDK 0.7.1 (Vodozemac 0.6.0)

The following server and user environment was used:

user_name:	Testuser1040
user_id:	@m1040a:matrix.org
room_name:	TH3
room_id:	!mNtkvlOYMJmlSPpMZt:matrix.org

The generation of events was performed with Python scripts using matrix-nio

Test 1: as recommended with filename != body

    "body": "Fotograf 7",
    "filename": "testbild7.jpg",
    "format": "org.matrix.custom.html",
    "formatted_body": "<p>myCaption - <strong>Fotograf 7: </strong>Bildtitel 7</p>",

Result for Desktop unexpected:

​ Fotograf 7 (22.71 KB) ​ with mouse-over thumbnail and title of large image

Result for Web unexpected:

<span class="mx_MImageBody_banner">Fotograf 7 (22.71 KB)</span>
<div class="mx_ImageView_title">Fotograf 7 (22.71 KB)</div>

Result for IOS unexpected:

​ No display of any caption

Test 2: with filename = body

    "body": "testbild1.jpg",
    "filename": "testbild1.jpg",
    "format": "org.matrix.custom.html",
    "formatted_body": "<p><strong>Fotograf 1:&nbsp;</strong>Bildtitel 1</p>",

Result for Desktop as expected:

​ testbild1.jpg (21.08 KB) ​ with mouse-over thumbnail and title of large image

Result for Web as expected:

<span class="mx_MImageBody_banner">testbild1.jpg (21.08 KB)</span>
<div class="mx_ImageView_title">testbild1.jpg (21.08 KB)</div>

Result for IOS unexpected:

​ No display of any caption

Test 3: without filename

    "body": "Fotograf 3",
    "format": "org.matrix.custom.html",
    "formatted_body": "<p><strong>Fotograf 3:&nbsp;</strong>Bildtitel 3</p>",

Result for Desktop as expected:

​ Fotograf 3 (22.14 KB) ​ with mouse-over thumbnail and title of large image

Result for Web as expected:

<span class="mx_MImageBody_banner">Fotograf 3 (22.14 KB)</span>
<div class="mx_ImageView_title">Fotograf 3 (22.14 KB)</div>

Result for IOS unexpected:

​ No display of any caption

Test4: with filename and empty body

    "body": "",
    "filename": "testbild6.jpg",
    "format": "org.matrix.custom.html",
    "formatted_body": "<strong>Fotograf 6: </strong>Bildtitel 6",

Result for Desktop suprisingly:

​ Bild (22.49 KB) ​ with mouse-over thumbnail and title of large image

Result for Web suprisingly:

<span class="mx_MImageBody_banner">Bild (22.49 KB)</span>
<div class="mx_ImageView_title">Bild (22.49 KB)</div>

Result for IOS unexpected:

​ No display of any caption

It could not be understood, that as caption there were 4 letters taken from inside the formatted_body

Outcome

What did you expect?

Display of caption like defined in formatted_body

What happened instead?

Display of caption taken from body with unexpected surprise, if body is empty on IOS no caption is displayed at all

Operating system

Windows 10 pro 22H2 (Build 19045.4780)

Browser information

Chrome Version 127.0.6533.120

URL for webapp

https://app.element.io/#/room/!mNtkvlOYMJmlSPpMZt:matrix.org

Application version

Element: 1.11.74 Krypto-Version: Rust SDK 0.7.1 (c8c9d15), Vodozemac 0.6.0

Homeserver

matrix.org

Will you send logs?

No