chrome/browser/resources/omnibox/omnibox.html - chromium/src - Git at Google

 <!doctype html>
 <html lang="en">
 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <title>Omnibox Debug Page</title>
   <link rel="stylesheet" href="chrome://resources/css/text_defaults.css">
   <link rel="stylesheet" href="omnibox.css">
   <script type="module" src="omnibox.js"></script>
 </head>

 <body>
   <template id="omnibox-input-template">
     <div id="top" class="top drag-container">
       <div class="top-column">
         <input id="input-text" type="text"
                class="row input-icon-container search-icon" accesskey="l"
                autofocus autocomplete="off"
                placeholder="Enter omnibox input [Alt+L]">
         <div class="arrow-container">
           <span id="arrow-padding"></span>
           <span class="arrow-up">▲</span>
         </div>
         <label class="row checkbox-container"
                title="When checked, interacting with the real omnibox of any browser window will update the debug page's output. Incognito window omnibox results will update only debug pages open in incognito windows. Likewise, normal window omnibox results will update only debug pages open in normal windows. When unfocusing the browser omnibox, the autocomplete controller sends a response with no combined results. This response is ignored in order to prevent the previous non-empty response from being hidden and because these results wouldn't normally be displayed by the browser window omnibox.">
             <input id="connect-window-omnibox" type="checkbox" accesskey="w">
             <span>
               Connect <span class="accesskey">w</span>indow omnibox
             </span>
           </label>
         <div class="row response-selection-container">
           <span>Quer<span class="accesskey">y</span></span>
           <input id="response-selection" type="number" accesskey="y" value="0"
                  min="0" max="0">
           <span>of <span id="responses-count">0</span></span>
         </div>
         <span id="history-warning" class="row warning-text"
               title="The output you are currently viewing is historical and may not reflect the current inputs."
               hidden>
             Viewing historical data
           </span>
       </div>

       <div class="top-column">
         <p class="row section-header">Input parameters</p>
         <label class="row checkbox-container">
             <input id="reset-autocomplete-controller" type="checkbox"
                    accesskey="r">
             <span>
               <span class="accesskey">R</span>eset autocomplete controller
             </span>
           </label>
         <label class="row checkbox-container">
             <input id="lock-cursor-position" type="checkbox" accesskey="x">
             <span>
               Lock cursor position to end of input
               [<span class="accesskey">x</span>]
             </span>
           </label>
         <label class="row checkbox-container" title="Assuming it is checked:
 1) To simulate an on-focus input on NTP, choose NTP page classification and clear the input and current URL.
 2) To simulate an on-focus input elsewhere: choose 'arbitrary URL' or a 'SRP' page classification, and add a add a valid (e.g. https://www.google.com) page URL to both the input and current URL.
 3) To simulate an on-clobber input: choose 'arbitrary URL' or a 'SRP' page classification, clear the input, and add a valid page URL to the current URL.">
             <input id="zero-suggest" type="checkbox" accesskey="z">
             <span>
               <span class="accesskey">Z</span>ero suggest
             </span>
           </label>
         <label class="row checkbox-container">
             <input id="prevent-inline-autocomplete" type="checkbox"
                    accesskey="a">
             <span>
               Prevent inline <span class="accesskey">a</span>utocomplete
             </span>
           </label>
         <label class="row checkbox-container">
             <input id="prefer-keyword" type="checkbox" accesskey="k">
             <span>
               In <span class="accesskey">k</span>eyword mode
             </span>
           </label>
       </div>

       <div class="top-column">
         <p class="row section-header">
           Current page c<span class="accesskey">o</span>ntext:
         </p>
         <input id="current-url" type="text" class="row" accesskey="u"
                placeholder="Enter current url (e.g. 'https://www.google.com') [Alt+U]"
                title="Mostly useful when zero-suggest is enabled, but may also affect clipboard and search providers.">
         <select id="page-classification" class="row" accesskey="o">
           <option value="0">Invalid spec</option>
           <option value="1">(OBSOLETE) new tab page</option>
           <option value="2">about:blank</option>
           <option value="3">user's home page</option>
           <option value="4" selected>arbitrary URL</option>
           <option value="6">
             search result page doing search term replacement
           </option>
           <option value="7">new tab page omnibox</option>
           <option value="8">new tab page fakebox</option>
           <option value="9">
             search result page not doing search term replacement
           </option>
           <option value="15">new tab page realbox</option>
           <option value="16">search widget (Android)</option>
           <option value="19">quick action search widget (Android)</option>
           <option value="24">lens overlay contextual searchbox</option>
           <option value="25">search side panel searchbox</option>
           <option value="26">lens side panel searchbox</option>
         </select>
       </div>

       <div class="top-column">
         <p class="row section-header">Display paramters</p>
         <label class="row checkbox-container">
             <input id="show-incomplete-results" type="checkbox" accesskey="i">
             <span>
               Show <span class="accesskey">i</span>ncomplete results
             </span>
           </label>
         <label class="row checkbox-container">
             <input id="show-details" type="checkbox" accesskey="t">
             <span>
               Show all de<span class="accesskey">t</span>ails
             </span>
           </label>
         <label class="row checkbox-container">
             <input id="show-all-providers" type="checkbox" accesskey="p">
             <span>
               Show results per <span class="accesskey">p</span>rovider
             </span>
           </label>
         <div class="column-container">
           <div class="column">
             <label class="row checkbox-container">
               <input id="elide-cells" type="checkbox" accesskey="s">
               <span>
                 Elide cell<span class="accesskey">s</span>
               </span>
             </label>
           </div>
           <div class="column">
             <label class="row checkbox-container">
               <input id="thin-rows" type="checkbox" accesskey="h">
               <span>
                 T<span class="accesskey">h</span>in rows
               </span>
             </label>
           </div>
         </div>
       </div>

       <div class="top-column">
         <p class="row section-header">Output controls</p>
         <input id="filter-text" type="text"
                class="row input-icon-container search-icon" accesskey="g"
                autocomplete="off"
                placeholder="Enter filter (e.g. 'google', 'is:star', 'not:del') [Alt+G]"
                title="Checks each cell individually; i.e. filter text should not span multiple columns. Supports fuzzyness; each character of filter text must be present in the cell, either adjacent to the previous matched character, or at the start of a new word. Words are defined as being delimited by either capital letters, groups of digits, or non alpha characters. E.g. 'abc' matches 'abc', 'a big cat', 'a-bigCat', 'a very big cat', and 'an amBer cat'; but does not match 'abigcat' or 'an amber cat'. 'green rainbow' is matched by 'gre rain', but not by 'gre bow'. One exception is the first character, which may be matched mid-word. E.g. 'een rain' can also match 'green rainbow'. Boolean properties can be searched for via the property name prefixed by 'is:' or 'not:'. Boolean property names are: 'Can Be Default', 'Starred', 'Has Tab Match', 'Del', 'Prev', and 'Done'.">
         <div class="column-container">
           <div class="column">
             <span id="export-clipboard" class="row button" accesskey="c"
                   tabindex="0"
                   title="Copy responses in JSON format. This is not affected by the visibility of output and will include responses in their entirety as well as query and display inputs.">
               <i class="icon copy-icon"></i>
               <span><span class="accesskey">C</span>opy</span>
             </span>
             <span id="export-file" class="row button" accesskey="n" tabindex="0"
                   title="Download responses in JSON format. This is not affected by the visibility of output and will include responses in their entirety as well as query and display inputs.">
               <i class="icon copy-icon"></i>
               <span>Dow<span class="accesskey">n</span>load</span>
             </span>
           </div>
           <div class="column">
               <label id="import-clipboard"
                      class="row icon-button button drag-container" accesskey="v"
                      tabindex="0"
                      title="Import JSON from clipboard. Accepts dragged text and files as well.">
                   <i class="icon copy-icon"></i>
                   <span>Paste [<span class="accesskey">v</span>]</span>
               </label>
               <label id="import-file"
                      class="row icon-button button drag-container" accesskey="m"
                      tabindex="0"
                      title="Upload previously downloaded responses to load them. Accepts dragged text and files as well.">
                   <input id="import-file-input" type="file" accept=".json">
                   <i class="icon copy-icon"></i>
                   <span>Upload [<span class="accesskey">m</span>]</span>
               </label>
               <label id="process-batch"
                      class="row icon-button button drag-container" accesskey="b"
                      tabindex="0"
                      title="Upload a query batch specifier to download a batch export. Accepts dragged text and files as well.">
                   <input id="process-batch-input" type="file" accept=".json">
                   <i class="icon copy-icon"></i>
                   <span>Process <span class="accesskey">b</span>atch</span>
               </label>
           </div>
         </div>
         <span id="imported-warning" class="row warning-text"
               title="The output you are currently viewing is imported and may not be the same as if you had entered these inputs now."
               hidden>
             Viewing imported data
           </span>
       </div>
     </div>
   </template>

   <template id="omnibox-output-template">
     <style>
       [hidden] {
         display: none !important;
       }

       :host {
         font-size: .75rem;
       }

       @media only screen and (min-height: 900px) {
         :host {
           flex-grow: 1;
           overflow-y: scroll;
         }
       }

       output-results-group:not(:last-child) {
         margin-bottom: 30px;
       }
     </style>
     <div id="contents"></div>
   </template>

   <template id="output-results-group-template">
     <output-results-details></output-results-details>
     <table id="table"></table>
   </template>

   <template id="output-results-details-template">
     <style>
       :host {
         background-color: white;
         border: 1px solid var(--border-color);
         display: block;
         padding: 5px;
       }

       .label {
         color: var(--header-color);
         margin-inline-end: 30px;
       }

       .label > span {
         color: var(--action-color);
         font-weight: bold;
       }
     </style>
     <span class="label">
       cursor position = <span id="cursor-position"></span>
     </span>
     <span class="label">
       elapsed time = <span><span id="time"></span>ms</span>
     </span>
     <span class="label">
       all providers done = <span id="done"></span>
     </span>
     <span class="label">type = <span id="type"></span></span>
     <span class="label">host = <span id="host"></span></span>
     <span class="label">is typed host = <span id="is-typed-host"></span></span>
   </template>

   <omnibox-input id="omnibox-input"></omnibox-input>
   <omnibox-output id="omnibox-output"></omnibox-output>
 </body>
 </html>
	<!doctype html>
	<html lang="en">
	<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>Omnibox Debug Page</title>
	<link rel="stylesheet" href="chrome://resources/css/text_defaults.css">
	<link rel="stylesheet" href="omnibox.css">
	<script type="module" src="omnibox.js"></script>
	</head>

	<body>
	<template id="omnibox-input-template">
	<div id="top" class="top drag-container">
	<div class="top-column">
	<input id="input-text" type="text"
	class="row input-icon-container search-icon" accesskey="l"
	autofocus autocomplete="off"
	placeholder="Enter omnibox input [Alt+L]">
	<div class="arrow-container">
	<span id="arrow-padding"></span>
	<span class="arrow-up">▲</span>
	</div>
	<label class="row checkbox-container"
	title="When checked, interacting with the real omnibox of any browser window will update the debug page's output. Incognito window omnibox results will update only debug pages open in incognito windows. Likewise, normal window omnibox results will update only debug pages open in normal windows. When unfocusing the browser omnibox, the autocomplete controller sends a response with no combined results. This response is ignored in order to prevent the previous non-empty response from being hidden and because these results wouldn't normally be displayed by the browser window omnibox.">
	<input id="connect-window-omnibox" type="checkbox" accesskey="w">
	<span>
	Connect <span class="accesskey">w</span>indow omnibox
	</span>
	</label>
	<div class="row response-selection-container">
	<span>Quer<span class="accesskey">y</span></span>
	<input id="response-selection" type="number" accesskey="y" value="0"
	min="0" max="0">
	<span>of <span id="responses-count">0</span></span>
	</div>
	<span id="history-warning" class="row warning-text"
	title="The output you are currently viewing is historical and may not reflect the current inputs."
	hidden>
	Viewing historical data
	</span>
	</div>

	<div class="top-column">
	<p class="row section-header">Input parameters</p>
	<label class="row checkbox-container">
	<input id="reset-autocomplete-controller" type="checkbox"
	accesskey="r">
	<span>
	<span class="accesskey">R</span>eset autocomplete controller
	</span>
	</label>
	<label class="row checkbox-container">
	<input id="lock-cursor-position" type="checkbox" accesskey="x">
	<span>
	Lock cursor position to end of input
	[<span class="accesskey">x</span>]
	</span>
	</label>
	<label class="row checkbox-container" title="Assuming it is checked:
	1) To simulate an on-focus input on NTP, choose NTP page classification and clear the input and current URL.
	2) To simulate an on-focus input elsewhere: choose 'arbitrary URL' or a 'SRP' page classification, and add a add a valid (e.g. https://www.google.com) page URL to both the input and current URL.
	3) To simulate an on-clobber input: choose 'arbitrary URL' or a 'SRP' page classification, clear the input, and add a valid page URL to the current URL.">
	<input id="zero-suggest" type="checkbox" accesskey="z">
	<span>
	<span class="accesskey">Z</span>ero suggest
	</span>
	</label>
	<label class="row checkbox-container">
	<input id="prevent-inline-autocomplete" type="checkbox"
	accesskey="a">
	<span>
	Prevent inline <span class="accesskey">a</span>utocomplete
	</span>
	</label>
	<label class="row checkbox-container">
	<input id="prefer-keyword" type="checkbox" accesskey="k">
	<span>
	In <span class="accesskey">k</span>eyword mode
	</span>
	</label>
	</div>

	<div class="top-column">
	<p class="row section-header">
	Current page c<span class="accesskey">o</span>ntext:
	</p>
	<input id="current-url" type="text" class="row" accesskey="u"
	placeholder="Enter current url (e.g. 'https://www.google.com') [Alt+U]"
	title="Mostly useful when zero-suggest is enabled, but may also affect clipboard and search providers.">
	<select id="page-classification" class="row" accesskey="o">
	<option value="0">Invalid spec</option>
	<option value="1">(OBSOLETE) new tab page</option>
	<option value="2">about:blank</option>
	<option value="3">user's home page</option>
	<option value="4" selected>arbitrary URL</option>
	<option value="6">
	search result page doing search term replacement
	</option>
	<option value="7">new tab page omnibox</option>
	<option value="8">new tab page fakebox</option>
	<option value="9">
	search result page not doing search term replacement
	</option>
	<option value="15">new tab page realbox</option>
	<option value="16">search widget (Android)</option>
	<option value="19">quick action search widget (Android)</option>
	<option value="24">lens overlay contextual searchbox</option>
	<option value="25">search side panel searchbox</option>
	<option value="26">lens side panel searchbox</option>
	</select>
	</div>

	<div class="top-column">
	<p class="row section-header">Display paramters</p>
	<label class="row checkbox-container">
	<input id="show-incomplete-results" type="checkbox" accesskey="i">
	<span>
	Show <span class="accesskey">i</span>ncomplete results
	</span>
	</label>
	<label class="row checkbox-container">
	<input id="show-details" type="checkbox" accesskey="t">
	<span>
	Show all de<span class="accesskey">t</span>ails
	</span>
	</label>
	<label class="row checkbox-container">
	<input id="show-all-providers" type="checkbox" accesskey="p">
	<span>
	Show results per <span class="accesskey">p</span>rovider
	</span>
	</label>
	<div class="column-container">
	<div class="column">
	<label class="row checkbox-container">
	<input id="elide-cells" type="checkbox" accesskey="s">
	<span>
	Elide cell<span class="accesskey">s</span>
	</span>
	</label>
	</div>
	<div class="column">
	<label class="row checkbox-container">
	<input id="thin-rows" type="checkbox" accesskey="h">
	<span>
	T<span class="accesskey">h</span>in rows
	</span>
	</label>
	</div>
	</div>
	</div>

	<div class="top-column">
	<p class="row section-header">Output controls</p>
	<input id="filter-text" type="text"
	class="row input-icon-container search-icon" accesskey="g"
	autocomplete="off"
	placeholder="Enter filter (e.g. 'google', 'is:star', 'not:del') [Alt+G]"
	title="Checks each cell individually; i.e. filter text should not span multiple columns. Supports fuzzyness; each character of filter text must be present in the cell, either adjacent to the previous matched character, or at the start of a new word. Words are defined as being delimited by either capital letters, groups of digits, or non alpha characters. E.g. 'abc' matches 'abc', 'a big cat', 'a-bigCat', 'a very big cat', and 'an amBer cat'; but does not match 'abigcat' or 'an amber cat'. 'green rainbow' is matched by 'gre rain', but not by 'gre bow'. One exception is the first character, which may be matched mid-word. E.g. 'een rain' can also match 'green rainbow'. Boolean properties can be searched for via the property name prefixed by 'is:' or 'not:'. Boolean property names are: 'Can Be Default', 'Starred', 'Has Tab Match', 'Del', 'Prev', and 'Done'.">
	<div class="column-container">
	<div class="column">
	<span id="export-clipboard" class="row button" accesskey="c"
	tabindex="0"
	title="Copy responses in JSON format. This is not affected by the visibility of output and will include responses in their entirety as well as query and display inputs.">
	<i class="icon copy-icon"></i>
	<span><span class="accesskey">C</span>opy</span>
	</span>
	<span id="export-file" class="row button" accesskey="n" tabindex="0"
	title="Download responses in JSON format. This is not affected by the visibility of output and will include responses in their entirety as well as query and display inputs.">
	<i class="icon copy-icon"></i>
	<span>Dow<span class="accesskey">n</span>load</span>
	</span>
	</div>
	<div class="column">
	<label id="import-clipboard"
	class="row icon-button button drag-container" accesskey="v"
	tabindex="0"
	title="Import JSON from clipboard. Accepts dragged text and files as well.">
	<i class="icon copy-icon"></i>
	<span>Paste [<span class="accesskey">v</span>]</span>
	</label>
	<label id="import-file"
	class="row icon-button button drag-container" accesskey="m"
	tabindex="0"
	title="Upload previously downloaded responses to load them. Accepts dragged text and files as well.">
	<input id="import-file-input" type="file" accept=".json">
	<i class="icon copy-icon"></i>
	<span>Upload [<span class="accesskey">m</span>]</span>
	</label>
	<label id="process-batch"
	class="row icon-button button drag-container" accesskey="b"
	tabindex="0"
	title="Upload a query batch specifier to download a batch export. Accepts dragged text and files as well.">
	<input id="process-batch-input" type="file" accept=".json">
	<i class="icon copy-icon"></i>
	<span>Process <span class="accesskey">b</span>atch</span>
	</label>
	</div>
	</div>
	<span id="imported-warning" class="row warning-text"
	title="The output you are currently viewing is imported and may not be the same as if you had entered these inputs now."
	hidden>
	Viewing imported data
	</span>
	</div>
	</div>
	</template>

	<template id="omnibox-output-template">
	<style>
	[hidden] {
	display: none !important;
	}

	:host {
	font-size: .75rem;
	}

	@media only screen and (min-height: 900px) {
	:host {
	flex-grow: 1;
	overflow-y: scroll;
	}
	}

	output-results-group:not(:last-child) {
	margin-bottom: 30px;
	}
	</style>
	<div id="contents"></div>
	</template>

	<template id="output-results-group-template">
	<output-results-details></output-results-details>
	<table id="table"></table>
	</template>

	<template id="output-results-details-template">
	<style>
	:host {
	background-color: white;
	border: 1px solid var(--border-color);
	display: block;
	padding: 5px;
	}

	.label {
	color: var(--header-color);
	margin-inline-end: 30px;
	}

	.label > span {
	color: var(--action-color);
	font-weight: bold;
	}
	</style>
	<span class="label">
	cursor position = <span id="cursor-position"></span>
	</span>
	<span class="label">
	elapsed time = <span><span id="time"></span>ms</span>
	</span>
	<span class="label">
	all providers done = <span id="done"></span>
	</span>
	<span class="label">type = <span id="type"></span></span>
	<span class="label">host = <span id="host"></span></span>
	<span class="label">is typed host = <span id="is-typed-host"></span></span>
	</template>

	<omnibox-input id="omnibox-input"></omnibox-input>
	<omnibox-output id="omnibox-output"></omnibox-output>
	</body>
	</html>