<!doctype html>
<html>
<head>
<!--
Copyright 2019 The Chromium Authors
Use of this source code is governed by a BSD-style license that can be
found in the LICENSE file.
-->
<meta charset="utf-8">
<script type="module" src="autofill_and_password_manager_internals.js"></script>
<link rel="stylesheet" href="chrome://resources/css/chrome_shared.css">
<!--
The style sheets are inlined to get a prettier export if the user presses
Ctrl/Cmd + S to save the site or presses the download button.
-->
<style>
html {
scroll-behavior: smooth;
}
.sticky-bar {
background-color: white;
border-bottom: 1px solid black;
color: black;
overflow: auto;
padding-bottom: 1.5ex;
position: sticky;
top: 0;
}
#control-panel {
display: block;
font-size: 120%;
line-height: calc(120% + 2ex);
padding: 1ex;
}
#control-panel label {
padding-inline-end: 1em;
white-space: nowrap;
}
.fake-button {
background-color: lightgray;
border: 1px solid black;
cursor: pointer;
margin-inline-end: 1em;
padding: .5ex;
white-space: nowrap;
}
#logging-note {
font-style: italic;
}
#logging-note-incognito {
font-style: italic;
}
/* Initially, nothing is visible, to avoid flicker. */
#log-entries,
#logging-note,
#logging-note-incognito {
display: none;
}
/* Visibility settings for non-Incognito tabs. */
[data-incognito=false] #log-entries,
[data-incognito=false] #logging-note {
display: block;
}
/* Visibility settings for Incognito tabs. */
[data-incognito=true] #logging-note-incognito {
display: block;
}
#version-info {
margin: 3px;
padding: 3px;
}
.version {
font-family: monospace;
max-width: 430px;
padding-inline-start: 5px;
vertical-align: top;
word-break: break-word;
}
.label {
font-family: monospace;
font-weight: 200;
vertical-align: top;
}
.log-entry,
.marker {
padding: 3px;
}
.marker {
background-color: red;
font-size: 200%;
overflow-wrap: break-word;
white-space: normal;
word-wrap: break-word;
}
.marker::before {
content: 'Position marked: ';
}
/*
* Colors can be taken from
* https://material.io/design/color/#tools-for-picking-colors
* Pick the rows of entries labeled with 100
* Unused colors:
* - Purple #E1BEE7
* - Light Green #DCEDC8
* - Yellow #FFF9C4
* - Orange #FFE0B2
* - Blue Gray #CFD8DC
*/
.log-entry[scope='Context'] {
background-color: #F5F5F5; /* Gray */
}
.log-entry[scope='Parsing'] {
background-color: #FFECB3; /* Amber */
}
.log-entry[scope='AbortParsing'] {
background-color: #FFCDD2; /* Red */
}
.log-entry[scope='Filling'] {
background-color: #D1C4E9; /* Deep Purple */
}
.log-entry[scope='Submission'] {
background-color: #BBDEFB; /* Blue */
}
.log-entry[scope='AutofillServer'] {
background-color: #D7CCC8; /* Brown */
}
.log-entry[scope='Metrics'] {
background-color: #B2EBF2; /* Cyan */
}
.log-entry[scope='AddressProfileFormImport'] {
background-color: #C8E6C9; /* Green */
}
.log-entry[scope='CreditCardUploadStatus'] {
background-color: #B2DFDB; /* Teal */
}
.log-entry[scope='CardUploadDecision'] {
background-color: #B3E5FC; /* Light Blue */
}
.log-entry[scope='Rationalization'] {
background-color: #F8BBD0; /* Pink */
}
.log-entry[scope='WebsiteModifiedFieldValue'] {
background-color: #FFCCBC; /* Deep Orange */
}
.log-entry[scope='FastCheckout'] {
background-color: #F0F4C3; /* Lime */
}
.log-entry[scope='TouchToFill'] {
background-color: #C5CAE9; /* Indigo */
}
/*
* Checkboxes add/remove hide-<Scope> classes to the #log-entries. Hiding of the
* relevant <div>'s and adjacent <hr>'s is implemented by these classes.
*/
.hide-Context .log-entry[scope='Context'],
.hide-Context .log-entry[scope='Context'] + hr {
display: none;
}
.hide-Parsing .log-entry[scope='Parsing'],
.hide-Parsing .log-entry[scope='Parsing'] + hr {
display: none;
}
.hide-AbortParsing .log-entry[scope='AbortParsing'],
.hide-AbortParsing .log-entry[scope='AbortParsing'] + hr {
display: none;
}
.hide-Filling .log-entry[scope='Filling'],
.hide-Filling .log-entry[scope='Filling'] + hr {
display: none;
}
.hide-Submission .log-entry[scope='Submission'],
.hide-Submission .log-entry[scope='Submission'] + hr {
display: none;
}
.hide-AutofillServer .log-entry[scope='AutofillServer'],
.hide-AutofillServer .log-entry[scope='AutofillServer'] + hr {
display: none;
}
.hide-Metrics .log-entry[scope='Metrics'],
.hide-Metrics .log-entry[scope='Metrics'] + hr {
display: none;
}
.hide-AddressProfileFormImport .log-entry[scope='AddressProfileFormImport'],
.hide-AddressProfileFormImport .log-entry[scope='AddressProfileFormImport'] + hr {
display: none;
}
.hide-CreditCardUploadStatus .log-entry[scope='CreditCardUploadStatus'],
.hide-CreditCardUploadStatus .log-entry[scope='CreditCardUploadStatus'] + hr {
display: none;
}
.hide-CardUploadDecision .log-entry[scope='CardUploadDecision'],
.hide-CardUploadDecision .log-entry[scope='CardUploadDecision'] + hr {
display: none;
}
.hide-WebsiteModifiedFieldValue .log-entry[scope=WebsiteModifiedFieldValue],
.hide-WebsiteModifiedFieldValue .log-entry[scope=WebsiteModifiedFieldValue] + hr {
display: none;
}
.hide-FastCheckout .log-entry[scope=FastCheckout],
.hide-FastCheckout .log-entry[scope=FastCheckout] + hr {
display: none;
}
.preserve-white-space {
white-space: pre-wrap;
}
.form {
border: 1px black solid;
margin: 3px;
padding: 3px;
}
.form td {
vertical-align: text-top;
}
.profile_import_from_form_section {
border: 1px black solid;
margin: 3px;
padding: 3px;
}
.profile_import_from_form_section td {
vertical-align: text-top;
}
.country_data {
border: 1px black solid;
margin: 3px;
padding: 3px;
}
.country_data td {
vertical-align: text-top;
}
.modal-dialog {
background-color: rgb(255, 255, 255);
border: 1px solid rgb(0, 0, 0);
display: block;
height: 100px;
left: 10%;
overflow: auto;
position: fixed;
right: 10%;
top: 10%;
width: 80%;
z-index: 1;
}
.modal-dialog-content {
padding: 20px;
}
.modal-dialog-close-button {
bottom: 20px;
position: absolute;
right: 20px;
}
</style>
</head>
<body>
<div class="sticky-bar">
<h1 id="h1-title"></h1>
<div id="control-panel">
<span id="marker-fake-button" class="fake-button">Add Marker</span>
<label><input type="checkbox" id="enable-autoscroll" checked> Enable autoscroll</label>
<span id="checkbox-placeholder"></span>
<span id="reset-cache-fake-button" class="fake-button" style="display: none">Reset Cache</span>
<span id="download-fake-button" class="fake-button">Download Log</span>
<span id="download-submitted-forms-json-data-fake-button" class="fake-button" style="display: none">Download submitted forms JSON data</span>
<label><input type="checkbox" id="currently-recording" checked> Record new events</label>
<label><input type="checkbox" id="automatically-stop-recording" checked> Automatically stop recording in <span id="stop-recording-time">M:SS</span></label>
<label><input type="checkbox" id="display-pii-on-submission"> Display PII on submission</label>
<span id="reset-upm-eviction-fake-button" class="fake-button" style="display: none">Reset UPM eviction</span>
<span id="reset-account-storage-notice-fake-button" class="fake-button" style="display: none">Reset account storage notice</span>
</div>
</div>
<div id="logging-note"></div>
<div id="logging-note-incognito"></div>
<div id="version-info">
<table>
<tr>
<td class="label">Version:</td>
<td class="version"><span>$i18n{version}</span>
(<span>$i18n{official}</span>)
<span>$i18n{version_modifier}</span></td>
</tr>
<tr>
<td class="label">Revision:</td>
<td class="version"><span>$i18n{cl}</span></td>
</tr>
<tr>
<td class="label">User Agent:</td>
<td class="version"><span>$i18n{useragent}</span></td>
</tr>
<tr>
<td class="label">App Locale:</td>
<td class="version"><span>$i18n{app_locale}</span></td>
</tr>
<tr>
<td class="label">Variations:</td>
<td class="version" id="variations-list"></td>
</tr>
</table>
</div>
<div id="log-entries">
</div>
</body>
</html>