Repository: streamlit/streamlit
File: e2e_playwright/st_markdown.py (Python)

Code before:
)

st.caption(
    """
Centered caption text. This should be long to demonstrate justification properly.
This is a longer paragraph that demonstrates text justification properly.
The text stretches to fill the available width.""",
    text_alignment="center",
    help="This is a help tooltip!",
)
st.caption(
    """Right aligned caption this should be long to
demonstrate justification properly. This is a longer paragraph that demonstrates
text justification properly. The text stretches to fill the available width.""",
    text_alignment="right",
    help="This is a help tooltip!",
)
st.caption(
    """Justified caption text this should be long to
demonstrate justification properly. This is a longer paragraph that demonstrates
text justification properly. The text stretches to fill the available width.""",
    text_alignment="justify",
    help="This is a help tooltip!",
)

# Test for gh-13339: Tooltip with newlines should render correctly
st.header("Tooltip with Newlines (gh-13339)")

st.container(key="markdown_newlines_tooltip").markdown(
    "Markdown with newlines in tooltip",
    help="Line 1\n\nLine 2\n\nLine 3",
)

st.container(key="caption_newlines_tooltip").caption(
    "Caption with newlines in tooltip",
    help="Line 1\n\nLine 2\n\nLine 3",
)

st.container(key="markdown_center_newlines_tooltip").markdown(
    "Center aligned with newlines in tooltip",
    text_alignment="center",
    help="Line 1\n\nLine 2\n\nLine 3",
)


Review comment (bug):
**suggestion:** We should add tests for this case, which seems to be broken:

```py
st.markdown("Test", help="Tool tip with \n\n new lines")
```

<img width="93" height="56" alt="Image" src="https://github.com/user-attachments/assets/bda5ae98-dd16-4542-84eb-68887dad8ccf" />

Code after:
)

st.caption(
    """
Centered caption text. This should be long to demonstrate justification properly.
This is a longer paragraph that demonstrates text justification properly.
The text stretches to fill the available width.""",
    text_alignment="center",
    help="This is a help tooltip!",
)
st.caption(
    """Right aligned caption this should be long to
demonstrate justification properly. This is a longer paragraph that demonstrates
text justification properly. The text stretches to fill the available width.""",
    text_alignment="right",
    help="This is a help tooltip!",
)
st.caption(
    """Justified caption text this should be long to
demonstrate justification properly. This is a longer paragraph that demonstrates
text justification properly. The text stretches to fill the available width.""",
    text_alignment="justify",
    help="This is a help tooltip!",
)

# Test for gh-13339: Tooltip with newlines should render correctly
st.header("Tooltip with Newlines (gh-13339)")

st.container(key="markdown_newlines_tooltip").markdown(
    "Markdown with newlines in tooltip",
    help="Line 1\n\nLine 2\n\nLine 3",
)

st.container(key="caption_newlines_tooltip").caption(
    "Caption with newlines in tooltip",
    help="Line 1\n\nLine 2\n\nLine 3",
)

st.container(key="markdown_center_newlines_tooltip").markdown(
    "Center aligned with newlines in tooltip",
    text_alignment="center",
    help="Line 1\n\nLine 2\n\nLine 3",
)

st.container(key="markdown_spaces_around_newlines").markdown(
    "Markdown with spaces around newlines",
    help="Line 1 \n\n Line 2 \n\n Line 3",
)

st.container(key="markdown_bracket_in_tooltip").markdown(
    "Markdown with closing bracket in tooltip",