Fix linting and tests

Author: pksjce

packages/react/src/ActionList/List.tsx

@@ -43,7 +43,8 @@ export const List = React.forwardRef<HTMLUListElement, ActionListProps>(
       disabled: !enableFocusZone,
       containerRef: listRef,
       bindKeys: FocusKeys.ArrowVertical | FocusKeys.HomeAndEnd | FocusKeys.PageUpDown,
-      focusOutBehavior: listRole === 'menu' || container === 'SelectPanel' || container === 'FilteredActionList' ? 'wrap' : undefined,
+      focusOutBehavior:
+        listRole === 'menu' || container === 'SelectPanel' || container === 'FilteredActionList' ? 'wrap' : undefined,
     })
 
     return (

packages/react/src/FilteredActionList/FilteredActionListWithModernActionList.tsx

@@ -76,7 +76,7 @@ export function FilteredActionList({
   )
 
   const [enableAnnouncements, setEnableAnnouncements] = useState(false)
-  const [selectedItems, setSelectedItems] = useState<(string | number | undefined)[]>([])
+  const [selectedItems] = useState<(string | number | undefined)[]>([])
 
   const scrollContainerRef = useRef<HTMLDivElement>(null)
   const inputRef = useProvidedRefOrCreate<HTMLInputElement>(providedInputRef)
@@ -140,9 +140,9 @@ export function FilteredActionList({
     const updateActiveIndicator = () => {
       // Clear any existing active indicators
       const activeItems = list.querySelectorAll(`.${classes.ActiveItem}`)
-      activeItems.forEach(item => {
+      for (const item of activeItems) {
         item.classList.remove(classes.ActiveItem)
-      })
+      }
 
       if (inputRef.current && document.activeElement === inputRef.current) {
         // When input is focused, mark the first item as active
@@ -175,7 +175,7 @@ export function FilteredActionList({
     return () => {
       document.removeEventListener('focusin', handleFocusIn)
     }
-  }, [items]) // Re-run when items change to ensure first item is properly marked
+  }, [items, inputRef]) // Re-run when items change to ensure first item is properly marked
 
   useEffect(() => {
     setEnableAnnouncements(announcementsEnabled)

packages/react/src/FilteredActionList/useAnnouncements.tsx

@@ -21,7 +21,6 @@ export const useAnnouncements = (
   listContainerRef: React.RefObject<HTMLUListElement>,
   inputRef: React.RefObject<HTMLInputElement>,
   enabled: boolean = true,
-  loading: boolean = false,
 ) => {
   const liveRegion = document.querySelector('live-region')
 

packages/react/src/SelectPanel/SelectPanel.test.tsx

@@ -395,7 +395,7 @@ for (const useModernActionList of [false, true]) {
           )
         })
 
-        it('should support navigating through items with PageDown and PageUp', async () => {
+        it('should support navigating through items with PageDown and PageUp (modern ActionList)', async () => {
           if (!useModernActionList) return // this feature is only enabled with feature flag on
 
           const user = userEvent.setup()
@@ -694,10 +694,11 @@ for (const useModernActionList of [false, true]) {
           jest.runAllTimers()
           // we wait because announcement is intentionally updated after a timeout to not interrupt user input
           await waitFor(async () => {
+            // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
             if (useModernActionList) {
-              expect(getLiveRegion().getMessage('polite')?.trim()).toEqual('3 items.')
+              expect(getLiveRegion().getMessage('polite')!.trim()).toEqual('3 items available, 0 selected.')
             } else {
-              expect(getLiveRegion().getMessage('polite')?.trim()).toEqual(
+              expect(getLiveRegion().getMessage('polite')!.trim()).toEqual(
                 'List updated, Focused item: item one, not selected, 1 of 3',
               )
             }
@@ -752,7 +753,7 @@ for (const useModernActionList of [false, true]) {
           await user.click(screen.getByText('Select items'))
           expect(screen.getByLabelText('Filter items')).toHaveFocus()
 
-          expect(getLiveRegion().getMessage('polite')?.trim()).toContain('This is a notice')
+          expect(getLiveRegion().getMessage('polite')!.trim()).toContain('This is a notice')
         })
 
         it('should announce filtered results', async () => {
@@ -768,10 +769,11 @@ for (const useModernActionList of [false, true]) {
           jest.runAllTimers()
           await waitFor(
             async () => {
+              // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
               if (useModernActionList) {
-                expect(getLiveRegion().getMessage('polite')?.trim()).toEqual('3 items.')
+                expect(getLiveRegion().getMessage('polite')!.trim()).toEqual('3 items available, 0 selected.')
               } else {
-                expect(getLiveRegion().getMessage('polite')?.trim()).toEqual(
+                expect(getLiveRegion().getMessage('polite')!.trim()).toEqual(
                   'List updated, Focused item: item one, not selected, 1 of 3',
                 )
               }
@@ -785,8 +787,9 @@ for (const useModernActionList of [false, true]) {
           jest.runAllTimers()
           await waitFor(
             async () => {
+              // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
               if (useModernActionList) {
-                expect(getLiveRegion().getMessage('polite')).toBe('2 items.')
+                expect(getLiveRegion().getMessage('polite')).toBe('2 items available, 0 selected.')
               } else {
                 expect(getLiveRegion().getMessage('polite')).toBe(
                   'List updated, Focused item: item one, not selected, 1 of 2',
@@ -801,10 +804,11 @@ for (const useModernActionList of [false, true]) {
 
           jest.runAllTimers()
           await waitFor(async () => {
+            // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
             if (useModernActionList) {
-              expect(getLiveRegion().getMessage('polite')?.trim()).toBe('1 items.')
+              expect(getLiveRegion().getMessage('polite')!.trim()).toBe('1 item available, 0 selected.')
             } else {
-              expect(getLiveRegion().getMessage('polite')?.trim()).toBe(
+              expect(getLiveRegion().getMessage('polite')!.trim()).toBe(
                 'List updated, Focused item: item one, not selected, 1 of 1',
               )
             }