From a8d96bffbc35d14fb1bca2c4174863fe47619a5c Mon Sep 17 00:00:00 2001
From: NullVoxPopuli <199018+NullVoxPopuli@users.noreply.github.com>
Date: Tue, 13 Feb 2024 15:07:18 -0500
Subject: [PATCH] Add test for conditional on to try to reproduce
 https://github.com/emberjs/ember.js/issues/20647

---
 .../test/modifiers/on-test.ts                 | 34 ++++++++++++++++---
 1 file changed, 30 insertions(+), 4 deletions(-)

diff --git a/packages/@glimmer-workspace/integration-tests/test/modifiers/on-test.ts b/packages/@glimmer-workspace/integration-tests/test/modifiers/on-test.ts
index ad43550b90..d81cf1835f 100644
--- a/packages/@glimmer-workspace/integration-tests/test/modifiers/on-test.ts
+++ b/packages/@glimmer-workspace/integration-tests/test/modifiers/on-test.ts
@@ -315,11 +315,37 @@ if (hasDom) {
       this.assertCounts({ adds: 1, removes: 0 });
     }
 
+    @test
+    'updates to a (remaining truthy) condition do not leave the element without an attached modifier'(assert:
+      Assert) {
+      let calledCount = 0;
+
+      this.render('<button {{on "click" this.callback}}>Click Me</button>', {
+        callback() {
+          calledCount++;
+        },
+        condition: true,
+      });
+
+      this.findButton().click();
+      assert.strictEqual(calledCount, 1, 'callback is being invoked');
+
+      this.rerender({ condition: true });
+
+      this.findButton().click();
+      assert.strictEqual(calledCount, 2, 'callback is being invoked');
+
+      this.rerender({ condition: true });
+
+      this.findButton().click();
+      assert.strictEqual(calledCount, 3, 'callback is being invoked');
+    }
+
     @test
     'asserts when eventName is missing'(assert: Assert) {
       assert.throws(() => {
         this.render(`<button {{on undefined this.callback}}>Click Me</button>`, {
-          callback() {},
+          callback() { },
         });
       }, /You must pass a valid DOM event name as the first argument to the `on` modifier/u);
     }
@@ -328,7 +354,7 @@ if (hasDom) {
     'asserts when eventName is a bound undefined value'(assert: Assert) {
       assert.throws(() => {
         this.render(`<button {{on this.someUndefinedThing this.callback}}>Click Me</button>`, {
-          callback() {},
+          callback() { },
         });
       }, /You must pass a valid DOM event name as the first argument to the `on` modifier/u);
     }
@@ -337,7 +363,7 @@ if (hasDom) {
     'asserts when eventName is a function'(assert: Assert) {
       assert.throws(() => {
         this.render(`<button {{on this.callback}}>Click Me</button>`, {
-          callback() {},
+          callback() { },
         });
       }, /You must pass a valid DOM event name as the first argument to the `on` modifier/u);
     }
@@ -384,7 +410,7 @@ if (hasDom) {
     'asserts if more than 2 positional parameters are provided'(assert: Assert) {
       assert.throws(() => {
         this.render(`<button {{on 'click' this.callback this.someArg}}>Click Me</button>`, {
-          callback() {},
+          callback() { },
           someArg: 'foo',
         });
       }, /You can only pass two positional arguments \(event name and callback\) to the `on` modifier, but you provided 3. Consider using the `fn` helper to provide additional arguments to the `on` callback./u);