Support multiple BurgerEditor engines in one document - #933
Merged
Conversation
Multiple BurgerEditorEngine instances can now share one document: - CommandBus.receiverId gives each bus a unique receiver element id instead of the fixed COMMAND_BUS_ID (deprecated but kept exported) - BurgerEditorEngineOptions.root accepts an HTMLElement directly, so two engines don't need to share (and collide on) one selector - getElement() throws ElementNotFoundError instead of silently passing through null/undefined when the root reference resolves to nothing
Wire every commandfor and dialog/form id through the instance that owns
it, so two engines can share one document without their buttons and
dialogs cross-wiring:
- Components that hold an engine reference (BlockCatalog, DraftSwitcher,
BlockMenu) address commandfor={engine.commandBus.receiverId} instead of
the removed shared COMMAND_BUS_ID
- Presentational components without an engine reference (BlockMenuView,
InitialInsertionButton) take a required commandBusId prop instead
- EditorDialog derives its dialog/form ids with useId() instead of the
fixed `${name}-dialog` (data-bge-component keeps the name-based value,
since it identifies the dialog's kind, not one specific instance)
- BlockOptions' radiogroup/description ids move to useId() for the same
reason (previously fixed literals)
Adds tests asserting the commandfor attribute actually resolves to the
owning engine's receiverId, matching the wiring these components claim
to provide.
ImageEditor's tabpanel/fieldset/range-input/description ids move to useId() instead of fixed literals, so two image item editors open at once don't share htmlFor/aria-* references. Updates the pipeline spec that located the item editor's form by a now-removed fixed id, using HTMLInputElement.form instead.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
背景
同一 HTML document 内に BurgerEditor エンジンを複数マウントすると、document スコープの固定 ID が衝突し、片方のエンジンの操作がもう片方に誤って作用していた。
bge-command-bus固定（core/src/command/command-bus.ts）。親 document 側のボタン（ブロックカタログ・下書き切替）のcommandforが先勝ちで別エンジンに配送されるEditorDialogの<dialog id>/<form id>がname固定。command="close"や<button form>が別エンジンのダイアログ・フォームに作用するBlockOptionsの radiogroup、ImageEditorのフィールドセット・入力欄）がaria-*/htmlForの参照先を混線させるCSS / CSS カスタムプロパティの共有は対象外（意図的な仕様）。
変更内容
CommandBusにインスタンスごとに一意なreceiverId（bge-command-bus-<n>）を追加。commandforを出す全コンポーネントをengine.commandBus.receiverId経由に変更。固定 ID のCOMMAND_BUS_IDは@deprecatedとして export は維持BurgerEditorEngineOptions.rootがHTMLElementを直接受け付けるように拡張（同一セレクタでの要素衝突を回避する逃げ道）。getElement()は null/undefined が渡った場合にElementNotFoundErrorを投げるようにし、意味の掴めないTypeErrorを防ぐEditorDialogのダイアログ・フォーム ID をuseId()ベースに変更（data-bge-componentは種別フックとして name ベースのまま維持）BlockOptions/ImageEditorのハードコード a11y ID をuseId()化<bge-wysiwyg-editor>のclassList/experimental.itemOptions.wysiwyg.enableTextOnlyMode（static プロパティ、document 単位）sessionStorage、storageKeyオプションで分離可能）テスト
receiverIdの一意性・実クリックでの配送先分離・dispose 後の受信要素残存・rootへのHTMLElement直接渡しを検証する新規テストgetElement()の null/undefined ガード、非 HTMLElement 一致時のエラーを検証する新規テストEditorDialogの ID 一意性、commandfor/formの自己参照を検証する新規テストBlockMenuView/BlockMenu/DraftSwitcher/BlockCatalog（新規スペック追加）の各ボタンでcommandforが実際にengine.commandBus.receiverIdを指すことを検証影響範囲
@burger-editor/core/client/custom-element/blocks/storybook。@burger-editor/local（1ページ=1ファイル前提の開発用 CMS）はスコープ外。exportsの変更なし。検証
yarn lint: エラー 0NX_WORKSPACE_ROOT_PATH=<worktree> yarn build: 16 プロジェクト全成功yarn test:unit（ホスト実行）: 非 VR 全 1488 件通過。VR 24 件は変更前から存在する既知のホスト/Docker フォントレンダリング差異で失敗（CSS は無変更）yarn test（Docker 経由の VR 込みフルスイート）は未実行。CI での確認が必要