Prototype fix (targeted variant) for emberjs#19287: defer disabled writes

packages/@ember/-internals/glimmer/tests/integration/content-test.js

@@ -1806,7 +1806,7 @@ if (DEBUG) {
 moduleFor(
   'Dynamic content tests: disabling a focused element',
   class extends RenderingTestCase {
-    async '@todo a {{on "blur"}} listener may update rendered state when the element becomes disabled (GH#19287)'(
+    async '@test a {{on "blur"}} listener may update rendered state when the element becomes disabled (GH#19287)'(
       assert
     ) {
       let error;

packages/@glimmer/interfaces/lib/runtime/environment.d.ts

@@ -38,6 +38,7 @@ export interface Environment {
 
   scheduleInstallModifier(modifier: ModifierInstance): void;
   scheduleUpdateModifier(modifier: ModifierInstance): void;
+  scheduleAttributeUpdate(update: () => void): void;
 
   begin(): void;
   commit(): void;

packages/@glimmer/runtime/lib/environment.ts

@@ -28,6 +28,7 @@ export const TRANSACTION: TransactionSymbol = Symbol('TRANSACTION') as Transacti
 class TransactionImpl implements Transaction {
   public scheduledInstallModifiers: ModifierInstance[] = [];
   public scheduledUpdateModifiers: ModifierInstance[] = [];
+  public scheduledAttributeUpdates: (() => void)[] = [];
   public createdComponents: ComponentInstanceWithCreate[] = [];
   public updatedComponents: ComponentInstanceWithCreate[] = [];
 
@@ -47,7 +48,15 @@ class TransactionImpl implements Transaction {
     this.scheduledUpdateModifiers.push(modifier);
   }
 
+  scheduleAttributeUpdate(update: () => void) {
+    this.scheduledAttributeUpdates.push(update);
+  }
+
   commit() {
+    for (const update of this.scheduledAttributeUpdates) {
+      update();
+    }
+
     let { createdComponents, updatedComponents } = this;
 
     for (const { manager, state } of createdComponents) {
@@ -173,6 +182,10 @@ export class EnvironmentImpl implements Environment {
     }
   }
 
+  scheduleAttributeUpdate(update: () => void) {
+    this.transaction.scheduleAttributeUpdate(update);
+  }
+
   commit() {
     let transaction = this.transaction;
     this[TRANSACTION] = null;

packages/@glimmer/runtime/lib/vm/attributes/dynamic.ts

@@ -74,6 +74,10 @@ function buildDynamicProperty(
     return new OptionSelectedDynamicAttribute(name, attribute);
   }
 
+  if (name === 'disabled') {
+    return new DisabledDynamicProperty(name, attribute);
+  }
+
   return new DefaultDynamicProperty(name, attribute);
 }
 
@@ -148,6 +152,15 @@ export class DefaultDynamicProperty extends DynamicAttribute {
   }
 }
 
+export class DisabledDynamicProperty extends DefaultDynamicProperty {
+  override update(value: unknown, env: Environment): void {
+    // Disabling a focused element makes the browser fire `blur` synchronously;
+    // defer the write to transaction commit so event listeners run outside the
+    // render transaction.
+    env.scheduleAttributeUpdate(() => super.update(value, env));
+  }
+}
+
 export class SafeDynamicProperty extends DefaultDynamicProperty {
   override set(dom: TreeBuilder, value: unknown, env: Environment): void {
     const { element, name } = this.attribute;