# Error using {{didInsert}} in a connector component: “Class constructor DidInsertModifier cannot be invoked without 'new'”

**URL:** <https://meta.discourse.org/t/error-using-didinsert-in-a-connector-component-class-constructor-didinsertmodifier-cannot-be-invoked-without-new/373377>\
**Category:** Development\
**Created:** [July 8, 2025, 1:56pm UTC](https://meta.discourse.org/t/error-using-didinsert-in-a-connector-component-class-constructor-didinsertmodifier-cannot-be-invoked-without-new/373377 "2025-07-08T13:56:33Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![jahan\_gagan](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jahan_gagan/32/501948_2.png) [@jahan\_gagan](https://meta.discourse.org/u/jahan_gagan)\
**Post date:** [July 8, 2025, 1:56pm UTC](https://meta.discourse.org/t/error-using-didinsert-in-a-connector-component-class-constructor-didinsertmodifier-cannot-be-invoked-without-new/373377/1 "2025-07-08T13:56:33Z")

</div>

Hi team,

I’m working on a custom theme component and trying to use a connector component via the plugin outlet `kanban-card-bottom`. Inside that connector component, I want to run DOM logic after render using the `{{didInsert}}` modifier.

However, as soon as I add `{{didInsert this.modifyElement}}` in the template, I get the following error in the browser console:

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

```

My component setup:

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

```

Goal:  
I simply want to target a DOM element after render from this connector component (e.g., replace a username visually).

Any insights would be appreciated!

> **Error Screenshot**
>
> ![Screenshot 2025-07-08 at 7.12.14 PM](https://global.discourse-cdn.com/meta/original/4X/b/4/2/b423302be7d6898244a3fc2d32542996fb373d09.jpeg)

Thanks,

---

<div class="post-metadata">

**Author:** ![david](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/david/32/157490_2.png) [@david](https://meta.discourse.org/u/david)\
**Post date:** [July 8, 2025, 1:59pm UTC](https://meta.discourse.org/t/error-using-didinsert-in-a-connector-component-class-constructor-didinsertmodifier-cannot-be-invoked-without-new/373377/2 "2025-07-08T13:59:27Z")

</div>

It looks like there’s some code missing from your example? I’d expect to see a `<template>` / `</template>`, and for the modifier to be attached to an element like

```plaintext
<template>
  <div {{didInsert this.modifyElement}}>
    ...
  </div>
</template>

```

---

<div class="post-metadata">

**Author:** ![system](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/system/32/443519_2.png) [@system](https://meta.discourse.org/u/system)\
**Post date:** [August 7, 2025, 1:59pm UTC](https://meta.discourse.org/t/error-using-didinsert-in-a-connector-component-class-constructor-didinsertmodifier-cannot-be-invoked-without-new/373377/3 "2025-08-07T13:59:47Z")

</div>

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