some debugging for subscriptions

Author: Shane Osbourne

packages/messaging/index.js

@@ -253,6 +253,9 @@ export class Subscription {
     }
 }
 
+/**
+ * This is the shape of payloads that can be delivered via subscriptions
+ */
 export class SubscriptionEvent {
     /**
      * @param {object} params

packages/messaging/lib/test-utils.mjs

@@ -163,7 +163,8 @@ export function simulateSubscriptionMessage(params) {
         break;
     }
     case "apple": {
-        const methodName = 'webkitSubscriptionHandler' + params.messagingContext.context;
+        const methodName = 'webkitSubscriptionHandler_' + params.messagingContext.context;
+        if (!window[methodName]) throw new Error('cannot access webkit subscription handler');
         window[methodName].call(null, {
             context: params.messagingContext.context,
             featureName: params.messagingContext.featureName,

packages/messaging/lib/webkit.js

@@ -301,14 +301,16 @@ export class WebkitMessagingTransport {
    * window.webkitSubscriptionHandlerContentScopeScripts({
    *     content: "contentScopeScripts",
    *     featureName: "duckPlayerOverlays",
-   *     subscriptionName: "userValuesSubscription",
+   *     subscriptionName: "onUserValuesChanged",
    *     params: {...}
    * })
    * ```
    */
   installGlobalSubscriptionHandler () {
-    const methodName = 'webkitSubscriptionHandler' + this.messagingContext.context;
+    const methodName = 'webkitSubscriptionHandler_' + this.messagingContext.context;
+    // console.log("SUB", {methodName})
     window[methodName] = (payload) => {
+      // console.log('debug: webkit received subscription method', methodName);
       if ('context' in payload && 'featureName' in payload && 'subscriptionName' in payload) {
         for (let subscriptionHandler of this.subscriptionHandlers) {
           if (subscriptionHandler.comparator(payload)) {

packages/special-pages/index.mjs

@@ -25,7 +25,7 @@ const NODE_ENV = JSON.stringify(process.env.NODE_ENV || 'development')
 
 export const support = {
     duckplayer: {
-        // 'apple': ['copy', 'build-js', 'inline'],
+        'apple': ['copy', 'build-js', 'inline'],
         'windows': ['copy', 'build-js']
     },
 }

packages/special-pages/pages/duckplayer/src/js/index.js

@@ -23,7 +23,7 @@
  * #### Messages:
  *
  * On Page Load
- *   - {@link DuckPlayerPageMessages.userValuesSubscription} begins immediately. It expects an initial value, and then will continue to listen for updates
+ *   - {@link DuckPlayerPageMessages.onUserValuesChanged} begins immediately. It expects an initial value, and then will continue to listen for updates
  *
  * Then the following 2 messages can be sent at any time
  *   - {@link DuckPlayerPageMessages.setUserValues}
@@ -345,7 +345,7 @@ const Comms = {
             const messaging = new Messaging(messageContext, opts)
             Comms.messaging = new DuckPlayerPageMessages(messaging)
         }
-        Comms.messaging?.userValuesSubscription(value => {
+        Comms.messaging?.onUserValuesChanged(value => {
             if ('enabled' in value.privatePlayerMode) {
                 Setting.setState(true)
             } else {

packages/special-pages/pages/duckplayer/src/js/messages.js

@@ -38,13 +38,33 @@ export class DuckPlayerPageMessages {
     }
 
     /**
-     * Send this when you want to communicate a change to 'UserValues'
+     * This is a subscription that we set up when the page loads.
+     * We use this value to show/hide the checkboxes.
+     *
+     * **Integration NOTE**: Native platforms should always send this at least once on initial page load.
+     *
+     * - See {@link Messaging.SubscriptionEvent} for details on each value of this message
+     * - See {@link UserValues} for details on the `params`
+     *
+     * ```json
+     * // the payload that we receive should look like this
+     * {
+     *   "context": "specialPages",
+     *   "featureName": "duckPlayerPage",
+     *   "subscriptionName": "onUserValuesChanged",
+     *   "params": {
+     *     "overlayInteracted": false,
+     *     "privatePlayerMode": {
+     *       "enabled": {}
+     *     }
+     *   }
+     * }
+     * ```
      *
-     * For example, on initial page load we use this value to show/hide the checkboxes
      * @param {(value: UserValues) => void} cb
      */
-    userValuesSubscription (cb) {
-        return this.messaging.subscribe('userValuesSubscription', cb)
+    onUserValuesChanged (cb) {
+        return this.messaging.subscribe('onUserValuesChanged', cb)
     }
 }
 

packages/special-pages/tests/page-objects/duck-player.js

@@ -161,7 +161,7 @@ export class DuckPlayerPage {
      * @return {Promise<void>}
      */
     async didReceiveAlwaysOpenSetting (value) {
-        await this.mocks.simulateSubscriptionMessage('userValuesSubscription', {
+        await this.mocks.simulateSubscriptionMessage('onUserValuesChanged', {
             privatePlayerMode: {
                 alwaysAsk: {}
             }

packages/special-pages/tests/page-objects/mocks.js

@@ -47,7 +47,12 @@ export class Mocks {
      * @param {Record<string, any>} payload
      */
     async simulateSubscriptionMessage (name, payload) {
-        await this.page.evaluate(simulateSubscriptionMessage, { messagingContext: this.messagingContext, name, payload, platform: this.platform })
+        await this.page.evaluate(simulateSubscriptionMessage, {
+            messagingContext: this.messagingContext,
+            name,
+            payload,
+            platform: this.platform
+        })
     }
 
     /**