Rich text reports display-only link resolution as an edit: setContent(x, false) doesn't suppress the update in Tiptap 3

オープン 初心者向け
#231 コメント 0 件 リアクション 0 件 担当者 0 名 GitHub で見る

まだ誰も着手していません。

評価

難易度
2/5
見積もり時間
1〜3時間
初心者へのやさしさ
78/100
issue の種類
バグ
明瞭さ
明確に書かれている
活発さ
活発
技術スタック
javascript, react
領域
frontend, testing

調査の方向性

packages/editor-ui/src/components/settings/inputs/RichTextInput.jsxから始め、477、487、500、516行目付近の4つのsetContent呼び出しとonUpdateハンドラーを調べてください。呼び出しを更新して、発生する更新を抑制し、リンク先のスラッグが変更されたリンクのコンポーネントテストを追加してください。表示解決中にonChangeが呼び出されず、フォームが未変更の状態を保てば完了です。該当するコンポーネントテストと既存のstableLink.test.jsxテストを実行してください。

索引モデルが issue の本文から書いたものです。

説明

bug editor

A rich-text field is meant to resolve its internal links for display without counting that as an edit. It counts it anyway: the field calls onChange, so opening a widget can mark the page as changed when nothing was edited.

What happens

RichTextInput keeps internal links pointing at current slugs for display. The comment above its sync effect says this is display-only:

setContent with emitUpdate=false means this is display-only — it does NOT fire onUpdate/onChange, so the field isn't dirtied and the stored value is untouched until a real edit.

But the call passes a bare false:

editor.commands.setContent(displayValue, false);

(packages/editor-ui/src/components/settings/inputs/RichTextInput.jsx ~477; the same call at ~487, ~500 and ~516.)

In Tiptap 3 the second argument is an options object (setContent(content, { emitUpdate, parseOptions, errorOnInvalidContent })), and emitUpdate defaults to true. Destructuring false finds no emitUpdate, so the default applies and the update is emitted. The editor's onUpdate (~449) then calls onChange(editor.getHTML()).

So whenever resolveForDisplay(value) differs from what the editor holds (for example, a link to a page whose slug has changed since the link was saved), the resolved HTML is reported as a change to the field. Expected: the page stays clean, and the stored value keeps its original href until a real edit.

The other three calls (switching back from source mode, source blur, collapsing the expanded editor) call onChange themselves right after, so for them the extra update is harmless but redundant.

Fix

Pass the options object in all four places:

editor.commands.setContent(displayValue, { emitUpdate: false });

Then add a test that mounts the field with a link whose target slug has changed and checks that onChange isn't called and the form isn't dirty. The current link tests (stableLink.test.jsx) use a headless editor, so they don't cover the component.

How it was found

Code review during the dependency upgrades, checked against Tiptap's setContent signature (the same in 3.18 and 3.32). Not yet reproduced in the editor UI.

主要言語
JavaScript
スター
162
フォーク
6
PR マージ指標
30日以内にマージされた PR はありません

環境構築

  • Dockerfile または Docker Compose ファイルあり
  • プルリクエストのテンプレートなし
  • コントリビューションガイドなし

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

tsiger/widgetizer のほかの issue

tsiger/widgetizer の issue をすべて見る

似ている issue

JavaScript の issue をもっと見る

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。