refactor(aria/grid): use read/write appropariately in afterRenderEffect

Author: adolgachev

src/aria/grid/grid-cell-widget.ts

@@ -104,19 +104,23 @@ export class GridCellWidget {
   }
 
   constructor() {
-    afterRenderEffect(() => {
-      if (this._pattern.isActivated()) {
-        const activateEvent = this._pattern.lastActivateEvent();
-        this.activated.emit(activateEvent);
-        this._pattern.focus();
-      }
+    afterRenderEffect({
+      read: () => {
+        if (this._pattern.isActivated()) {
+          const activateEvent = this._pattern.lastActivateEvent();
+          this.activated.emit(activateEvent);
+          this._pattern.focus();
+        }
+      },
     });
 
-    afterRenderEffect(() => {
-      const deactivateEvent = this._pattern.lastDeactivateEvent();
-      if (deactivateEvent) {
-        this.deactivated.emit(deactivateEvent);
-      }
+    afterRenderEffect({
+      read: () => {
+        const deactivateEvent = this._pattern.lastDeactivateEvent();
+        if (deactivateEvent) {
+          this.deactivated.emit(deactivateEvent);
+        }
+      },
     });
   }
 

src/aria/grid/grid.ts

@@ -129,11 +129,12 @@ export class Grid {
   });
 
   constructor() {
-    afterRenderEffect(() => this._pattern.setDefaultStateEffect());
-    afterRenderEffect(() => this._pattern.resetStateEffect());
-    afterRenderEffect(() => this._pattern.resetFocusEffect());
-    afterRenderEffect(() => this._pattern.restoreFocusEffect());
-    afterRenderEffect(() => this._pattern.focusEffect());
+    // Use Write mode for all direct DOM focus management actions.
+    afterRenderEffect({write: () => this._pattern.setDefaultStateEffect()});
+    afterRenderEffect({write: () => this._pattern.resetStateEffect()});
+    afterRenderEffect({write: () => this._pattern.resetFocusEffect()});
+    afterRenderEffect({write: () => this._pattern.restoreFocusEffect()});
+    afterRenderEffect({write: () => this._pattern.focusEffect()});
   }
 
   /** Gets the cell pattern for a given element. */