Backed out changeset c2a7f1a6f481 (bug 1842913) as requested by dev for eventually failing the linter. CLOSED TREE

browser/app/profile/firefox.js

@@ -716,12 +716,9 @@ pref("browser.search.serpEventTelemetry.enabled", false);
 // rolled out. There will be separate controls for user opt-in/opt-out.
 pref("browser.shopping.experience2023.enabled", false);
 
-// Ternary int-valued pref indicating if the user has opted into the new
-// experimental shopping feature.
-// 0 means the user has not opted in or out.
-// 1 means the user has opted in.
-// 2 means the user has opted out.
-pref("browser.shopping.experience2023.optedIn", 0);
+// True if the user opted into the new experimental shopping feature.
+// By default, users are opted out.
+pref("browser.shopping.experience2023.optedIn", false);
 
 // Enables the display of the Mozilla VPN banner in private browsing windows
 pref("browser.privatebrowsing.vpnpromourl", "https://vpn.mozilla.org/?utm_source=firefox-browser&utm_medium=firefox-%CHANNEL%-browser&utm_campaign=private-browsing-vpn-link");

browser/base/content/browser.js

@@ -9957,6 +9957,10 @@ var ShoppingSidebarManager = {
     }
   },
 
+  _isProductPage(locationURI) {
+    return isProductURL(locationURI);
+  },
+
   /**
    * Called by TabsProgressListener whenever any browser navigates from one
    * URL to another.
@@ -9976,7 +9980,7 @@ var ShoppingSidebarManager = {
         sidebar.querySelector("browser").browsingContext.currentWindowGlobal;
       actor = global.getExistingActor("ShoppingSidebar");
     }
-    if (isProductURL(aLocationURI)) {
+    if (this._isProductPage(aLocationURI)) {
       if (!sidebar) {
         sidebar = document.createXULElement("shopping-sidebar");
         sidebar.setAttribute("style", "width: 320px");

browser/components/shopping/ShoppingSidebarChild.sys.mjs

@@ -2,25 +2,16 @@
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
-import { XPCOMUtils } from "resource://gre/modules/XPCOMUtils.sys.mjs";
-
 export class ShoppingSidebarChild extends JSWindowActorChild {
-  constructor() {
-    super();
-
-    XPCOMUtils.defineLazyPreferenceGetter(
-      this,
-      "optedIn",
-      "browser.shopping.experience2023.optedIn",
-      null,
-      () => this.updateContent()
-    );
+  async initContent() {
+    let url = await this.sendQuery("GetProductURL");
+    this.updateProductURL(url);
   }
 
   receiveMessage(message) {
     switch (message.name) {
       case "ShoppingSidebar:UpdateProductURL":
-        this.updateContent();
+        this.updateProductURL(message.data.url);
         break;
     }
   }
@@ -28,15 +19,13 @@ export class ShoppingSidebarChild extends JSWindowActorChild {
   handleEvent(event) {
     switch (event.type) {
       case "ContentReady":
-        this.updateContent();
+        this.initContent();
         break;
     }
   }
 
-  async updateContent() {
-    let url = await this.sendQuery("GetProductURL");
-    this.sendToContent("Update", {
-      optedIn: this.optedIn,
+  updateProductURL(url) {
+    this.sendToContent("UpdateProductURL", {
       url,
     });
   }

browser/components/shopping/ShoppingSidebarParent.sys.mjs

@@ -3,8 +3,11 @@
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 export class ShoppingSidebarParent extends JSWindowActorParent {
-  updateProductURL() {
-    this.sendAsyncMessage("ShoppingSidebar:UpdateProductURL");
+  updateProductURL(aURI) {
+    let url = aURI?.spec || null;
+    this.sendAsyncMessage("ShoppingSidebar:UpdateProductURL", {
+      url,
+    });
   }
 
   async receiveMessage(message) {

browser/components/shopping/content/shopping-container.mjs

@@ -20,12 +20,10 @@ import "chrome://browser/content/shopping/analysis-explainer.mjs";
 import "chrome://browser/content/shopping/shopping-message-bar.mjs";
 
 export class ShoppingContainer extends MozLitElement {
-  #optedIn;
-  #product;
+  #productURL;
 
   static properties = {
     data: { type: Object },
-    showOnboarding: { type: Boolean },
   };
 
   static get queries() {
@@ -44,7 +42,7 @@ export class ShoppingContainer extends MozLitElement {
     }
     this.initialized = true;
 
-    window.document.addEventListener("Update", this);
+    window.document.addEventListener("UpdateProductURL", this);
 
     window.dispatchEvent(
       new CustomEvent("ContentReady", {
@@ -54,44 +52,46 @@ export class ShoppingContainer extends MozLitElement {
     );
   }
 
-  async _update({ url, optedIn }) {
-    this.#product?.uninit();
-    this.#optedIn = optedIn;
+  set productURL(newURL) {
+    this.#productURL = newURL;
+    this.data = null;
+  }
 
-    if (this.#optedIn !== 1) {
-      this.showOnboarding = true;
-      // In case the user just opted out, clear out any product data too.
-      this.data = null;
-      return;
-    }
-    this.showOnboarding = false;
+  get productURL() {
+    return this.#productURL;
+  }
 
-    // `url` is null for non-product pages; clear out any sidebar content while
-    // the chrome code closes the sidebar.
-    if (!url) {
-      this.data = null;
-      return;
+  init() {
+    if (!this.productURL) {
+      // TODO: cancel fetches? disconnect components?
+    } else if (!this.data) {
+      this.fetchAnalysis();
     }
-
-    let product = (this.#product = new ShoppingProduct(new URL(url)));
-    let data = await product.requestAnalysis();
-    // Double-check that we haven't opted out or re-entered this function
-    // while we were `await`-ing.
-    if (this.#optedIn !== 1 || product !== this.#product) {
-      return;
-    }
-    this.data = data;
   }
 
   handleEvent(event) {
     switch (event.type) {
-      case "Update":
-        this._update(event.detail);
+      case "UpdateProductURL":
+        // Ignore duplicate events sometimes fired by product pages.
+        if (this.productURL === event.detail.url) {
+          return;
+        }
+        this.productURL = event.detail.url;
+        this.init();
         break;
     }
   }
 
-  renderContainer(sidebarContent) {
+  async fetchAnalysis() {
+    let product = new ShoppingProduct(new URL(this.productURL));
+    this.data = await product.requestAnalysis();
+  }
+
+  render() {
+    if (!this.data) {
+      return html`<p>loading...</p>`;
+    }
+
     return html`<link
         rel="stylesheet"
         href="chrome://browser/content/shopping/shopping-container.css"
@@ -115,35 +115,22 @@ export class ShoppingContainer extends MozLitElement {
             data-l10n-id="shopping-close-button"
           ></button>
         </div>
-        <div id="content">${sidebarContent}</div>
+        <div id="content">
+          ${this.data.needs_analysis && this.data.product_id
+            ? html`<shopping-message-bar type="stale"></shopping-message-bar>`
+            : null}
+          <review-reliability letter=${this.data.grade}></review-reliability>
+          <adjusted-rating
+            rating=${this.data.adjusted_rating}
+          ></adjusted-rating>
+          <review-highlights
+            .highlights=${this.data.highlights}
+          ></review-highlights>
+          <analysis-explainer></analysis-explainer>
+          <shopping-settings></shopping-settings>
+        </div>
       </div>`;
   }
-
-  render() {
-    let content;
-    if (this.showOnboarding) {
-      // For the onboarding case, leave content area blank, so the OMC onboarding
-      // card has room to draw itself via react (bug 1839764).
-      content = html`<p>Onboarding UI goes here</p>`;
-    } else if (!this.data) {
-      // TODO: Replace with loading UI component (bug 1840161).
-      content = html`<p>Loading UI goes here</p>`;
-    } else {
-      content = html`
-        ${this.data.needs_analysis && this.data.product_id
-          ? html`<shopping-message-bar type="stale"></shopping-message-bar>`
-          : null}
-        <review-reliability letter=${this.data.grade}></review-reliability>
-        <adjusted-rating rating=${this.data.adjusted_rating}></adjusted-rating>
-        <review-highlights
-          .highlights=${this.data.highlights}
-        ></review-highlights>
-        <analysis-explainer></analysis-explainer>
-        <shopping-settings></shopping-settings>
-      `;
-    }
-    return this.renderContainer(content);
-  }
 }
 
 customElements.define("shopping-container", ShoppingContainer);