test: use document.activeElement instead of pseudo :focus query search

Some tests seem to use `:focus` instead of `document.activeElement` for test
assertions. This seems to work unreliably in Safari as sometimes the `:focus`
query returns `null`, unless `document.activeElement` is requested before (which
seems to indicate that `document.activeElement` does something under-the-hood
to determine the active element, while `querySelector(':focus')` does not have this.

The details on why `activeElement` is better in our case are a little hypothetical
but doesn't seem worth investigating a lot since in all other places in the repo
we haven't used this pattern for checking the active document element.

Author: devversion

src/cdk-experimental/menu/context-menu.spec.ts

@@ -126,7 +126,7 @@ describe('CdkContextMenuTrigger', () => {
 
     it('should focus the first menuitem when the context menu is opened', () => {
       openContextMenu();
-      expect(document.querySelector(':focus')!.id).toEqual('first_menu_item');
+      expect(document.activeElement!.id).toEqual('first_menu_item');
     });
   });
 

src/cdk-experimental/menu/menu-bar.spec.ts

@@ -986,8 +986,8 @@ describe('MenuBar', () => {
         dispatchMouseEvent(menuBarNativeItems[0], 'mouseenter');
         detectChanges();
 
-        expect(document.querySelector(':focus')).not.toEqual(menuBarNativeItems[0]);
-        expect(document.querySelector(':focus')).not.toEqual(menuBarNativeItems[1]);
+        expect(document.activeElement).not.toEqual(menuBarNativeItems[0]);
+        expect(document.activeElement).not.toEqual(menuBarNativeItems[1]);
       },
     );
 
@@ -1089,7 +1089,7 @@ describe('MenuBar', () => {
 
         dispatchKeyboardEvent(nativeMenus[0], 'keydown', DOWN_ARROW);
 
-        expect(document.querySelector(':focus')).toEqual(fileMenuNativeItems[1]);
+        expect(document.activeElement).toEqual(fileMenuNativeItems[1]);
       },
     );
 

src/cdk-experimental/menu/menu.spec.ts

@@ -214,7 +214,7 @@ describe('Menu', () => {
       dispatchKeyboardEvent(document, 'keydown', TAB);
       nativeMenu.focus();
 
-      expect(document.querySelector(':focus')).toEqual(nativeMenuItems[0]);
+      expect(document.activeElement).toEqual(nativeMenuItems[0]);
     });
   });
 

src/material-experimental/menubar/menubar.spec.ts

@@ -53,12 +53,12 @@ describe('MatMenuBar', () => {
   it('should toggle focused items on left/right click', () => {
     nativeMatMenubar.focus();
 
-    expect(document.querySelector(':focus')!.id).toBe('first');
+    expect(document.activeElement!.id).toBe('first');
 
     dispatchKeyboardEvent(nativeMatMenubar, 'keydown', RIGHT_ARROW);
     fixture.detectChanges();
 
-    expect(document.querySelector(':focus')!.id).toBe('second');
+    expect(document.activeElement!.id).toBe('second');
   });
 });