Merge pull request #7638 from artsy/staging

Deploy: launch AB test

src/desktop/components/split_test/running_tests.coffee

@@ -26,4 +26,12 @@
 # this should export empty Object
 # module.exports = {}
 
-module.exports = {}
+module.exports = {
+  decayed_merch_v3:
+    key: "decayed_merch_v3"
+    outcomes: [
+      'control'
+      'experiment'
+    ]
+    weighting: 'equal'
+}

src/desktop/components/split_test/splitTestMiddleware.ts

@@ -1,5 +1,6 @@
 import { NextFunction } from "express"
 import { ArtsyRequest, ArtsyResponse } from "lib/middleware/artsyExpress"
+import { updateSharifyAndContext } from "lib/middleware/bootstrapSharifyAndContextLocalsMiddleware"
 import qs from "qs"
 const runningTests = require("./running_tests.coffee")
 const SplitTest = require("./server_split_test.coffee")
@@ -14,7 +15,9 @@ export function splitTestMiddleware(
     const name = key.toUpperCase()
     if (!res.locals.sd[name]) {
       const test = new SplitTest(req, res, configuration)
-      res.locals.sd[name] = test.outcome()
+      const outcome = test.outcome()
+
+      updateSharifyAndContext(res, name, outcome)
     }
   }
 
@@ -26,7 +29,8 @@ export function splitTestMiddleware(
       const test = new SplitTest(req, res, runningTests[key])
       const value = params[key]
       test.set(value)
-      res.locals.sd[key.toUpperCase()] = value
+
+      updateSharifyAndContext(res, key.toUpperCase(), value)
     }
   }
 

src/desktop/config.coffee

@@ -75,7 +75,6 @@ module.exports =
   MOBILE_MEDIA_QUERY: "only screen and (max-width: 640px)"
   NODE_ENV: 'development'
   OPENREDIS_URL: null
-  PAGE_CACHE_ENABLED: false
   PAGE_CACHE_TYPES: 'artist'
   PAGE_CACHE_NAMESPACE: 'page-cache'
   PAGE_CACHE_VERSION: '1'

src/lib/middleware/bootstrapSharifyAndContextLocalsMiddleware.ts

@@ -79,7 +79,7 @@ export function bootstrapSharifyAndContextLocalsMiddleware(
  * Updates both the sharify locals for template injection along with the context
  * globals for the request.
  */
-function updateSharifyAndContext(res, key, value) {
+export function updateSharifyAndContext(res, key, value) {
   res.locals.sd[key] = value
   const asyncLocalStorage = getAsyncLocalStorage()
   asyncLocalStorage.getStore()?.set(key, value)

src/middleware.ts

@@ -38,7 +38,6 @@ import { escapedFragmentMiddleware } from "./lib/middleware/escapedFragment"
 import { hardcodedRedirectsMiddleware } from "./lib/middleware/hardcodedRedirects"
 import { localsMiddleware } from "./lib/middleware/locals"
 import { marketingModalsMiddleware } from "./lib/middleware/marketingModals"
-import { pageCacheMiddleware } from "./lib/middleware/pageCache"
 import { proxyReflectionMiddleware } from "./lib/middleware/proxyReflection"
 import { sameOriginMiddleware } from "./lib/middleware/sameOrigin"
 import { unsupportedBrowserMiddleware } from "./lib/middleware/unsupportedBrowser"
@@ -110,7 +109,6 @@ export function initializeMiddleware(app) {
   app.use(sameOriginMiddleware)
   app.use(escapedFragmentMiddleware)
   app.use(unsupportedBrowserMiddleware)
-  app.use(pageCacheMiddleware)
 
   /**
    * Blank page used by Eigen for caching web views.

src/typings/sharify.d.ts

@@ -24,6 +24,7 @@ declare module "sharify" {
       readonly CMS_URL: string
       CURRENT_PATH: string
       CURRENT_USER: User
+      readonly DECAYED_MERCH_V3: string // TODO: Remove after A/B test
       readonly DEPLOY_ENV: string
       readonly EIGEN: boolean
       readonly ENABLE_NEW_ARTWORK_FILTERS: boolean

src/v2/Apps/Artist/Routes/Overview/Components/ArtistArtworkFilter.tsx

@@ -7,6 +7,7 @@ import { Match, RouterState, withRouter } from "found"
 import React from "react"
 import { RelayRefetchProp, createRefetchContainer, graphql } from "react-relay"
 import { ZeroState } from "./ZeroState"
+import { getENV } from "v2/Utils/getENV"
 
 interface ArtistArtworkFilterProps {
   artist: ArtistArtworkFilter_artist
@@ -24,18 +25,31 @@ const ArtistArtworkFilter: React.FC<ArtistArtworkFilterProps> = props => {
   // we still want to render the rest of the page.
   if (!hasFilter) return null
 
+  const sortOptions = [
+    { value: "-has_price,-prices", text: "Price (desc.)" },
+    { value: "-has_price,prices", text: "Price (asc.)" },
+    { value: "-partner_updated_at", text: "Recently updated" },
+    { value: "-published_at", text: "Recently added" },
+    { value: "-year", text: "Artwork year (desc.)" },
+    { value: "year", text: "Artwork year (asc.)" },
+  ]
+
+  const defaultSortValue =
+    getENV("DECAYED_MERCH_V3") === "experiment"
+      ? "-decayed_merch_v2"
+      : "-decayed_merch"
+
+  sortOptions.unshift({ value: defaultSortValue, text: "Default" })
+
+  const initialFilters = {
+    ...(match && match.location.query),
+    sort: defaultSortValue,
+  }
+
   return (
     <ArtworkFilterContextProvider
-      filters={match && match.location.query}
-      sortOptions={[
-        { value: "-decayed_merch", text: "Default" },
-        { value: "-has_price,-prices", text: "Price (desc.)" },
-        { value: "-has_price,prices", text: "Price (asc.)" },
-        { value: "-partner_updated_at", text: "Recently updated" },
-        { value: "-published_at", text: "Recently added" },
-        { value: "-year", text: "Artwork year (desc.)" },
-        { value: "year", text: "Artwork year (asc.)" },
-      ]}
+      filters={initialFilters}
+      sortOptions={sortOptions}
       // @ts-expect-error STRICT_NULL_CHECK
       aggregations={sidebarAggregations.aggregations as any}
       // @ts-expect-error STRICT_NULL_CHECK

src/v2/Apps/Artist/artistRoutes.tsx

@@ -123,9 +123,15 @@ export const artistRoutes: AppRouteConfig[] = [
           // renders (such as tabbing back to this route in your browser) will not.
           const filterStateFromUrl = props.location ? props.location.query : {}
 
+          const sort =
+            getENV("DECAYED_MERCH_V3") === "experiment"
+              ? "-decayed_merch_v2"
+              : "-decayed_merch"
+
           const filterParams = {
             ...initialArtworkFilterState,
             ...paramsToCamelCase(filterStateFromUrl),
+            sort,
           }
 
           // filterParams.hasFilter = Object.entries(filterParams).some(

src/v2/Artsy/Analytics/__tests__/trackingMiddleware.jest.ts

@@ -6,6 +6,7 @@ declare const global: any
 jest.mock("sharify", () => ({
   data: {
     APP_URL: "http://testing.com",
+    ALL_ARTWORKS_AS_CATS: "experiment",
   },
 }))
 
@@ -19,7 +20,7 @@ describe("trackingMiddleware", () => {
   beforeEach(() => {
     // FIXME: reaction migration
     // @ts-ignore
-    window.analytics = { page: jest.fn() }
+    window.analytics = { track: jest.fn(), page: jest.fn() }
   })
 
   afterEach(() => {
@@ -145,4 +146,30 @@ describe("trackingMiddleware", () => {
       })
     })
   })
+
+  describe("triggering AB test experiment viewed events", () => {
+    it("triggers for a given route", () => {
+      trackingMiddleware({
+        abTestRouteMap: [
+          { abTest: "all_artworks_as_cats", routes: ["/artwork(.*)"] },
+        ],
+      })(store)(noop)({
+        type: ActionTypes.UPDATE_LOCATION,
+        payload: {
+          pathname: "/artwork/some-id",
+        },
+      })
+      expect(global.analytics.track).toBeCalledWith(
+        "Experiment Viewed",
+        {
+          experiment_id: "all_artworks_as_cats",
+          experiment_name: "all_artworks_as_cats",
+          variation_id: "experiment",
+          variation_name: "experiment",
+          nonInteraction: 1,
+        },
+        { page: {} }
+      )
+    })
+  })
 })

src/v2/Artsy/Analytics/trackExperimentViewed.tsx

@@ -1,7 +1,7 @@
 import * as Schema from "v2/Artsy/Analytics"
 import { data as sd } from "sharify"
 
-export const trackExperimentViewed = (name: string, trackingData) => {
+export const trackExperimentViewed = (name: string, trackingData = {}) => {
   if (typeof window.analytics !== "undefined") {
     const variation = sd[name.toUpperCase()]
     if (!Boolean(variation)) {