WebUI NTP: focus on fakebox when touched

Depending on what has focus, mousedown event may not be emitted when
a user touches an element. Elements should handle the pointerdown event
instead.

Change-Id: I255812428698be93b547869f6b2674ad6f86047a
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2141201
Commit-Queue: Esmael Elmoslimany <aee@chromium.org>
Reviewed-by: Tibor Goldschwendt <tiborg@chromium.org>
Cr-Commit-Position: refs/heads/master@{#757531}

chrome/browser/resources/new_tab_page/fakebox.html

@@ -112,7 +112,7 @@
     box-shadow: 0 0 0 2px var(--ntp-focus-shadow-color);
   }
 </style>
-<input id="input" on-mousedown="onMousedown_" on-paste="onPaste_"
+<input id="input" on-pointerdown="onPointerDown_" on-paste="onPaste_"
     on-dragenter="onDragenter_" on-dragleave="onDragleave_" on-drop="onDrop_"
     autocomplete="off" tabindex="-1" type="url" aria-hidden="true">
 </input>

chrome/browser/resources/new_tab_page/fakebox.js

@@ -75,7 +75,7 @@ class FakeboxElement extends PolymerElement {
   }
 
   /** @private */
-  onMousedown_() {
+  onPointerDown_() {
     this.pageHandler_.focusOmnibox();
   }
 

chrome/test/data/webui/new_tab_page/fakebox_test.js

@@ -5,7 +5,6 @@
 import 'chrome://new-tab-page/fakebox.js';
 
 import {BrowserProxy} from 'chrome://new-tab-page/browser_proxy.js';
-import {down} from 'chrome://resources/polymer/v3_0/iron-test-helpers/mock-interactions.js';
 import {assertNotStyle, assertStyle, createTestProxy, NONE_ANIMATION} from 'chrome://test/new_tab_page/test_support.js';
 import {eventToPromise} from 'chrome://test/test_util.m.js';
 
@@ -88,7 +87,7 @@ suite('NewTabPageFakeboxTest', () => {
 
   test('on mouse down focuses omnibox', async () => {
     // Act.
-    down(fakebox.$.input);
+    fakebox.$.input.dispatchEvent(new PointerEvent('pointerdown'));
 
     // Assert.
     await testProxy.handler.whenCalled('focusOmnibox');