Skip to content

fix(Markdown): preserve list structure for mixed task and bullet lists (#6330) - #6424

Open
ManoharPaturi wants to merge 1 commit into
facebook:mainfrom
ManoharPaturi:fix/markdown-mixed-task-list
Open

ManoharPaturi wants to merge 1 commit into
facebook:mainfrom
ManoharPaturi:fix/markdown-mixed-task-list

Conversation

@ManoharPaturi

Copy link
Copy Markdown
Contributor

User impact

When a Markdown document contains a list with both task items and ordinary bullet or numbered items, the entire list currently flattens to plain bullets, dropping all checkboxes and checked states.

Problem and solution fit

CommonMark defines the containing list structure, while task list markers are a GFM extension applied per item. Previously, Markdown checked whether every item in the list block possessed a checked state via node.children.every(item => item.checked != null). A mixed block failed this check and fell back to a plain List, which rendered every child with plain ListItem bullets and omitted the task markers.

Following maintainer direction on issue #6330, mixed lists now preserve the containing List structure and render each item according to its own marker. ListItem exposes a marker override prop forwarding to Item so task items can suppress the default bullet or decimal counter with marker={null} and render a read-only CheckboxInput in startContent. Ordinary list items continue rendering their standard bullet or decimal marker.

Expected behavior and authority

Closes #6330

Smallest restoration

ListItemProps and ListItem.tsx add the optional marker prop to override or suppress default list markers.
ListItem.doc.mjs documents the marker prop.
Markdown.tsx renders task items within List blocks using marker={null} and a compact read-only CheckboxInput in startContent.
Markdown.test.tsx adds tests for mixed task and bullet lists, as well as nested task items in ordinary lists.
List.test.tsx adds unit tests for marker suppression and custom marker overrides.

Testing

pnpm vitest run packages/core/src/Markdown/Markdown.test.tsx passed all 82 tests.
pnpm vitest run packages/core/src/List/List.test.tsx passed all 58 tests.
Pre-commit checks passed clean: check:sync, check:changesets, check:demo-media, check:i18n-catalog, check:fixtures, check:setup-contract.
Changeset markdown-mixed-task-list.md included.

facebook#6330)

When rendering lists containing both task items and ordinary bullet or numbered items, isTaskList evaluated to false because it required all items to have checkboxes. This caused the whole block to fall back to a plain List, completely dropping task state and flattening checkboxes to plain bullets.

Following maintainer guidance on facebook#6330, mixed lists now preserve the containing List structure and render each item according to its own marker. ListItem supports a marker override so task items can suppress the default bullet or counter and display a read-only CheckboxInput in startContent, while ordinary list items continue to display their standard bullet or decimal marker.

Signed-off-by: Manohar Paturi <186662190+ManoharPaturi@users.noreply.github.com>
Copilot AI lite review requested due to automatic review settings September 21, 2026 18:20
@vercel

vercel Bot commented Sep 21, 2026 •

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated
astryx Ready Ready Preview Sep 21, 2026 6:25pm UTC

Request Review

@meta-cla meta-cla Bot added the CLA Signed This label is managed by the Meta Open Source bot. label Sep 21, 2026

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copilot was unable to review this pull request because the user who requested the review has reached their quota limit.

@astracat-bot

astracat-bot Bot commented Sep 21, 2026 •

Copy link
Copy Markdown

AI review status for this pull request.

Review status Updated
❓ Needs maintainer input (for maintainers only) Sep 24, 2026, 6:31 PM UTC

@github-actions github-actions Bot added community Authored by a community contributor (not on the eng/design team) needs:code-review High-risk change (new package/component/API) — needs human code review before merge labels Sep 21, 2026
github-actions Bot added a commit that referenced this pull request Sep 21, 2026
@github-actions

Copy link
Copy Markdown
Contributor

PR Analysis Report

📚 Storybook Preview

View Storybook for this PR
GitHub Pages may take up to a minute to hydrate after deploy.

🧪 Sandbox Preview

View Sandbox for this PR
GitHub Pages may take up to a minute to hydrate after deploy.

No new or modified components detected.

Bundle Size Summary

Package Size (ESM) Size (CJS) Gzipped
@astryxdesign/core N/A 4.8KB 1.2KB

Accessibility Audit

Status: 36 accessibility violation(s) found — 2 critical, 34 serious.

Button pattern - 1 issue(s)
  • 🟠 serious: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
    • Rule: color-contrast · Affects 1/18 stories · Learn more
    • WCAG: 1.4.3 (Level AA)
ChatComposer - 1 issue(s)
  • 🟠 serious: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
    • Rule: color-contrast · Affects 1/19 stories · Learn more
    • WCAG: 1.4.3 (Level AA)
ChatComposerInput - 1 issue(s)
  • 🟠 serious: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
    • Rule: color-contrast · Affects 1/16 stories · Learn more
    • WCAG: 1.4.3 (Level AA)
ChatReasoning - 1 issue(s)
  • 🟠 serious: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
    • Rule: color-contrast · Affects 4/5 stories · Learn more
    • WCAG: 1.4.3 (Level AA)
ChatToolCalls - 1 issue(s)
  • 🟠 serious: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
    • Rule: color-contrast · Affects 10/11 stories · Learn more
    • WCAG: 1.4.3 (Level AA)
Checkbox pattern - 1 issue(s)
  • 🟠 serious: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
    • Rule: color-contrast · Affects 2/33 stories · Learn more
    • WCAG: 1.4.3 (Level AA)
CheckboxList - 1 issue(s)
  • 🟠 serious: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
    • Rule: color-contrast · Affects 4/17 stories · Learn more
    • WCAG: 1.4.3 (Level AA)
ClickableCard - 1 issue(s)
  • 🟠 serious: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
    • Rule: color-contrast · Affects 1/5 stories · Learn more
    • WCAG: 1.4.3 (Level AA)
CodeEditor - 1 issue(s)
  • 🟠 serious: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
    • Rule: color-contrast · Affects 3/7 stories · Learn more
    • WCAG: 1.4.3 (Level AA)
CodeEditorPerf - 1 issue(s)
  • 🟠 serious: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
    • Rule: color-contrast · Affects 2/2 stories · Learn more
    • WCAG: 1.4.3 (Level AA)
CodeEditorTheme - 1 issue(s)
  • 🟠 serious: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
    • Rule: color-contrast · Affects 13/14 stories · Learn more
    • WCAG: 1.4.3 (Level AA)
CodeTheme - 1 issue(s)
  • 🟠 serious: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
    • Rule: color-contrast · Affects 14/16 stories · Learn more
    • WCAG: 1.4.3 (Level AA)
DateRangeInput - 1 issue(s)
  • 🔴 critical: Ensure an element's role supports its ARIA attributes
    • Rule: aria-allowed-attr · Affects 1/21 stories · Learn more
    • WCAG: 4.1.2 (Level A)
FileInput - 1 issue(s)
  • 🟠 serious: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
    • Rule: color-contrast · Affects 3/15 stories · Learn more
    • WCAG: 1.4.3 (Level AA)
GridMasonry - 1 issue(s)
  • 🟠 serious: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
    • Rule: color-contrast · Affects 1/3 stories · Learn more
    • WCAG: 1.4.3 (Level AA)
Heading - 1 issue(s)
  • 🟠 serious: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
    • Rule: color-contrast · Affects 1/16 stories · Learn more
    • WCAG: 1.4.3 (Level AA)
Icon - 1 issue(s)
  • 🟠 serious: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
    • Rule: color-contrast · Affects 1/18 stories · Learn more
    • WCAG: 1.4.3 (Level AA)
LogStream - 1 issue(s)
  • 🟠 serious: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
    • Rule: color-contrast · Affects 2/3 stories · Learn more
    • WCAG: 1.4.3 (Level AA)
MediaTheme Auto - 1 issue(s)
  • 🟠 serious: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
    • Rule: color-contrast · Affects 1/5 stories · Learn more
    • WCAG: 1.4.3 (Level AA)
PowerSearch - 1 issue(s)
  • 🟠 serious: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
    • Rule: color-contrast · Affects 2/26 stories · Learn more
    • WCAG: 1.4.3 (Level AA)
ProgressBar - 1 issue(s)
  • 🟠 serious: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
    • Rule: color-contrast · Affects 2/18 stories · Learn more
    • WCAG: 1.4.3 (Level AA)
Radio group pattern - 1 issue(s)
  • 🟠 serious: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
    • Rule: color-contrast · Affects 3/26 stories · Learn more
    • WCAG: 1.4.3 (Level AA)
RadioList - 1 issue(s)
  • 🟠 serious: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
    • Rule: color-contrast · Affects 3/14 stories · Learn more
    • WCAG: 1.4.3 (Level AA)
RichTextEditor - 2 issue(s)
  • 🟠 serious: Ensure every ARIA input field has an accessible name
    • Rule: aria-input-field-name · Affects 2/18 stories · Learn more
    • WCAG: 4.1.2 (Level A)
  • 🔴 critical: Ensure every form element has a label
    • Rule: label · Affects 1/18 stories · Learn more
    • WCAG: 4.1.2 (Level A)
SelectableCard - 1 issue(s)
  • 🟠 serious: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
    • Rule: color-contrast · Affects 1/4 stories · Learn more
    • WCAG: 1.4.3 (Level AA)
Stepper - 1 issue(s)
  • 🟠 serious: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
    • Rule: color-contrast · Affects 1/30 stories · Learn more
    • WCAG: 1.4.3 (Level AA)
TableGroupedRows - 1 issue(s)
  • 🟠 serious: Ensure ARIA attributes are used as described in the specification of the element's role
    • Rule: aria-conditional-attr · Affects 3/3 stories · Learn more
    • WCAG: 4.1.2 (Level A)
TableTree - 1 issue(s)
  • 🟠 serious: Ensure ARIA attributes are used as described in the specification of the element's role
    • Rule: aria-conditional-attr · Affects 8/9 stories · Learn more
    • WCAG: 4.1.2 (Level A)
Text - 1 issue(s)
  • 🟠 serious: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
    • Rule: color-contrast · Affects 1/23 stories · Learn more
    • WCAG: 1.4.3 (Level AA)
Theme - 1 issue(s)
  • 🟠 serious: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
    • Rule: color-contrast · Affects 1/5 stories · Learn more
    • WCAG: 1.4.3 (Level AA)
PopArt - 1 issue(s)
  • 🟠 serious: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
    • Rule: color-contrast · Affects 3/6 stories · Learn more
    • WCAG: 1.4.3 (Level AA)
Thumbnail - 1 issue(s)
  • 🟠 serious: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
    • Rule: color-contrast · Affects 1/12 stories · Learn more
    • WCAG: 1.4.3 (Level AA)
Timestamp - 1 issue(s)
  • 🟠 serious: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
    • Rule: color-contrast · Affects 1/20 stories · Learn more
    • WCAG: 1.4.3 (Level AA)
Token - 1 issue(s)
  • 🟠 serious: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
    • Rule: color-contrast · Affects 2/10 stories · Learn more
    • WCAG: 1.4.3 (Level AA)
Tokenizer - 1 issue(s)
  • 🟠 serious: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
    • Rule: color-contrast · Affects 2/24 stories · Learn more
    • WCAG: 1.4.3 (Level AA)

Visual Regression

Status: No visual change across 6 compared shot(s).


Generated by PR Enrichment workflow | Storybook | Sandbox | View full report

@astracat-bot astracat-bot Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Mixed task/plain Markdown lists now preserve their containing list and per-item checked state, but two blockers remain:

  • The new public ListItem.marker prop has no current List/ListItem contract. Approval is waiting for a maintainer to provide or identify the governing spec for custom-marker and marker-suppression semantics, or to keep that mechanism internal to the Markdown restoration.
  • In mixed lists, every task checkbox is exposed to assistive technology as “Task list” instead of its visible item text, so multiple tasks are indistinguishable. Please associate each checkbox with its item label and add a regression assertion for multiple and nested mixed task items.

[Automated review]

This branch was successfully deployed

1 active deployment
Preview — 7d773185 Deployed Sep 21, 2026 by vercel[bot]
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

CLA Signed This label is managed by the Meta Open Source bot. community Authored by a community contributor (not on the eng/design team) needs:code-review High-risk change (new package/component/API) — needs human code review before merge

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Markdown] Mixed task/bullet lists are flattened to plain bullets

2 participants