@adobe/alloy 2.19.0-beta.9 → 2.19.1-beta.0

package/libEs6/components/Personalization/createOnClickHandler.js

@@ -11,8 +11,8 @@ governing permissions and limitations under the License.
 */
 
 import { isNonEmptyArray } from "../../utils";
-import { INTERACT } from "./constants/eventType";
-import { PropositionEventType } from "./constants/propositionEventType";
+import { INTERACT } from "../../constants/eventType";
+import { PropositionEventType } from "../../constants/propositionEventType";
 export default (({
   mergeDecisionsMeta,
   collectClicks,
@@ -43,7 +43,9 @@ export default (({
           };
         }
         event.mergeXdm(xdm);
-        mergeDecisionsMeta(event, decisionsMeta, PropositionEventType.INTERACT, eventLabel);
+        mergeDecisionsMeta(event, decisionsMeta, [PropositionEventType.INTERACT], eventLabel ? {
+          label: eventLabel
+        } : undefined);
       }
     }
   };

package/libEs6/components/Personalization/createOnDecisionHandler.js

@@ -0,0 +1,42 @@
+/*
+Copyright 2023 Adobe. All rights reserved.
+This file is licensed to you under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License. You may obtain a copy
+of the License at http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software distributed under
+the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+OF ANY KIND, either express or implied. See the License for the specific language
+governing permissions and limitations under the License.
+*/
+
+export default (({
+  processPropositions,
+  createProposition,
+  notificationHandler
+}) => {
+  return ({
+    renderDecisions,
+    propositions,
+    event,
+    personalization = {}
+  }) => {
+    if (!renderDecisions) {
+      return Promise.resolve();
+    }
+    const {
+      sendDisplayEvent = true
+    } = personalization;
+    const viewName = event ? event.getViewName() : undefined;
+    const propositionsToExecute = propositions.map(proposition => createProposition(proposition, true));
+    const {
+      render,
+      returnedPropositions
+    } = processPropositions(propositionsToExecute);
+    const handleNotifications = notificationHandler(sendDisplayEvent, viewName);
+    render().then(handleNotifications);
+    return Promise.resolve({
+      propositions: returnedPropositions
+    });
+  };
+});

package/libEs6/components/Personalization/createPersonalizationDetails.js

@@ -13,7 +13,7 @@ governing permissions and limitations under the License.
 import { includes, isNonEmptyString, isNonEmptyArray } from "../../utils";
 import { buildPageSurface, normalizeSurfaces } from "./utils/surfaceUtils";
 import PAGE_WIDE_SCOPE from "../../constants/pageWideScope";
-import { DEFAULT_CONTENT_ITEM, DOM_ACTION, HTML_CONTENT_ITEM, JSON_CONTENT_ITEM, REDIRECT_ITEM } from "./constants/schema";
+import { DEFAULT_CONTENT_ITEM, DOM_ACTION, HTML_CONTENT_ITEM, MESSAGE_IN_APP, JSON_CONTENT_ITEM, REDIRECT_ITEM, RULESET_ITEM, MESSAGE_FEED_ITEM } from "../../constants/schema";
 const addPageWideScope = scopes => {
   if (!includes(scopes, PAGE_WIDE_SCOPE)) {
     scopes.push(PAGE_WIDE_SCOPE);
@@ -64,11 +64,11 @@ export default (({
         scopes.push(...personalization.decisionScopes);
       }
       const eventSurfaces = normalizeSurfaces(personalization.surfaces, getPageLocation, logger);
-      if (!this.isCacheInitialized() || personalization.requestPersonalization) {
+      if (this.shouldRequestDefaultPersonalization()) {
         addPageWideScope(scopes);
         addPageSurface(eventSurfaces, getPageLocation);
       }
-      const schemas = [DEFAULT_CONTENT_ITEM, HTML_CONTENT_ITEM, JSON_CONTENT_ITEM, REDIRECT_ITEM];
+      const schemas = [DEFAULT_CONTENT_ITEM, HTML_CONTENT_ITEM, JSON_CONTENT_ITEM, REDIRECT_ITEM, RULESET_ITEM, MESSAGE_IN_APP, MESSAGE_FEED_ITEM];
       if (includes(scopes, PAGE_WIDE_SCOPE)) {
         schemas.push(DOM_ACTION);
       }
@@ -82,10 +82,13 @@ export default (({
       return isCacheInitialized;
     },
     shouldFetchData() {
-      return this.hasScopes() || this.hasSurfaces() || personalization.requestPersonalization || !this.isCacheInitialized() && personalization.requestPersonalization !== false;
+      return this.hasScopes() || this.hasSurfaces() || this.shouldRequestDefaultPersonalization();
     },
     shouldUseCachedData() {
-      return this.hasViewName() && this.isCacheInitialized();
+      return this.hasViewName() && !this.shouldFetchData();
+    },
+    shouldRequestDefaultPersonalization() {
+      return personalization.defaultPersonalizationEnabled || !this.isCacheInitialized() && personalization.defaultPersonalizationEnabled !== false;
     }
   };
 });

package/libEs6/components/Personalization/createPreprocessors.js

@@ -0,0 +1,19 @@
+/*
+Copyright 2023 Adobe. All rights reserved.
+This file is licensed to you under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License. You may obtain a copy
+of the License at http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software distributed under
+the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+OF ANY KIND, either express or implied. See the License for the specific language
+governing permissions and limitations under the License.
+*/
+import { DOM_ACTION } from "../../constants/schema";
+import remapHeadOffers from "./dom-actions/remapHeadOffers";
+import remapCustomCodeOffers from "./dom-actions/remapCustomCodeOffers";
+export default (() => {
+  return {
+    [DOM_ACTION]: [remapHeadOffers, remapCustomCodeOffers]
+  };
+});

package/libEs6/components/Personalization/createViewCacheManager.js

@@ -10,9 +10,9 @@ OF ANY KIND, either express or implied. See the License for the specific languag
 governing permissions and limitations under the License.
 */
 
-import { groupBy } from "../../utils";
+import { assign, groupBy } from "../../utils";
 import defer from "../../utils/defer";
-import { DEFAULT_CONTENT_ITEM } from "./constants/schema";
+import { DEFAULT_CONTENT_ITEM } from "../../constants/schema";
 import { VIEW_SCOPE_TYPE } from "./constants/scopeType";
 export default (({
   createProposition
@@ -42,7 +42,16 @@ export default (({
   const createCacheUpdate = viewName => {
     const updateCacheDeferred = defer();
     cacheUpdateCreatedAtLeastOnce = true;
-    viewStoragePromise = viewStoragePromise.then(oldViewStorage => updateCacheDeferred.promise.catch(() => oldViewStorage));
+
+    // Additional updates will merge the new view propositions with the old.
+    // i.e. if there are new "cart" view propositions they will overwrite the
+    // old "cart" view propositions, but if there are no new "cart" view
+    // propositions the old "cart" view propositions will remain.
+    viewStoragePromise = viewStoragePromise.then(oldViewStorage => {
+      return updateCacheDeferred.promise.then(newViewStorage => {
+        return assign({}, oldViewStorage, newViewStorage);
+      }).catch(() => oldViewStorage);
+    });
     return {
       update(viewPropositions) {
         const viewPropositionsWithScope = viewPropositions.filter(proposition => proposition.getScope());

package/libEs6/components/Personalization/dom-actions/createRedirect.js

@@ -10,4 +10,13 @@ OF ANY KIND, either express or implied. See the License for the specific languag
 governing permissions and limitations under the License.
 */
 
-export default (window => url => window.location.replace(url));
+export default (window => (url, preserveHistory = false) => {
+  if (preserveHistory) {
+    window.location.href = url;
+  } else {
+    window.location.replace(url);
+  }
+  // Return a promise that never resolves because redirects never complete
+  // within the current page.
+  return new Promise(() => undefined);
+});

package/libEs6/components/Personalization/event.js

@@ -10,24 +10,29 @@ OF ANY KIND, either express or implied. See the License for the specific languag
 governing permissions and limitations under the License.
 */
 
-const EVENT_TYPE_TRUE = 1;
+import { EVENT_TYPE_TRUE } from "../../constants/eventType";
 
 /* eslint-disable no-underscore-dangle */
-export const mergeDecisionsMeta = (event, decisionsMeta, eventType, eventLabel = "") => {
+export const mergeDecisionsMeta = (event, decisionsMeta, propositionEventTypes, propositionAction) => {
+  // Do not send a display notification with no decisions. Even empty view changes
+  // should include a proposition.
+  if (decisionsMeta.length === 0) {
+    return;
+  }
+  const propositionEventType = {};
+  propositionEventTypes.forEach(type => {
+    propositionEventType[type] = EVENT_TYPE_TRUE;
+  });
   const xdm = {
     _experience: {
       decisioning: {
         propositions: decisionsMeta,
-        propositionEventType: {
-          [eventType]: EVENT_TYPE_TRUE
-        }
+        propositionEventType
       }
     }
   };
-  if (eventLabel) {
-    xdm._experience.decisioning.propositionAction = {
-      label: eventLabel
-    };
+  if (propositionAction) {
+    xdm._experience.decisioning.propositionAction = propositionAction;
   }
   event.mergeXdm(xdm);
 };

package/libEs6/components/Personalization/handlers/createProcessInAppMessage.js

@@ -0,0 +1,77 @@
+/*
+Copyright 2023 Adobe. All rights reserved.
+This file is licensed to you under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License. You may obtain a copy
+of the License at http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software distributed under
+the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+OF ANY KIND, either express or implied. See the License for the specific language
+governing permissions and limitations under the License.
+*/
+import { APPLICATION_JSON } from "../../../constants/contentType";
+const DEFAULT_CONTENT = "defaultContent";
+const expectedProps = ["content", "contentType"];
+const expectedContentProps = ["mobileParameters", "webParameters", "html"];
+const isValidInAppMessage = (data, logger) => {
+  for (let i = 0; i < expectedProps.length; i += 1) {
+    const prop = expectedProps[i];
+    if (!Object.prototype.hasOwnProperty.call(data, prop)) {
+      logger.warn(`Invalid in-app message data: missing property '${prop}'.`, data);
+      return false;
+    }
+  }
+  const {
+    content,
+    contentType
+  } = data;
+  if (contentType === APPLICATION_JSON) {
+    for (let i = 0; i < expectedContentProps.length; i += 1) {
+      const prop = expectedContentProps[i];
+      if (!Object.prototype.hasOwnProperty.call(content, prop)) {
+        logger.warn(`Invalid in-app message data.content: missing property '${prop}'.`, data);
+        return false;
+      }
+    }
+  }
+  return true;
+};
+export default (({
+  modules,
+  logger
+}) => {
+  return item => {
+    const data = item.getData();
+    const meta = {
+      ...item.getProposition().getNotification()
+    };
+    if (!data) {
+      logger.warn("Invalid in-app message data: undefined.", data);
+      return {};
+    }
+    const {
+      type = DEFAULT_CONTENT
+    } = data;
+    if (!modules[type]) {
+      logger.warn("Invalid in-app message data: unknown type.", data);
+      return {};
+    }
+    if (!isValidInAppMessage(data, logger)) {
+      return {};
+    }
+    if (!meta) {
+      logger.warn("Invalid in-app message meta: undefined.", meta);
+      return {};
+    }
+    return {
+      render: () => {
+        return modules[type]({
+          ...data,
+          meta
+        });
+      },
+      setRenderAttempted: true,
+      includeInNotification: true
+    };
+  };
+});

package/libEs6/components/Personalization/handlers/createProcessRedirect.js

@@ -26,8 +26,11 @@ export default (({
       decisionsMeta: [item.getProposition().getNotification()],
       documentMayUnload: true
     }).then(() => {
-      executeRedirect(content);
-      // We've already sent the display notification, so don't return anything
+      return executeRedirect(content);
+      // Execute redirect will never resolve. If there are bottom of page events that are waiting
+      // for display notifications from this request, they will never run because this promise will
+      // not resolve. This is intentional because we don't want to run bottom of page events if
+      // there is a redirect.
     });
   };
 

package/libEs6/components/Personalization/in-app-message-actions/actions/displayIframeContent.js

@@ -0,0 +1,291 @@
+/*
+Copyright 2023 Adobe. All rights reserved.
+This file is licensed to you under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License. You may obtain a copy
+of the License at http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software distributed under
+the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+OF ANY KIND, either express or implied. See the License for the specific language
+governing permissions and limitations under the License.
+*/
+
+import { getNonce } from "../../dom-actions/dom";
+import { parseAnchor, removeElementById } from "../utils";
+import { TEXT_HTML } from "../../../../constants/contentType";
+import { assign, includes, isNonEmptyString, values } from "../../../../utils";
+import { createNode } from "../../../../utils/dom";
+import { objectOf } from "../../../../utils/validation";
+import { PropositionEventType } from "../../../../constants/propositionEventType";
+import { EVENT_TYPE_TRUE, INTERACT } from "../../../../constants/eventType";
+import createRedirect from "../../dom-actions/createRedirect";
+const MESSAGING_CONTAINER_ID = "alloy-messaging-container";
+const OVERLAY_CONTAINER_ID = "alloy-overlay-container";
+const IFRAME_ID = "alloy-content-iframe";
+const dismissMessage = () => [MESSAGING_CONTAINER_ID, OVERLAY_CONTAINER_ID].forEach(removeElementById);
+export const createIframeClickHandler = (interact, navigateToUrl = createRedirect(window)) => {
+  return event => {
+    event.preventDefault();
+    event.stopImmediatePropagation();
+    const {
+      target
+    } = event;
+    const anchor = target.tagName.toLowerCase() === "a" ? target : target.closest("a");
+    if (!anchor) {
+      return;
+    }
+    const {
+      action,
+      interaction,
+      link,
+      label,
+      uuid
+    } = parseAnchor(anchor);
+    interact(action, {
+      label,
+      id: interaction,
+      uuid,
+      link
+    });
+    if (action === "dismiss") {
+      dismissMessage();
+    }
+    if (isNonEmptyString(link) && link.length > 0) {
+      navigateToUrl(link, true);
+    }
+  };
+};
+export const createIframe = (htmlContent, clickHandler) => {
+  const parser = new DOMParser();
+  const htmlDocument = parser.parseFromString(htmlContent, TEXT_HTML);
+  const scriptTag = htmlDocument.querySelector("script");
+  if (scriptTag) {
+    scriptTag.setAttribute("nonce", getNonce());
+  }
+  const element = createNode("iframe", {
+    src: URL.createObjectURL(new Blob([htmlDocument.documentElement.outerHTML], {
+      type: "text/html"
+    })),
+    id: IFRAME_ID
+  });
+  element.addEventListener("load", () => {
+    const {
+      addEventListener
+    } = element.contentDocument || element.contentWindow.document;
+    addEventListener("click", clickHandler);
+  });
+  return element;
+};
+const renderMessage = (iframe, webParameters, container, overlay) => {
+  [{
+    id: OVERLAY_CONTAINER_ID,
+    element: overlay
+  }, {
+    id: MESSAGING_CONTAINER_ID,
+    element: container
+  }, {
+    id: IFRAME_ID,
+    element: iframe
+  }].forEach(({
+    id,
+    element
+  }) => {
+    const {
+      style = {},
+      params = {}
+    } = webParameters[id];
+    assign(element.style, style);
+    const {
+      parentElement = "body",
+      insertionMethod = "appendChild",
+      enabled = true
+    } = params;
+    const parent = document.querySelector(parentElement);
+    if (enabled && parent && typeof parent[insertionMethod] === "function") {
+      parent[insertionMethod](element);
+    }
+  });
+};
+export const buildStyleFromMobileParameters = mobileParameters => {
+  const {
+    verticalAlign,
+    width,
+    horizontalAlign,
+    backdropColor,
+    height,
+    cornerRadius,
+    horizontalInset,
+    verticalInset,
+    uiTakeover = false
+  } = mobileParameters;
+  const style = {
+    width: width ? `${width}%` : "100%",
+    backgroundColor: backdropColor || "rgba(0, 0, 0, 0.5)",
+    borderRadius: cornerRadius ? `${cornerRadius}px` : "0px",
+    border: "none",
+    position: uiTakeover ? "fixed" : "relative",
+    overflow: "hidden"
+  };
+  if (horizontalAlign === "left") {
+    style.left = horizontalInset ? `${horizontalInset}%` : "0";
+  } else if (horizontalAlign === "right") {
+    style.right = horizontalInset ? `${horizontalInset}%` : "0";
+  } else if (horizontalAlign === "center") {
+    style.left = "50%";
+    style.transform = "translateX(-50%)";
+  }
+  if (verticalAlign === "top") {
+    style.top = verticalInset ? `${verticalInset}%` : "0";
+  } else if (verticalAlign === "bottom") {
+    style.position = "fixed";
+    style.bottom = verticalInset ? `${verticalInset}%` : "0";
+  } else if (verticalAlign === "center") {
+    style.top = "50%";
+    style.transform = `${horizontalAlign === "center" ? `${style.transform} ` : ""}translateY(-50%)`;
+    style.display = "flex";
+    style.alignItems = "center";
+    style.justifyContent = "center";
+  }
+  if (height) {
+    style.height = `${height}vh`;
+  } else {
+    style.height = "100%";
+  }
+  return style;
+};
+export const mobileOverlay = mobileParameters => {
+  const {
+    backdropOpacity,
+    backdropColor
+  } = mobileParameters;
+  const opacity = backdropOpacity || 0.5;
+  const color = backdropColor || "#FFFFFF";
+  const style = {
+    position: "fixed",
+    top: "0",
+    left: "0",
+    width: "100%",
+    height: "100%",
+    background: "transparent",
+    opacity,
+    backgroundColor: color
+  };
+  return style;
+};
+const REQUIRED_PARAMS = ["enabled", "parentElement", "insertionMethod"];
+const isValidWebParameters = webParameters => {
+  if (!webParameters) {
+    return false;
+  }
+  const ids = Object.keys(webParameters);
+  if (!includes(ids, MESSAGING_CONTAINER_ID)) {
+    return false;
+  }
+  if (!includes(ids, OVERLAY_CONTAINER_ID)) {
+    return false;
+  }
+  const valuesArray = values(webParameters);
+  for (let i = 0; i < valuesArray.length; i += 1) {
+    if (!objectOf(valuesArray[i], "style")) {
+      return false;
+    }
+    if (!objectOf(valuesArray[i], "params")) {
+      return false;
+    }
+    for (let j = 0; j < REQUIRED_PARAMS.length; j += 1) {
+      if (!objectOf(valuesArray[i].params, REQUIRED_PARAMS[j])) {
+        return false;
+      }
+    }
+  }
+  return true;
+};
+const generateWebParameters = mobileParameters => {
+  if (!mobileParameters) {
+    return undefined;
+  }
+  const {
+    uiTakeover = false
+  } = mobileParameters;
+  return {
+    [IFRAME_ID]: {
+      style: {
+        border: "none",
+        width: "100%",
+        height: "100%"
+      },
+      params: {
+        enabled: true,
+        parentElement: "#alloy-messaging-container",
+        insertionMethod: "appendChild"
+      }
+    },
+    [MESSAGING_CONTAINER_ID]: {
+      style: buildStyleFromMobileParameters(mobileParameters),
+      params: {
+        enabled: true,
+        parentElement: "body",
+        insertionMethod: "appendChild"
+      }
+    },
+    [OVERLAY_CONTAINER_ID]: {
+      style: mobileOverlay(mobileParameters),
+      params: {
+        enabled: uiTakeover === true,
+        parentElement: "body",
+        insertionMethod: "appendChild"
+      }
+    }
+  };
+};
+export const displayHTMLContentInIframe = (settings = {}, interact) => {
+  dismissMessage();
+  const {
+    content,
+    contentType,
+    mobileParameters
+  } = settings;
+  let {
+    webParameters
+  } = settings;
+  if (contentType !== TEXT_HTML) {
+    return;
+  }
+  const container = createNode("div", {
+    id: MESSAGING_CONTAINER_ID
+  });
+  const iframe = createIframe(content, createIframeClickHandler(interact));
+  const overlay = createNode("div", {
+    id: OVERLAY_CONTAINER_ID
+  });
+  if (!isValidWebParameters(webParameters)) {
+    webParameters = generateWebParameters(mobileParameters);
+  }
+  if (!webParameters) {
+    return;
+  }
+  renderMessage(iframe, webParameters, container, overlay);
+};
+export default ((settings, collect) => {
+  return new Promise(resolve => {
+    const {
+      meta
+    } = settings;
+    displayHTMLContentInIframe(settings, (action, propositionAction) => {
+      const propositionEventTypes = {};
+      propositionEventTypes[PropositionEventType.INTERACT] = EVENT_TYPE_TRUE;
+      if (Object.values(PropositionEventType).indexOf(action) !== -1) {
+        propositionEventTypes[action] = EVENT_TYPE_TRUE;
+      }
+      collect({
+        decisionsMeta: [meta],
+        propositionAction,
+        eventType: INTERACT,
+        propositionEventTypes: Object.keys(propositionEventTypes)
+      });
+    });
+    resolve({
+      meta
+    });
+  });
+});

package/libEs6/components/Personalization/in-app-message-actions/initInAppMessageActionsModules.js

@@ -0,0 +1,17 @@
+/*
+Copyright 2023 Adobe. All rights reserved.
+This file is licensed to you under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License. You may obtain a copy
+of the License at http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software distributed under
+the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+OF ANY KIND, either express or implied. See the License for the specific language
+governing permissions and limitations under the License.
+*/
+import displayIframeContent from "./actions/displayIframeContent";
+export default (collect => {
+  return {
+    defaultContent: settings => displayIframeContent(settings, collect)
+  };
+});

package/libEs6/components/Personalization/in-app-message-actions/utils.js

@@ -0,0 +1,49 @@
+/*
+Copyright 2023 Adobe. All rights reserved.
+This file is licensed to you under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License. You may obtain a copy
+of the License at http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software distributed under
+the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+OF ANY KIND, either express or implied. See the License for the specific language
+governing permissions and limitations under the License.
+*/
+import { isNonEmptyArray, queryString, startsWith } from "../../../utils";
+import { removeNode, selectNodes } from "../../../utils/dom";
+export const removeElementById = id => {
+  const element = selectNodes(`#${id}`, document);
+  if (element && element.length > 0) {
+    removeNode(element[0]);
+  }
+};
+export const parseAnchor = anchor => {
+  const nothing = {};
+  if (!anchor || anchor.tagName.toLowerCase() !== "a") {
+    return nothing;
+  }
+  const {
+    href
+  } = anchor;
+  if (!href || !startsWith(href, "adbinapp://")) {
+    return nothing;
+  }
+  const hrefParts = href.split("?");
+  const action = hrefParts[0].split("://")[1];
+  const label = anchor.innerText;
+  const uuid = anchor.getAttribute("data-uuid") || "";
+  let interaction;
+  let link;
+  if (isNonEmptyArray(hrefParts)) {
+    const queryParams = queryString.parse(hrefParts[1]);
+    interaction = queryParams.interaction || "";
+    link = decodeURIComponent(queryParams.link || "");
+  }
+  return {
+    action,
+    interaction,
+    link,
+    label,
+    uuid
+  };
+};