facebook/lexical

Bug: Block math equation is falsely converted to inline equation on MarkdownShortcutPlugin

Open

#6936 opened on Dec 10, 2024

View on GitHub
 (6 comments) (0 reactions) (0 assignees)JavaScript (16,523 stars) (1,349 forks)batch import
good first issuemarkdown

Description

Typing an equation like "$$x^2 + y^2 = z^2$$" via "Insert Equation" and then pressing the MarkdownShortcutPlugin changes the equation to inline ($...$).

Lexical version: Current Playground version

Steps To Reproduce

  1. Enter an equation, e.g. "x^2 + y^2 = z^2" via the toolbar (Insert -> Insert Equation) and uncheck "inline".
  2. Press the Markdown button

Link to code example: https://playground.lexical.dev/

The current behavior

Block math equations like "$$...$$" are converted to inline "$...$" when using the ##MarkdownShortcutPlugin.

The expected behavior

Block math equations like "$$...$$" should stay the same when using the MarkdownShortcutPlugin.

Potential Solutions

Possibly quick: A new BLOCK_EQUATION transformer could be added to address the "$$" scenario. MarkdownTransformers Way more complicated: One might migrate "$, $$" in general to modern LaTex syntax like "[...]"

Impact of fix

Users who rely on markdown capabilities are type safe with equations.

Contributor guide

Tech stack
javascripttypescript
Domain
frontend
Issue type
bug
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
2
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
1-3 hours
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
active
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
clear
Prerequisites
JavaScript/TypeScriptLexical Markdown transformersRegex basicsGit and GitHub workflow
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
75
Research direction
Examine the MarkdownTransformers index file (packages/lexical playground/src/plugins/MarkdownTransformers/index.ts) to understand the structure of existing transformers. Look at the INLINE EQUATION transformer and create a new BLOCK EQUATION transformer that matches the '$$...$$' pattern. Ensure that the new transformer is properly exported and registered in the MarkdownShortcutPlugin. Test the fix by following the reproduction steps in the Lexical playground.