diff --git a/components/neterror/resources/neterror.html b/components/neterror/resources/neterror.html
index 345bb3984b775..bc012e1be87a7 100644
--- a/components/neterror/resources/neterror.html
+++ b/components/neterror/resources/neterror.html
@@ -18,11 +18,10 @@
<script src="error_page_controller_ios.js"></script>
</if>
</head>
-<body id="t" style="font-family: $i18n{fontfamily}; font-size: $i18n{fontsize}">
+<body id="t" class="neterror" style="font-family: $i18n{fontfamily}; font-size: $i18n{fontsize}">
<div id="main-frame-error" class="interstitial-wrapper">
<div id="main-content">
- <div class="icon"
- jseval="updateIconClass(this.classList, iconClass)" alt=""></div>
+ <div class="icon"></div>
<div id="main-message">
<h1>
<span jsselect="heading" jsvalues=".innerHTML:msg"></span>
@@ -128,8 +127,7 @@
<div id="sub-frame-error">
<!-- Show details when hovering over the icon, in case the details are
hidden because they're too large. -->
- <div class="icon"
- jseval="updateIconClass(this.classList, iconClass)"></div>
+ <div class="icon"></div>
<div id="sub-frame-error-details" jsselect="summary" jsvalues=".innerHTML:msg"></div>
</div>
diff --git a/components/neterror/resources/neterror.js b/components/neterror/resources/neterror.js
index 5f3858a3c4267..b85f42db7a265 100644
--- a/components/neterror/resources/neterror.js
+++ b/components/neterror/resources/neterror.js
@@ -65,8 +65,10 @@ function diagnoseErrors() {
// easier to support platforms that load the error page via different
// mechanisms (Currently just iOS). We also use the subframe style for portals
// as they are embedded like subframes and can't be interacted with by the user.
+let isSubFrame = false;
if (window.top.location !== window.location || window.portalHost) {
document.documentElement.setAttribute('subframe', '');
+ isSubFrame = true;
}
// Re-renders the error page using |strings| as the dictionary of values.
@@ -77,38 +79,20 @@ function updateForDnsProbe(strings) {
onDocumentLoadOrUpdate();
}
-// Given the classList property of an element, adds an icon class to the list
-// and removes the icon class previously set with this method. Previous value
-// stored in 'last_icon_class' property of passed classList for future reference.
-// Initializes Dino Runner instance in case 'icon-offline' class was set.
-function updateIconClass(classList, newClass) {
- let oldClass;
+// Adds an icon class to the list and removes classes previously set.
+function updateIconClass(newClass) {
+ const frameSelector = isSubFrame ? '#sub-frame-error' : '#main-frame-error';
+ const iconEl = document.querySelector(frameSelector + ' .icon');
- if (classList.hasOwnProperty('last_icon_class')) {
- oldClass = classList['last_icon_class'];
- if (oldClass === newClass) {
- return;
- }
+ if (iconEl.classList.contains(newClass)) {
+ return;
}
- classList.add(newClass);
- if (oldClass !== undefined) {
- classList.remove(oldClass);
- }
-
- classList['last_icon_class'] = newClass;
-
- if (newClass === 'icon-offline') {
- document.firstElementChild.classList.add('offline');
- new Runner('.interstitial-wrapper');
- } else {
- document.body.classList.add('neterror');
- }
+ iconEl.className = 'icon ' + newClass;
}
// Implements button clicks. This function is needed during the transition
-// between implementing these in trunk chromium and implementing them in
-// iOS.
+// between implementing these in trunk chromium and implementing them in iOS.
function reloadButtonClick(url) {
if (window.errorPageController) {
errorPageController.reloadButtonClick();
@@ -359,6 +343,16 @@ function onDocumentLoadOrUpdate() {
const controlButtonDiv = document.getElementById('control-buttons');
controlButtonDiv.hidden =
offlineContentVisible || !(reloadButtonVisible || downloadButtonVisible);
+
+ const iconClass = loadTimeData.valueExists('iconClass') &&
+ loadTimeData.getValue('iconClass');
+
+ updateIconClass(iconClass);
+
+ if (!isSubFrame && iconClass === 'icon-offline') {
+ document.documentElement.classList.add('offline');
+ new Runner('.interstitial-wrapper');
+ }
}
function onDocumentLoad() {
diff --git a/components/security_interstitials/core/common/resources/interstitial_common.css b/components/security_interstitials/core/common/resources/interstitial_common.css
index 4e8948c24f03d..8137dbe26d49d 100644
--- a/components/security_interstitials/core/common/resources/interstitial_common.css
+++ b/components/security_interstitials/core/common/resources/interstitial_common.css
@@ -26,7 +26,6 @@ button {
.lookalike-url button,
.main-frame-blocked button,
.neterror button,
-.offline button,
.pdf button,
.ssl button,
.safe-browsing-billing button {