RT mode displays weirdly content made from HTML paragraph and HTML comment tags

Offen
  • Stimmt etwas nicht?
#207 2 Kommentare 0 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen

Maintainer antworten meist innerhalb von 1 Tag

Dieses Issue hat noch niemand übernommen.

Bewertung

Schwierigkeit
3/5
Geschätzter Aufwand
1-2 Tage
Anfängerfreundlichkeit
38/100
Issue-Typ
Bug
Klarheit
Größtenteils klar
Aktivitätsstatus
Veraltet
Tech-Stack
typescript
Bereich
frontend

Rechercherichtung

Beginne damit, das Problem im Stacks Editor zu reproduzieren: Gib den bereitgestellten Absatz und den HTML-Kommentar im MD-Modus ein, wechsle dann in den RT-Modus und teste das Bearbeiten und Entfernen des Kommentars. Als erledigt gilt die Aufgabe, wenn der Absatz mit und ohne Kommentar identisch gerendert wird und ohne Überlappung mit dem Platzhalter oder dem blauen Rand bearbeitbar bleibt.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Beschreibung

bug html mode - rich text

Describe the bug
A combination of HTML p tag and comment tag in the MD mode are display weirdly in RT mode:

  • The p content is overlapped with the editor empty state's placeholder text
  • The text is wrapped in a blue border box
  • The text is uneditable. Inserting new words make the whole text be removed.
  • Even back to the MD mode to remove the HTML comment, the issue is still remaining.

To Reproduce
Steps to reproduce the behavior:

  1. In MD mode, insert this:
<p>A paragraph.</p>
<!--This is a comment -->
  1. Back to RT mode and see the error:
    image

Expected behavior
The RT display shouldn't be affected by the HTML comment tag. Display p tag element with or without HTML comment should be the same.

Desktop (please complete the following information):

  • OS: macOS
  • Browser Chrome
  • Version 103.0.5060.114 (Official Build) (arm64)

Additional context
I also reported the issue in the Feedback Stack editor thread here.

Vorherrschende Sprache
TypeScript
Sterne
442
Forks
60
Ø Merge
4 Std. 5 Min.
Gemergte PRs (30 T.)
11

Entwicklungsumgebung

Erste Schritte

  1. Lesen Sie das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreiben Sie ins Issue, dass Sie es übernehmen — das erspart doppelte Arbeit.
  3. Forken Sie das Repository und arbeiten Sie in einem Branch.
  4. Öffnen Sie einen Pull Request, der die Issue-Nummer nennt.

Mehr aus StackExchange/Stacks-Editor

Alle Issues in StackExchange/Stacks-Editor

Ähnliche Issues

Weitere Issues zu TypeScript

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.