Fix request payloads to use key/value pair params but unwrap it on ClickToLoadMessagingTransport to match sendMessage() messages format

Author: franfaccin

src/features/click-to-load.js

@@ -631,7 +631,7 @@ function createPlaceholderElementAndReplace (widget, trackingElement) {
 
     // YouTube
     if (widget.replaceSettings.type === 'youtube-video') {
-        ctl.messaging.notify('updateYouTubeCTLAddedFlag', true)
+        ctl.messaging.notify('updateYouTubeCTLAddedFlag', { youTubeCTLAddedFlag: true })
         replaceYouTubeCTL(trackingElement, widget)
 
         // Subscribe to changes to youtubePreviewsEnabled setting
@@ -692,7 +692,7 @@ function replaceYouTubeCTL (trackingElement, widget) {
                     dataKey: 'yt-preview-toggle', // data-key attribute for button
                     label: widget.replaceSettings.previewToggleText, // Text to be presented with toggle
                     size: isMobileApp ? 'lg' : 'md',
-                    onClick: () => ctl.messaging.notify('setYoutubePreviewsEnabled', true) // Toggle click callback
+                    onClick: () => ctl.messaging.notify('setYoutubePreviewsEnabled', { youtubePreviewsEnabled: true }) // Toggle click callback
                 },
                 withFeedback: {
                     label: sharedStrings.shareFeedback,
@@ -1540,7 +1540,7 @@ function createYouTubeBlockingDialog (trackingElement, widget) {
     )
     previewToggle.addEventListener(
         'click',
-        () => makeModal(widget.entity, () => ctl.messaging.notify('setYoutubePreviewsEnabled', true), widget.entity)
+        () => makeModal(widget.entity, () => ctl.messaging.notify('setYoutubePreviewsEnabled', { youtubePreviewsEnabled: true }), widget.entity)
     )
     bottomRow.appendChild(previewToggle)
 
@@ -1657,7 +1657,7 @@ function createYouTubePreview (originalElement, widget) {
     )
     previewToggle.addEventListener(
         'click',
-        () => ctl.messaging.notify('setYoutubePreviewsEnabled', false)
+        () => ctl.messaging.notify('setYoutubePreviewsEnabled', { youtubePreviewsEnabled: false })
     )
 
     /** Preview Info Text */

src/features/click-to-load/ctl-messaging-transport.js

@@ -58,18 +58,33 @@ export class ClickToLoadMessagingTransport {
         }
         let params = req.params
 
-        // Adapts request for getYouTubeVideoDetails by identifying the correct
+        switch (req.method) {
+        // Adapts request for 'getYouTubeVideoDetails' by identifying the correct
         // response for each request and updating params to expect current
         // implementation specifications.
-        if (req.method === 'getYouTubeVideoDetails') {
+        case 'getYouTubeVideoDetails': {
             comparator = (eventData) => {
                 return (
                     eventData.responseMessageType === req.method &&
-                    eventData.response &&
-                    eventData.response.videoURL === req.params?.videoURL
+                        eventData.response &&
+                        eventData.response.videoURL === req.params?.videoURL
                 )
             }
             params = req.params.videoURL
+            break
+        }
+        // Unwrap 'updateYouTubeCTLAddedFlag' params to match expected payload
+        // for sendMessage()
+        case 'updateYouTubeCTLAddedFlag': {
+            params = req.params.youTubeCTLAddedFlag
+            break
+        }
+        // Unwrap 'setYoutubePreviewsEnabled' params to match expected payload
+        // for sendMessage()
+        case 'setYoutubePreviewsEnabled': {
+            params = req.params.youtubePreviewsEnabled
+            break
+        }
         }
 
         sendMessage(req.method, params)