facebook / lexical

Lexical is an extensible text editor framework that provides excellent reliability, accessibility and performance.
https://lexical.dev
MIT License
19.95k stars 1.7k forks source link

Bug: Tabs do not show strikethrough #6808

Open JoeHart opened 2 weeks ago

JoeHart commented 2 weeks ago

👋 Howdy maintainers, first of all big fan of the library! Thanks for all the hard work you put into this great software.

Lexical version: 0.19.0

Steps To Reproduce

  1. Go to lexical playground at https://playground.lexical.dev/
  2. Type in Hello foo which is hello press the Tab key then foo.
  3. Select all the text
  4. Format as strikethrough
  5. unselect the text This then shows only the typed text as struck through, the tab is blank.
Screenshot 2024-11-07 at 16 44 14

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

The current behavior

Tabs do not have a strikethrough.

The expected behavior

Tabs should have strike through.

Impact of fix

Would keep formatting consistent between lexical and other text editors.

etrepum commented 2 weeks ago

This is basically a CSS issue, TabNode creates a span with only whitespace as content, and CSS won't do a strikethrough in that case since there isn't any "text".

rohit-patil18 commented 2 weeks ago

Just as @etrepum said, it is a CSS issue. The strikethrough can be seen when the text is selected as shown in this image.

image

JoeHart commented 1 week ago

Thanks for suggesting where the issue is arising, its caused by CSS yes but I think its still a bug. Lexical is essentially "pretending" to be a text editor. If you are in a normal text editor, for example this one you would expect strikethrough to display on whitespaces like tabs. Foo Bar (Though interestingly github shrinks white space 😅 )

etrepum commented 1 week ago

The context I'm providing is guidance for whomever wanted to work on it. We currently have a number of new contributors looking for issues to help with and this is a fairly straightforward one.