Cannot destructure property 'manager' of '.for' as it is undefined.

[amk221]

🔬 Minimal Reproduction

Minimal reproduction of an error in ember-modifier

 Cannot destructure property 'manager' of '.for' as it is undefined.

amk221/-ember-modifier-manager@a3765c5#diff-91d02793f5c4fd5e02a401c33509cafcb6fc7613aef16d97afe18f4b4a080d5cR18-R20

🌍 Environment

• Ember: - 5.8
• Ember-CLI: -
• Node.js/npm: -
• OS: -
• Browser: -

[NullVoxPopuli]

Does the issue appear in

• ember-source 5.9?
• gjs?

Thanks!

[amk221]

ember-source 5.9 = yes, still occurs

gjs = yes, it still occurs in our app, which is gjs with the original error as above. But, in terms of focusing on the minimal reproduction, no, it instead outputs:

Attempted to set the same type of manager multiple times on a value. You can only associate one manager of each type with a given value. Value was (unknown function)

[NullVoxPopuli]

That second error seems like the deps got messed up. Does using pnpm reproduce nhe original error?

[amk221]

relooking

[amk221]

You're right.

Here's a gjs branch, with the original error

amk221/-ember-modifier-manager@7832982#diff-8b01f9fcdd7fd5370da514614ab30fe4ea2ebfd452dac4b7e4fd3482dc0e5421R55-R57

[NullVoxPopuli]

In the gjs branch, there was an issue.
the modifier import was shadowing the keyword.

After the fix (amk221/-ember-modifier-manager#1), the new error is

Uncaught (in promise) TypeError: scheduledUpdateModifiers[Symbol.iterator]().next().value is undefined
    commit runtime.js:3904
    commit runtime.js:3972
    inTransaction runtime.js:3991
    Ember 3
    invoke backburner.js.js:272
    flush backburner.js.js:188
    flush backburner.js.js:344
    _end backburner.js.js:773
    _boundAutorunEnd backburner.js.js:509
    promise callback*buildNext/< backburner.js.js:26
    flush Ember

which is another issue 🤔

[NullVoxPopuli]

It's possible that one of these caused the issue:

• Don't infinitely duplicate positional arguments when modifiers update glimmerjs/glimmer-vm#1565
• Refactor on modifier implementation glimmerjs/glimmer-vm#1573

just kidding, these landed in 5.9

[NullVoxPopuli]

ah, no the repro has a problem

[NullVoxPopuli]

Here is the fix:

• don't have two click listeners changing data for the modifier at the same time

diff --git a/app/components/foo.gjs b/app/components/foo.gjs
index 2dd2640..56f7ba3 100644
--- a/app/components/foo.gjs
+++ b/app/components/foo.gjs
@@ -23,12 +23,7 @@ export default class Foo extends Component {
   close() {
     console.log("close");
     this.isOpen = false;
-  }
-
-  @action
-  setValue(value) {
-    console.log("setValue");
-    this.value = value;
+    this.value = "foo";
   }
 
   <template>
@@ -44,7 +39,6 @@ export default class Foo extends Component {
       type="button"
       class="close"
       {{on "click" this.close}}
-      {{on "click" (fn this.setValue "foo")}}
     >
       Close
     </button>

Now... should it work? probably.
why doesn't it work? idk.

maybe @chancancode can provide some insights there.

[amk221]

Thanks for looking!

I don't think it's the fact that it uses two click handlers, rather, that it updates another tracked property that is an argument to the modifier? Since, you can combine the click handler and the error still happens.

Anyway, I really would like this to work of course, since the code is 'valid' also don't forget this is an unrealistic minimal production and in reality, one might not be in control to be able to do your suggested fix

[NullVoxPopuli]

Since, you can combine the click handler and the error still happens.

that's not what happens in my PR to your repro 🤔

Anyway, I really would like this to work of course

yeah, the fact it doesn't work does seem bad

[betocantu93]

Im also having this error with ember-focus-trap

Attempted to set the same type of manager multiple times on a value. You can only associate one manager of each type with a given value. Value was (unknown function)

But with FocusTrapModifier, while on host app using ember-eui components