GitLab

NTP realbox matches support different icons for different match types:
"loupe" for search suggestions, "clock" for historical search suggestions,
"page" for navigation suggestions, "drive icons" for Google Drive, etc.
Currently only the "loupe" and "clock" are supported by hardcoding in CSS.
This CL changes that by sending the appropriate icon information along with
the matches form C++ to JS allowing for a 1:1 mapping between the icons in
the NTP realbox and the Omnibox. A followup CL will complete this mapping
and add tests to avoid regression in the future.

NTP realbox input has a "loupe" icon by default. When a match with a
different icon or favicon is selected, the realbox input also gets that
icon/favicon. This CL refactors the way these icons/favicons are displayed
for the realbox input as well as the matches: Icons are rendered via
webkit-mask-image and background-color and favicons are rendered via
background-image set on the element's style property in JS.

Also instead of requesting favicons for *every* navigation match which
results in display the default "page" favicon for matches without one,
favicons are now requested in C++ and sent to JS only if one is available;
taking advantage of high res SVG icon for matches without a favicon as well
as Google Drive matches, calculator matches, etc.

Bug: 1039357,1061221
Change-Id: I90e17aa573ba7ef211e3f1423fa7de511cb7e053
Tbr: dcheng@chromium.org
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2106655
Commit-Queue: Moe Ahmadi <mahmadi@chromium.org>
Reviewed-by: Daniel Cheng <dcheng@chromium.org>
Reviewed-by: Tommy Li <tommycli@chromium.org>
Reviewed-by: Esmael Elmoslimany <aee@chromium.org>
Cr-Commit-Position: refs/heads/master@{#753126}