title: How to focus on `ag-Grid` so the next key press is an key event come from `ag-Grid` itself
body: <p>I made some custom navigation component for <code>ag-Grid</code>.</p>
  
  <p>Once action from the user happens, I want to focus on one of <code>ag-Grid</code>'s rows or cells, as if the user simply clicked one of <code>ag-Grid</code>'s cells himself.</p>
  
  <p>So after this focusing, the next time I press a key like <code>Up</code>/<code>Down</code>/<code>Left</code>/<code>Right</code>, it is registered as an <code>ag-Grid</code>'s keyboard interaction event (<a href="https://www.ag-grid.com/javascript-grid-keyboard-navigation/#navigatetonextcell" rel="nofollow noreferrer">Keyboard Interaction: Core Feature of our Datagrid</a>).</p>
  
  <p>In more concrete words, the <code>navigateToNextCell()</code> hook should get called once an arrow key is pressed.</p>
  
  <p>How do I do this?</p>
  
  <p>I experimented on things like:</p>
  
  <ul>
  <li><code>gridApi.setFocusedCell(0, 0)</code></li>
  <li><code>gridApi.dispatchEvent({ type: 'cellFocused', rowIndex, column })</code></li>
  <li><code>document.querySelector('.ag-root-wrapper').focus()</code></li>
  </ul>
  
  <p>None of these things worked.</p>