Erreur lors de l'utilisation de {{didInsert}} dans un composant connecteur : « DidInsertModifier ne peut pas être appelé sans 'new' »

Dev
1

Salut l’équipe,

Je travaille sur un composant de thème personnalisé et j’essaie d’utiliser un composant connecteur via la sortie de plugin kanban-card-bottom. À l’intérieur de ce composant connecteur, je veux exécuter une logique DOM après le rendu en utilisant le modificateur {{didInsert}}.

Cependant, dès que j’ajoute {{didInsert this.modifyElement}} dans le template, j’obtiens l’erreur suivante dans la console du navigateur :

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

Ma configuration de composant :

// 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>
}

Objectif :
Je veux simplement cibler un élément DOM après le rendu à partir de ce composant connecteur (par exemple, remplacer visuellement un nom d’utilisateur).

Vos éclaircissements seraient appréciés !

Capture d'écran de l'erreur

Screenshot 2025-07-08 at 7.12.14 PM
Screenshot 2025-07-08 at 7.12.14 PM1920×1249 140 KB

Merci,

2

Il semble qu’il manque du code dans votre exemple ? Je m’attendrais à voir un <template> / </template>, et à ce que le modificateur soit attaché à un élément comme

<template>
  <div {{didInsert this.modifyElement}}>
    ...
  </div>
</template>
1 « J'aime »
3

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.