<style include="iron-flex cr-shared-style cr-icons action-link
shared-style">
:host {
--iron-icon-fill-color: var(--cr-secondary-text-color);
display: block;
height: 100%;
}
#enable-section {
margin-bottom: 8px;
}
#enable-section cr-tooltip-icon {
margin-inline-end: 20px;
}
#enable-section span {
color: var(--cr-secondary-text-color);
font-weight: 500;
}
#enable-section .enabled-text {
color: var(--google-blue-500);
}
@media (prefers-color-scheme: dark) {
#enable-section .enabled-text {
color: var(--google-blue-300);
}
}
#icon {
height: 24px;
margin-inline-end: 12px;
margin-inline-start: 16px;
width: 24px;
}
#name {
flex-grow: 1;
overflow: hidden;
text-overflow: ellipsis;
}
.section {
box-sizing: border-box;
padding: var(--cr-section-vertical-padding) var(--cr-section-padding);
}
.message-container {
align-items: center;
background-color: var(--google-grey-50);
display: flex;
padding: 15px;
margin-top: 2px;
}
.message-icon {
align-items: center;
align-self: flex-start;
display: flex;
height: var(--cr-icon-size);
width: var(--cr-icon-size);
fill: var(--panel-icon-color);
}
.message-container iron-icon {
height: var(--cr-icon-size);
padding: 6px;
width: var(--cr-icon-size);
}
.message-text {
flex: 1;
margin-inline-start: 15px;
}
@media (prefers-color-scheme: dark) {
.message-container {
background-color: var(--google-grey-800);
}
}
.keep-button {
margin-inline-end: 10px;
margin-inline-start: 40px;
}
.cr-row.control-line {
justify-content: space-between;
}
.section-content {
color: var(--cr-secondary-text-color);
}
.actionable {
cursor: pointer;
}
.inspectable-view {
display: inline;
height: 20px;
overflow-wrap: anywhere;
width: auto; /* override the default button size of 24x24 */
word-break: normal;
}
@media (prefers-color-scheme: light) {
.warning .action-button {
background: white;
color: var(--google-blue-500);
}
#reload-button {
color: var(--google-blue-500);
}
}
.warning span {
color: var(--error-color);
flex: 1;
}
.warning-icon {
--iron-icon-fill-color: var(--error-color);
flex-shrink: 0;
height: 18px;
margin-inline-end: 8px;
width: 18px;
}
.link-icon-button {
--iron-icon-height: var(--cr-icon-size);
--iron-icon-width: var(--cr-icon-size);
margin-inline-start: 6px;
}
#allowlist-warning {
flex: 1;
}
#allowlist-warning .warning-icon {
--iron-icon-fill-color: var(--warning-color);
}
ul {
margin: 0;
padding-inline-start: 20px;
}
#options-section .control-line:first-child {
border-top: var(--cr-separator-line);
}
extensions-toggle-row {
box-sizing: border-box;
padding: var(--cr-section-vertical-padding) var(--cr-section-padding);
}
#show-access-requests-toggle {
margin-inline-start: var(--cr-section-indent-width);
min-height: var(--cr-section-min-height);
padding: 0;
}
#access-toggle-and-link {
color: var(--cr-primary-text-color);
display: flex;
}
#load-path {
word-break: break-all;
}
#load-path > a[is='action-link'] {
display: inline;
}
#size {
align-items: center;
display: flex;
}
paper-spinner-lite {
height: var(--cr-icon-size);
width: var(--cr-icon-size);
}
#a11yAssociation {
height: 0;
overflow: hidden;
}
</style>
<!-- Invisible instead of hidden because VoiceOver refuses to read text of
element that's hidden when referenced by an aria label. Unfortunately,
this text can be found by Ctrl + F because it isn't hidden. -->
<div id="a11yAssociation" aria-hidden="true">
[[a11yAssociation(data.name)]]
</div>
<div class="page-container" id="container">
<div class="page-content">
<div class="page-header">
<cr-icon-button class="icon-arrow-back no-overlap" id="closeButton"
aria-label$="[[getBackButtonAriaLabel_(data.name)]]"
aria-roledescription$="[[
getBackButtonAriaRoleDescription_(data.name)]]"
on-click="onCloseButtonClick_">
</cr-icon-button>
<img id="icon" src="[[data.iconUrl]]" alt="">
<span id="name" class="cr-title-text" role="heading" aria-level="1">
[[data.name]]
</span>
<template is="dom-if" if="[[!computeDevReloadButtonHidden_(data.*)]]">
<cr-icon-button id="dev-reload-button" class="icon-refresh no-overlap"
title="$i18n{itemReload}" aria-label="$i18n{itemReload}"
aria-describedby="a11yAssociation" on-click="onReloadClick_">
</cr-icon-button>
</template>
</div>
<div id="safetyCheckWarningContainer" class="message-container"
hidden$="[[!showSafetyCheck_]]">
<iron-icon aria-hidden="true" icon="extensions-icons:my_extensions"
class="message-icon">
</iron-icon>
<div class="message-text">
<span class="section-title" aria-level="2">
$i18n{safetyCheckExtensionsDetailPagePrimaryLabel}
</span>
<div class="section-content">
[[data.safetyCheckText.detailString]]
</div>
</div>
<cr-button class="keep-button" on-click="onKeepClick_">
$i18n{safetyCheckExtensionsKeep}
</cr-button>
<cr-button class="action-button" on-click="onRemoveClick_">
$i18n{remove}
</cr-button>
</div>
<div id="mv2DeprecationMessage" class="message-container"
hidden$="[[!showMv2DeprecationMessage_]]">
<iron-icon aria-hidden="true" icon$="[[getMv2DeprecationMessageIcon_()]]"
class="message-icon">
</iron-icon>
<div class="message-text">
<span class="section-title" aria-level="2">
[[getMv2DeprecationMessageHeader_()]]
</span>
<div class="section-content"
inner-h-t-m-l="[[getMv2DeprecationMessageSubtitle_()]]">
</div>
</div>
<cr-button class="find-alternative-button"
on-click="onFindAlternativeButtonClick_"
hidden$="[[!showMv2DeprecationFindAlternativeButton_]]">
$i18n{mv2DeprecationPanelFindAlternativeButton}
</cr-button>
<cr-button class="remove-button"
on-click="onRemoveButtonClick_"
hidden$="[[!showMv2DeprecationRemoveButton_]]">
$i18n{mv2DeprecationMessageRemoveButton}
</cr-button>
<cr-icon-button class="icon-more-vert header-aligned-button"
id="actionMenuButton"
on-click="onActionMenuButtonClick_"
title="$i18n{moreOptions}"
aria-label="[[getActionMenuButtonLabel_()]]"
hidden$="[[!showMv2DeprecationActionMenu_]]">
</cr-icon-button>
<cr-action-menu id="actionMenu">
<button class="dropdown-item" id="findAlternativeAction"
hidden="[[!data.recommendationsUrl]]"
on-click="onFindAlternativeActionClick_">
$i18n{mv2DeprecationPanelFindAlternativeButton}
</button>
<button class="dropdown-item" id="keepAction"
on-click="onKeepActionClick_">
$i18n{mv2DeprecationPanelKeepForNowButton}
</button>
</cr-action-menu>
</div>
<div class="cr-row first control-line" id="enable-section">
<span class$="[[computeEnabledStyle_(data.state)]]">
[[computeEnabledText_(data.state, '$i18nPolymer{itemOn}',
'$i18nPolymer{itemOff}')]]
</span>
<div class="layout horizontal">
<cr-tooltip-icon hidden$="[[!data.controlledInfo]]"
tooltip-text="[[data.controlledInfo.text]]"
icon-class="cr20:domain"
icon-aria-label="[[data.controlledInfo.text]]">
</cr-tooltip-icon>
<template is="dom-if" if="[[showReloadButton_(data.state)]]">
<cr-button id="terminated-reload-button" class="action-button"
on-click="onReloadClick_">
$i18n{itemReload}
</cr-button>
</template>
<cr-tooltip-icon id="parentDisabledPermissionsToolTip"
hidden$="[[!data.disableReasons.parentDisabledPermissions]]"
tooltip-text="$i18n{parentDisabledPermissions}"
icon-class="cr20:kite"
icon-aria-label="$i18n{parentDisabledPermissions}">
</cr-tooltip-icon>
<cr-toggle id="enableToggle"
aria-label$="[[getEnableToggleAriaLabel_(data.*)]]"
aria-describedby="name enable-toggle-tooltip"
checked="[[isEnabled_(data.state)]]"
on-change="onEnableToggleChange_"
disabled$="[[!isEnableToggleEnabled_(data.*)]]"
hidden$="[[!showEnableToggle_(data.*)]]">
</cr-toggle>
<cr-tooltip id="enable-toggle-tooltip" for="enableToggle"
position="left" aria-hidden="true" animation-delay="0"
fit-to-visible-bounds>
[[getEnableToggleTooltipText_(data.*)]]
</cr-tooltip>
</div>
</div>
<div id="warnings" hidden$="[[!hasSevereWarnings_(data.*)]]">
<div id="runtime-warnings" hidden$="[[!data.runtimeWarnings.length]]"
class="cr-row continuation warning control-line">
<iron-icon class="warning-icon" icon="cr:error"></iron-icon>
<span>
<template is="dom-repeat" items="[[data.runtimeWarnings]]">
[[item]]
</template>
</span>
<template is="dom-if" if="[[!showReloadButton_(data.state)]]">
<cr-button id="warnings-reload-button" class="action-button"
on-click="onReloadClick_">
$i18n{itemReload}
</cr-button>
</template>
</div>
<div class="cr-row continuation warning" id="suspicious-warning"
hidden$="[[!data.disableReasons.suspiciousInstall]]">
<iron-icon class="warning-icon" icon="cr:warning"></iron-icon>
<span>
$i18n{itemSuspiciousInstall}
<a target="_blank" href="$i18n{suspiciousInstallHelpUrl}"
aria-label="$i18n{itemSuspiciousInstallLearnMore}">
$i18n{learnMore}
</a>
</span>
</div>
<div class="cr-row continuation warning control-line"
id="corrupted-warning"
hidden$="[[!showRepairButton_(data.disableReasons.corruptInstall)]]">
<iron-icon class="warning-icon" icon="cr:warning"></iron-icon>
<span>$i18n{itemCorruptInstall}</span>
<cr-button id="repair-button" class="action-button"
on-click="onRepairClick_">
$i18n{itemRepair}
</cr-button>
</div>
<div class="cr-row continuation warning" id="blocklisted-warning"
hidden$="[[!showBlocklistText_]]">
<iron-icon class="warning-icon" icon="cr:warning"></iron-icon>
<span>[[data.blocklistText]]</span>
</div>
<div class="cr-row continuation warning" id="update-required-warning"
hidden$="[[!data.disableReasons.updateRequired]]">
<iron-icon class="warning-icon" icon="cr:warning"></iron-icon>
<span>$i18n{updateRequiredByPolicy}</span>
</div>
<div class="cr-row continuation warning"
id="published-in-store-required-warning"
hidden$="[[!data.disableReasons.publishedInStoreRequired]]">
<iron-icon class="warning-icon" icon="cr:warning"></iron-icon>
<span>$i18n{publishedInStoreRequiredByPolicy}</span>
</div>
</div>
<div id="allowlist-warning" class="cr-row continuation"
hidden$="[[!showAllowlistWarning_(data.*)]]">
<iron-icon class="warning-icon"
icon="extensions-icons:safebrowsing_warning">
</iron-icon>
<span class="cr-secondary-text">
$i18n{itemAllowlistWarning}
<a href="$i18n{enhancedSafeBrowsingWarningHelpUrl}" target="_blank"
aria-label="$i18n{itemAllowlistWarningLearnMoreLabel}">
$i18n{learnMore}
</a>
</span>
</div>
<div class="section">
<div class="section-title" role="heading" aria-level="2">
$i18n{itemDescriptionLabel}
</div>
<div class="section-content" id="description">
[[getDescription_(data.description, '$i18nPolymer{noDescription}')]]
</div>
</div>
<div class="section hr">
<div class="section-title" role="heading" aria-level="2">
$i18n{itemVersion}
</div>
<div class="section-content">[[data.version]]</div>
</div>
<div class="section hr">
<div class="section-title" role="heading" aria-level="2">
$i18n{itemSize}
</div>
<div class="section-content" id="size">
<span>[[size_]]</span>
<paper-spinner-lite active="[[!size_]]" hidden="[[size_]]">
</paper-spinner-lite>
</div>
</div>
<div class="section hr" id="id-section" hidden$="[[!inDevMode]]">
<div class="section-title" role="heading" aria-level="2">
$i18n{itemIdHeading}
</div>
<div class="section-content">[[data.id]]</div>
</div>
<template is="dom-if" if="[[inDevMode]]">
<div class="section hr" id="inspectable-views">
<div class="section-title" role="heading" aria-level="2">
$i18n{itemInspectViews}
</div>
<div class="section-content">
<ul id="inspect-views">
<li hidden="[[data.views.length]]">
$i18n{noActiveViews}
</li>
<template is="dom-repeat" items="[[sortedViews_]]">
<li>
<a is="action-link" class="inspectable-view"
on-click="onInspectClick_">
[[computeInspectLabel_(item)]]
</a>
</li>
</template>
</ul>
</div>
</div>
</template>
<div class="section hr">
<div class="section-title" role="heading" aria-level="2">
$i18n{itemPermissions}
</div>
<div class="section-content">
<span id="no-permissions" hidden$="[[hasPermissions_(data.*)]]">
[[getNoPermissionsString_(data.*, enableEnhancedSiteControls)]]
</span>
<ul id="permissions-list"
hidden$="[[!data.permissions.simplePermissions.length]]">
<template is="dom-repeat"
items="[[data.permissions.simplePermissions]]">
<li>
[[item.message]]
<ul hidden="[[!item.submessages.length]]">
<template is="dom-repeat" items="[[item.submessages]]">
<li>[[item]]</li>
</template>
</ul>
</li>
</template>
<li hidden$="[[showSiteAccessSection_(data.*,
enableEnhancedSiteControls)]]">
$i18n{itemSiteAccessEmpty}
</li>
</ul>
</div>
</div>
<template is="dom-if" if="[[showSiteAccessSection_(data.*,
enableEnhancedSiteControls)]]">
<div class="section hr">
<div class="section-title" role="heading" aria-level="2"
hidden$="[[enableEnhancedSiteControls]]">
$i18n{itemSiteAccess}
</div>
<div class="section-content">
<span id="no-site-access"
hidden$="[[showSiteAccessContent_(data.*)]]">
$i18n{itemSiteAccessEmpty}
</span>
<template is="dom-if"
if="[[showFreeformRuntimeHostPermissions_(data.*)]]">
<extensions-runtime-host-permissions
permissions="[[data.permissions.runtimeHostPermissions]]"
enable-enhanced-site-controls="[[enableEnhancedSiteControls]]"
delegate="[[delegate]]"
item-id="[[data.id]]">
</extensions-runtime-host-permissions>
</template>
<template is="dom-if"
if="[[showHostPermissionsToggleList_(data.*)]]">
<extensions-host-permissions-toggle-list
permissions="[[data.permissions.runtimeHostPermissions]]"
enable-enhanced-site-controls="[[enableEnhancedSiteControls]]"
delegate="[[delegate]]"
item-id="[[data.id]]">
</extensions-host-permissions-toggle-list>
</template>
<template is="dom-if" if="[[showEnableAccessRequestsToggle_(
data.*, enableEnhancedSiteControls)]]">
<extensions-toggle-row id="show-access-requests-toggle"
checked="[[data.showAccessRequestsInToolbar]]"
class="hr"
on-change="onShowAccessRequestsChange_">
<div id="access-toggle-and-link">
<span>$i18n{itemShowAccessRequestsInToolbar}</span>
<a class="link-icon-button"
aria-label="$i18n{itemShowAccessRequestsLearnMore}"
href="$i18n{showAccessRequestsInToolbarLearnMoreLink}"
target="_blank">
<iron-icon icon="cr:help-outline"></iron-icon>
</a>
</div>
</extensions-toggle-row>
</template>
</div>
</div>
</template>
<template is="dom-if"
if="[[hasDependentExtensions_(data.dependentExtensions.splices)]]">
<div class="section hr">
<div class="section-title" role="heading" aria-level="2">
$i18n{itemDependencies}
</div>
<div class="section-content">
<ul id="dependent-extensions-list">
<template is="dom-repeat" items="[[data.dependentExtensions]]">
<li>[[computeDependentEntry_(item)]]</li>
</template>
</ul>
</div>
</div>
</template>
<cr-link-row class="hr"
<if expr="chromeos_ash">
hidden$="[[isLacrosEnabled_]]"
</if>
id="siteSettings" label="$i18n{siteSettings}"
on-click="onSiteSettingsClick_" external
></cr-link-row>
<template is="dom-if" if="[[shouldShowOptionsSection_(data.*)]]">
<div id="options-section">
<template is="dom-if" if="[[canPinToToolbar_(data.pinnedToToolbar)]]">
<extensions-toggle-row id="pin-to-toolbar"
checked="[[data.pinnedToToolbar]]"
class="hr"
on-change="onPinnedToToolbarChange_">
<span>$i18n{itemPinToToolbar}</span>
</extensions-toggle-row>
</template>
<template is="dom-if"
if="[[shouldShowIncognitoOption_(
data.incognitoAccess.isEnabled, incognitoAvailable)]]">
<extensions-toggle-row id="allow-incognito"
checked="[[data.incognitoAccess.isActive]]"
class="hr"
on-change="onAllowIncognitoChange_">
<div>
<div>$i18n{itemAllowIncognito}</div>
<div class="section-content">$i18n{incognitoInfoWarning}</div>
</div>
</extensions-toggle-row>
</template>
<template is="dom-if" if="[[data.fileAccess.isEnabled]]">
<extensions-toggle-row id="allow-on-file-urls"
checked="[[data.fileAccess.isActive]]"
class="hr"
on-change="onAllowOnFileUrlsChange_">
<span>$i18n{itemAllowOnFileUrls}</span>
</extensions-toggle-row>
</template>
<template is="dom-if" if="[[data.errorCollection.isEnabled]]">
<extensions-toggle-row id="collect-errors"
checked="[[data.errorCollection.isActive]]"
class="hr"
on-change="onCollectErrorsChange_">
<span>$i18n{itemCollectErrors}</span>
</extensions-toggle-row>
</template>
</div>
</template>
<cr-link-row class="hr" id="extensionsOptions"
disabled="[[!isEnabled_(data.state)]]"
hidden="[[!shouldShowOptionsLink_(data.*)]]"
label="$i18n{itemOptions}" on-click="onExtensionOptionsClick_"
external></cr-link-row>
<cr-link-row class="hr"
id="extensionsActivityLogLink" hidden$="[[!showActivityLog]]"
label="$i18n{viewActivityLog}" on-click="onActivityLogClick_"
role-description="$i18n{subpageArrowRoleDescription}">
</cr-link-row>
<cr-link-row class="hr" hidden="[[!data.manifestHomePageUrl.length]]"
id="extensionWebsite" label="$i18n{extensionWebsite}"
on-click="onExtensionWebSiteClick_" external></cr-link-row>
<cr-link-row class="hr" hidden="[[!data.webStoreUrl.length]]"
id="viewInStore" label="$i18n{viewInStore}"
on-click="onViewInStoreClick_" external></cr-link-row>
<div class="section hr">
<div class="section-title" role="heading" aria-level="2">
$i18n{itemSource}
</div>
<div id="source" class="section-content">
[[computeSourceString_(data.*)]]
</div>
<div id="load-path" class="section-content"
hidden$="[[!data.prettifiedPath]]">
<span>$i18n{itemExtensionPath}</span>
<a is="action-link" on-click="onLoadPathClick_">
[[data.prettifiedPath]]
</a>
</div>
</div>
<cr-link-row class="hr" id="remove-extension"
hidden="[[data.mustRemainInstalled]]"
label="$i18n{itemRemoveExtension}" on-click="onRemoveClick_">
</cr-link-row>
</div>
</div>
Codebase Browser
chromium