Fix: ensure custom field query propagation, change detection (#11291)

src-ui/src/app/utils/custom-field-query-element.spec.ts

@@ -1,4 +1,3 @@
-import { fakeAsync, tick } from '@angular/core/testing'
 import {
   CustomFieldQueryElementType,
   CustomFieldQueryLogicalOperator,
@@ -111,13 +110,38 @@ describe('CustomFieldQueryAtom', () => {
     expect(atom.serialize()).toEqual([1, 'operator', 'value'])
   })
 
-  it('should emit changed on value change after debounce', fakeAsync(() => {
+  it('should emit changed on value change immediately', () => {
     const atom = new CustomFieldQueryAtom()
     const changeSpy = jest.spyOn(atom.changed, 'next')
     atom.value = 'new value'
-    tick(1000)
     expect(changeSpy).toHaveBeenCalled()
-  }))
+  })
+
+  it('should ignore duplicate array emissions', () => {
+    const atom = new CustomFieldQueryAtom()
+    atom.operator = CustomFieldQueryOperator.In
+    const changeSpy = jest.fn()
+    atom.changed.subscribe(changeSpy)
+
+    atom.value = [1, 2]
+    expect(changeSpy).toHaveBeenCalledTimes(1)
+
+    changeSpy.mockClear()
+    atom.value = [1, 2]
+    expect(changeSpy).not.toHaveBeenCalled()
+  })
+
+  it('should emit when array values differ while length matches', () => {
+    const atom = new CustomFieldQueryAtom()
+    atom.operator = CustomFieldQueryOperator.In
+    const changeSpy = jest.fn()
+    atom.changed.subscribe(changeSpy)
+
+    atom.value = [1, 2]
+    changeSpy.mockClear()
+    atom.value = [1, 3]
+    expect(changeSpy).toHaveBeenCalledTimes(1)
+  })
 })
 
 describe('CustomFieldQueryExpression', () => {

src-ui/src/app/utils/custom-field-query-element.ts

@@ -1,4 +1,4 @@
-import { Subject, debounceTime, distinctUntilChanged } from 'rxjs'
+import { Subject, distinctUntilChanged } from 'rxjs'
 import { v4 as uuidv4 } from 'uuid'
 import {
   CUSTOM_FIELD_QUERY_VALUE_TYPES_BY_OPERATOR,
@@ -110,7 +110,22 @@ export class CustomFieldQueryAtom extends CustomFieldQueryElement {
 
   protected override connectValueModelChanged(): void {
     this.valueModelChanged
-      .pipe(debounceTime(1000), distinctUntilChanged())
+      .pipe(
+        distinctUntilChanged((previous, current) => {
+          if (Array.isArray(previous) && Array.isArray(current)) {
+            if (previous.length !== current.length) {
+              return false
+            }
+            for (let i = 0; i < previous.length; i++) {
+              if (previous[i] !== current[i]) {
+                return false
+              }
+            }
+            return true
+          }
+          return previous === current
+        })
+      )
       .subscribe(() => {
         this.changed.next(this)
       })