コネクタコンポーネントで{{didInsert}}を使用する際のエラー：「Class constructor DidInsertModifier cannot be invoked without 'new'」

[jahan_gagan]

こんにちはチーム、

カスタムテーマコンポーネントで作業しており、プラグインのアウトレット kanban-card-bottom を介してコネクタコンポーネントを使用しようとしています。そのコネクタコンポーネント内で、{{didInsert}} モディファイアを使用してレンダリング後に DOM ロジックを実行したいと考えています。

しかし、テンプレートに {{didInsert this.modifyElement}} を追加するとすぐに、ブラウザコンソールに次のエラーが発生します。

Uncaught (in promise) TypeError: Class constructor DidInsertModifier cannot be invoked without 'new'
    at FunctionHelperManager.getValue (index.js:214:86)

私のコンポーネントのセットアップ：

// javascripts/discourse/connectors/kanban-card-bottom/replace-last-post-by.gjs
import Component from "@glimmer/component";
import { action } from "@ember/object";
import didInsert from "@ember/render-modifiers/modifiers/did-insert";

export default class ReplaceLastPostBy extends Component {
  @action
  modifyElement(element) {
    console.log("Element ====> ", element);
  }

  <template>
    {{didInsert this.modifyElement}}
  </template>
}

目標：
このコネクタコンポーネントから、レンダリング後に DOM 要素をターゲットにするだけでよい（例：ユーザー名を視覚的に置き換える）。

何か洞察があれば幸いです！

エラーのスクリーンショット

よろしくお願いします。

[david (David Taylor)]

例にコードがいくつか欠けているようですね。\u003ctemplate\u003e / \u003c/template\u003e が表示され、モディファイアが次のような要素にアタッチされることを期待していました。

\u003ctemplate\u003e
  \u003cdiv {{didInsert this.modifyElement}}\u003e
    ...
  \u003c/div\u003e
\u003c/template\u003e