facebook / facebook/lexical

Bug: Code block breaks list

Open
#5,218 6 comments 0 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
23.9k
Forks
2.2k
Avg merge
1d 14h
Merged PRs (30d)
57

Description

## Description

When inserting a code block within a list item, the code block is treated as a separate element, breaking the list. The expectation is for the code block to be part of the list item, allowing the list to continue seamlessly after the code block.

It may be an intentional behavior. Is there a way to work it around?

Lexical version: 0.11.3

## Steps to Reproduce

1. Open the RTE.
2. Start a numbered or bullet list.
3. Insert a code block within a list item.

## Link to code example:

Please see the behavior by trying it in the Lexical playground: [Lexical Playground](https://playground.lexical.dev/)

## The current behavior

Inserting a code block while editing a list item causes the list to break. The code block appears as a separate block element outside of the list context.
![image](https://github.com/facebook/lexical/assets/22547943/5b9cf61c-a2fb-4520-9eff-9a62cde22352)

## Expected Behavior

When a code block is inserted into a list item, it should be displayed as part of that item, indented accordingly, and not disrupt the list flow. The list numbering or bullets should continue after the code block as if it were part of the text in the list item.

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.