E2E/Playwright: MM-T5424 Find channel limit to 50 results (#23248)

* fix aria-label of Find Channels modal

* add components

* add test for MM-T5424

---------

Co-authored-by: Mattermost Build <build@mattermost.com>

webapp/channels/src/components/quick_switch_modal/__snapshots__/quick_switch_modal.test.tsx.snap

@@ -3,8 +3,8 @@
 exports[`components/QuickSwitchModal should match snapshot 1`] = `
 <Modal
   animation={false}
-  aria-describedby="quickSwitchHeader"
-  aria-labelledby="quickSwitchModalLabel"
+  aria-describedby="quickSwitchHeaderWithHint"
+  aria-labelledby="quickSwitchHeader"
   autoFocus={true}
   backdrop={true}
   bsClass="modal"
@@ -42,9 +42,11 @@ exports[`components/QuickSwitchModal should match snapshot 1`] = `
   >
     <div
       className="channel-switcher__header"
-      id="quickSwitchHeader"
+      id="quickSwitchHeaderWithHint"
     >
-      <h1>
+      <h1
+        id="quickSwitchHeader"
+      >
         <MemoizedFormattedMessage
           defaultMessage="Find Channels"
           id="quick_switch_modal.switchChannels"

webapp/channels/src/components/quick_switch_modal/quick_switch_modal.tsx

@@ -157,7 +157,7 @@ export default class QuickSwitchModal extends React.PureComponent<Props, State>
         const providers: SwitchChannelProvider[] = this.channelProviders;
 
         const header = (
-            <h1>
+            <h1 id='quickSwitchHeader'>
                 <FormattedMessage
                     id='quick_switch_modal.switchChannels'
                     defaultMessage='Find Channels'
@@ -190,8 +190,8 @@ export default class QuickSwitchModal extends React.PureComponent<Props, State>
                 enforceFocus={false}
                 restoreFocus={false}
                 role='dialog'
-                aria-labelledby='quickSwitchModalLabel'
-                aria-describedby='quickSwitchHeader'
+                aria-labelledby='quickSwitchHeader'
+                aria-describedby='quickSwitchHeaderWithHint'
                 animation={false}
             >
                 <Modal.Header
@@ -201,7 +201,7 @@ export default class QuickSwitchModal extends React.PureComponent<Props, State>
                 <Modal.Body>
                     <div
                         className='channel-switcher__header'
-                        id='quickSwitchHeader'
+                        id='quickSwitchHeaderWithHint'
                     >
                         {header}
                         <div