Start #2081, implement an A/B test of badging the Page Shot button un…

…til it is first clicked

addon/lib/ab-highlight-button-on-install.js

@@ -0,0 +1,48 @@
+const { getAbTests } = require("./user");
+const { storage } = require("sdk/simple-storage");
+const req = require("./req");
+
+const storageKey = "ab-highlight-button-on-install";
+
+const SHOW_BADGE_LIMIT = 1000 * 60 * 60 * 24; // 1 day
+
+function shouldShowBadge() {
+  let abTests = getAbTests();
+  return abTests.highlightButtonOnInstall && abTests.highlightButtonOnInstall.value == "badge";
+}
+
+exports.mainCalled = function (loadReason) {
+  console.log("mainCalled", loadReason, shouldShowBadge());
+  let timestamp, hasCreatedShot;
+  if (shouldShowBadge()) {
+    if (loadReason == "install") {
+      timestamp = storage[storageKey + "-timestamp"] = Date.now();
+      hasCreatedShot = storage[storageKey + "-has-created-shot"] = false;
+    } else if (storage[storageKey + "-timestamp"] === undefined) {
+      // Someone who is not a new user got opted in to this test
+      timestamp = 0;
+      hasCreatedShot = true;
+    } else {
+      timestamp = storage[storageKey + "-timestamp"];
+      hasCreatedShot = storage[storageKey + "-has-created-shot"];
+    }
+    refreshBadge(timestamp, hasCreatedShot);
+  }
+};
+
+exports.buttonClicked = function () {
+  if (shouldShowBadge()) {
+    storage[storageKey + "-has-created-shot"] = true;
+    refreshBadge(0, true);
+  }
+};
+
+function refreshBadge(timestamp, hasCreatedShot) {
+  console.log("refreshBadge", timestamp, hasCreatedShot);
+  if ((! hasCreatedShot) && (Date.now() - timestamp < SHOW_BADGE_LIMIT)) {
+    req.sendEvent("ab-highlight-button-shown", {ni: true});
+    require("./main").shootButton.badge = " ! ";
+  } else {
+    require("./main").shootButton.badge = "";
+  }
+}

addon/lib/main.js

@@ -55,6 +55,7 @@ exports.openMyShots = function () {
 
 
 function takeShot(source) {
+  require("./ab-highlight-button-on-install").buttonClicked();
   let backend = exports.getBackend();
   let url = tabs.activeTab.url;
   if (url.startsWith(backend)) {
@@ -145,6 +146,7 @@ exports.main = function (options) {
       });
     }
     startDailyPing();
+    require("./ab-highlight-button-on-install").mainCalled(loadReason);
   }).catch((error) => {
     console.warn("Failed to log in to server:", exports.getBackend(), error+"", error.stack);
     error.noPopup = true;

docs/METRICS.md

@@ -84,6 +84,16 @@ Event label: exactly what control invoked the action, such as toolbar-pageshot-b
 * `selection`: anything that happens during the selection phase, that doesn't happen in the topbar
 * `keyboard`: any keyboard shortcut used
 
+#### A/B tests
+
+##### Highlight shot button
+
+As described in [#2081](https://github.com/mozilla-services/pageshot/issues/2081) we are putting a badge on the button of some users.
+
+The dimension `cd3` will be `control` (no badge) or `badge` (10% of population).
+
+If the badge is shown we send the event `addon/ab-highlight-button-shown` – this is marked as a non-interactive event.
+
 #### Add-on metrics
 
 1. [x] Start the browser `addon/open-browser/launch`

server/src/ab-tests.js

@@ -1,5 +1,15 @@
 // Note: these get turned into Test objects:
-let allTests = {};
+let allTests = {
+  highlightButtonOnInstall: {
+    description: "Highlight the Page Shot button when Page Shot is installed",
+    gaField: "cd3",
+    version: 1,
+    exclude: [],
+    options: [
+      {name: "badge", probability: 0.1}
+    ]
+  }
+};
 
 /* Example of how this could be set (until we have real tests to serve as docs): */
 /*