Skip to content

fix: restore list styles for markdown lists in chat interface #6095

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 2 commits into
base: main
Choose a base branch
from

Conversation

roomote[bot]
Copy link

@roomote roomote bot commented Jul 23, 2025

This PR fixes the issue where markdown lists (both ordered and unordered) were not displaying properly in the chat interface due to CSS reset rules.

Problem

The preflight.css file contains a CSS reset that removes all list styles:

ol, ul, menu {
    list-style: none;
}

While the MarkdownBlock component applied padding and margins to lists, it did not restore the list-style-type property.

Solution

  • Added list-style-type: decimal for ordered lists (ol)
  • Added list-style-type: disc for unordered lists (ul)
  • Added nested list styles for better visual hierarchy:
    • Nested ul elements use circle and square styles
    • Nested ol elements use lower-alpha and lower-roman styles
  • Added comprehensive tests to verify list rendering

Testing

  • Added 4 new test cases to verify:
    • Unordered lists render correctly
    • Ordered lists render correctly
    • Nested lists maintain proper hierarchy
    • All list items are displayed with proper text content
  • All existing tests continue to pass
  • Manual testing confirms lists now display with proper bullets/numbers

Fixes #6094


Important

Fixes markdown list rendering in chat by restoring list styles in MarkdownBlock.tsx and adding tests.

  • Behavior:
    • Restores list-style-type for ol and ul in MarkdownBlock.tsx to display ordered and unordered lists correctly.
    • Adds nested list styles: ul ul uses circle, ul ul ul uses square, ol ol uses lower-alpha, ol ol ol uses lower-roman.
  • Testing:
    • Adds markdown-lists.test.ts with 4 test cases for unordered, ordered, nested, and mixed lists.
    • Updates MarkdownBlock.spec.tsx with tests for unordered, ordered, and nested lists.
  • Misc:
    • Fixes list rendering issue caused by CSS reset in preflight.css.

This description was created by Ellipsis for 1e2cedf. You can customize this summary. It will automatically update as commits are pushed.

- Add list-style-type for ol (decimal) and ul (disc) elements
- Add nested list styles for better visual hierarchy
- Add comprehensive tests for list rendering
- Fixes #6094
@roomote roomote bot requested review from mrubens, cte and jr as code owners July 23, 2025 06:15
@dosubot dosubot bot added size:L This PR changes 100-499 lines, ignoring generated files. bug Something isn't working labels Jul 23, 2025
@hannesrudolph hannesrudolph added the Issue/PR - Triage New issue. Needs quick review to confirm validity and assign labels. label Jul 23, 2025
@village-way
Copy link

image

Test this PR with this snapshot.

@hannesrudolph
Copy link
Collaborator

image

Test this PR with this snapshot.

What prompt should I give Roo?

@hannesrudolph
Copy link
Collaborator

@roomote-agent can you write an e2e integration test (using integration test mode)?

Copy link
Author

roomote bot commented Jul 23, 2025

Hi @hannesrudolph! I see your request to write an e2e integration test for the markdown list styles fix. I'll get started on that right away using the integration test mode. 🚀

@village-way
Copy link

image Test this PR with this snapshot.

What prompt should I give Roo?
markdown-list.txt

- Add tests for unordered lists with bullet points
- Add tests for ordered lists with numbers
- Add tests for nested list hierarchy
- Add tests for mixed ordered/unordered lists
- Verify proper rendering of list styles in chat interface
Copy link
Author

roomote bot commented Jul 23, 2025

Hi @hannesrudolph! I've successfully added e2e integration tests for the markdown list rendering fix.

What I added:

  • Created apps/vscode-e2e/src/suite/markdown-lists.test.ts with comprehensive test coverage
  • Test for unordered lists with bullet points
  • Test for ordered lists with numbers
  • Test for nested list hierarchy
  • Test for mixed ordered/unordered lists

The tests verify that markdown lists are properly rendered in the chat interface with the correct list styles (bullets, numbers, and proper nesting).

The changes have been pushed to the PR branch and CI checks are currently running. You can review the test file to see the implementation details. Let me know if you need any adjustments! 🎯

@daniel-lxs daniel-lxs moved this from Triage to PR [Needs Prelim Review] in Roo Code Roadmap Jul 23, 2025
@hannesrudolph hannesrudolph added PR - Needs Preliminary Review and removed Issue/PR - Triage New issue. Needs quick review to confirm validity and assign labels. labels Jul 23, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working PR - Needs Preliminary Review size:L This PR changes 100-499 lines, ignoring generated files.
Projects
Status: PR [Needs Prelim Review]
Development

Successfully merging this pull request may close these issues.

Bug Report: Markdown Lists Not Displaying Properly in Chat Interface
3 participants