Merge pull request #153 from duckduckgo/04-30-default_upgraded_reques…

…ts_to_secure

default upgraded requests to secure

build/app/public/js/base.js

@@ -24414,7 +24414,6 @@
     this.isAllowlisted = false;
     this.isDenylisted = false;
     this.httpsState = "none";
-    this.httpsStatusText = "";
     this.trackersCount = 0;
     this.majorTrackerNetworksCount = 0;
     this.totalTrackerNetworksCount = 0;
@@ -24432,7 +24431,6 @@
       "use strict";
       import_jquery16 = __toESM(require_jquery());
       init_model();
-      init_constants2();
       init_communication();
       init_localize();
       init_platform_features();
@@ -24514,7 +24512,6 @@
             return "none";
           })();
           this.httpsState = nextState;
-          this.httpsStatusText = i18n.t(httpsMessages[this.httpsState]);
         },
         timeout: null,
         /** @this {{tab: import('../../browser/utils/request-details.mjs').TabData} & Record<string, any>} */
@@ -24868,10 +24865,10 @@
   }
   function renderConnection(model, cb) {
     let icon = "icon-small--insecure";
-    if (model.httpsState === "secure") {
-      icon = "icon-small--secure";
-    }
-    if (model.httpsState === "upgraded" && /^https/.exec(model.tab.url) && Array.isArray(model.tab.certificate) && model.tab.certificate.length > 0) {
+    let text = i18n.t(httpsMessages[model.httpsState]);
+    let isSecure = model.httpsState === "secure";
+    let isUpgraded = model.httpsState === "upgraded" && /^https/.exec(model.tab.url);
+    if (isSecure || isUpgraded) {
       icon = "icon-small--secure";
     }
     return import_nanohtml14.default` <a
@@ -24883,7 +24880,7 @@
         onclick=${cb}
     >
         <span class="main-nav__icon ${icon}"></span>
-        <span class="main-nav__text">${model.httpsStatusText}</span>
+        <span class="main-nav__text">${text}</span>
         <span class="main-nav__chev"></span>
     </a>`;
   }
@@ -24931,6 +24928,7 @@
       init_communication();
       init_environment_check();
       init_utils();
+      init_constants2();
       MainNavView.prototype = import_jquery18.default.extend({}, view_default.prototype, {
         /**
          * @this {MainNavView}

integration-tests/windows.spec-int.js

@@ -30,6 +30,13 @@ test('windows is excluded from invalid/missing certificate', async ({ page }) =>
     await dash.screenshot('invalid-cert.png')
 })
 
+test('upgraded requests without certs always show as secure', async ({ page }) => {
+    /** @type {DashboardPage} */
+    const dash = await DashboardPage.windows(page)
+    await dash.addState([testDataStates['upgraded+secure+without-certs']])
+    await dash.screenshot('upgraded-missing-certs.png')
+})
+
 test.describe('setting the height', () => {
     test('should send the initial height to native', async ({ page }) => {
         const dash = await DashboardPage.windows(page)

shared/js/ui/models/site.js

@@ -1,6 +1,5 @@
 import $ from 'jquery'
 import Parent from '../base/model.js'
-import { httpsMessages } from '../../../data/constants'
 import browserUIWrapper, { platform } from '../../browser/communication.js'
 import { i18n } from '../base/localize.js'
 import { createPlatformFeatures, FeatureSettings } from '../platform-features.mjs'
@@ -24,7 +23,6 @@ function Site(attrs) {
     this.isAllowlisted = false
     this.isDenylisted = false
     this.httpsState = 'none'
-    this.httpsStatusText = ''
     this.trackersCount = 0 // unique trackers count
     this.majorTrackerNetworksCount = 0
     this.totalTrackerNetworksCount = 0
@@ -42,7 +40,6 @@ function Site(attrs) {
  * @typedef PublicSiteModel
  * @property {boolean} protectionsEnabled
  * @property {'secure' | 'upgraded' | 'none' | 'invalid'} httpsState
- * @property {string} httpsStatusText
  * @property {boolean} isBroken
  * @property {boolean} isAllowlisted
  * @property {boolean} isDenylisted
@@ -152,8 +149,6 @@ Site.prototype = $.extend({}, Parent.prototype, {
         })()
 
         this.httpsState = nextState
-
-        this.httpsStatusText = i18n.t(httpsMessages[this.httpsState])
     },
     timeout: null,
     /** @this {{tab: import('../../browser/utils/request-details.mjs').TabData} & Record<string, any>} */

shared/js/ui/views/main-nav.js

@@ -8,6 +8,7 @@ import { createPlatformFeatures } from '../platform-features.mjs'
 import { platform } from '../../browser/communication.js'
 import { isAndroid } from '../environment-check'
 import { setupMaterialDesignRipple } from './utils/utils'
+import { httpsMessages } from '../../../data/constants'
 
 /**
  * @param {object} ops
@@ -163,16 +164,11 @@ function renderCookieConsentManaged(model, cb) {
  */
 function renderConnection(model, cb) {
     let icon = 'icon-small--insecure'
-    if (model.httpsState === 'secure') {
-        icon = 'icon-small--secure'
-    }
-    // sometimes we're 'upgraded', but still are secure with a certificate - if so, make it a green tick
-    if (
-        model.httpsState === 'upgraded' &&
-        /^https/.exec(model.tab.url) &&
-        Array.isArray(model.tab.certificate) &&
-        model.tab.certificate.length > 0
-    ) {
+    let text = i18n.t(httpsMessages[model.httpsState])
+    let isSecure = model.httpsState === 'secure'
+    let isUpgraded = model.httpsState === 'upgraded' && /^https/.exec(model.tab.url)
+
+    if (isSecure || isUpgraded) {
         icon = 'icon-small--secure'
     }
 
@@ -185,7 +181,7 @@ function renderConnection(model, cb) {
         onclick=${cb}
     >
         <span class="main-nav__icon ${icon}"></span>
-        <span class="main-nav__text">${model.httpsStatusText}</span>
+        <span class="main-nav__text">${text}</span>
         <span class="main-nav__chev"></span>
     </a>`
 }

shared/js/ui/views/tests/generate-data.mjs

@@ -531,6 +531,12 @@ export const createDataStates = (google, cnn) => {
             upgradedHttps: true,
             certificate: defaultCertificates,
         }),
+        'upgraded+secure+without-certs': new MockData({
+            requests: [],
+            url: 'https://example.com',
+            upgradedHttps: true,
+            certificate: [],
+        }),
         cnn: new MockData({
             url: 'https://edition.cnn.com',
             requests: cnn.requests,