@adobe/alloy 2.32.1-beta.1 → 2.33.0

package/src/components/Personalization/createSetTargetMigration.js

@@ -0,0 +1,22 @@
+/*
+Copyright 2022 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 { noop } from "@adobe/alloy-core/utils";
+
+export default ({ targetMigrationEnabled }) => {
+  if (targetMigrationEnabled) {
+    return (request) => {
+      request.getPayload().mergeMeta({ target: { migration: true } });
+    };
+  }
+  return noop;
+};

package/src/components/Personalization/createViewCacheManager.js

@@ -0,0 +1,101 @@
+/*
+Copyright 2020 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 { groupBy } from "@adobe/alloy-core/utils";
+import defer from "@adobe/alloy-core/utils/defer.js";
+import { DEFAULT_CONTENT_ITEM } from "@adobe/alloy-core/constants/schema.js";
+import { VIEW_SCOPE_TYPE } from "./constants/scopeType.js";
+
+export default ({ createProposition }) => {
+  let cacheUpdateCreatedAtLeastOnce = false;
+  let viewStoragePromise = Promise.resolve({});
+
+  const getViewPropositions = (viewStorage, viewName) => {
+    const viewPropositions = viewStorage[viewName.toLowerCase()];
+    if (viewPropositions && viewPropositions.length > 0) {
+      return viewPropositions;
+    }
+
+    const emptyViewProposition = createProposition(
+      {
+        scope: viewName,
+        scopeDetails: {
+          characteristics: {
+            scopeType: VIEW_SCOPE_TYPE,
+          },
+        },
+        items: [
+          {
+            schema: DEFAULT_CONTENT_ITEM,
+          },
+        ],
+      },
+      false,
+    );
+    return [emptyViewProposition];
+  };
+
+  // This should be called before making the request to experience edge.
+  const createCacheUpdate = (viewName) => {
+    const updateCacheDeferred = defer();
+
+    cacheUpdateCreatedAtLeastOnce = true;
+
+    // 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 { ...oldViewStorage, ...newViewStorage };
+        })
+        .catch(() => oldViewStorage);
+    });
+
+    return {
+      update(viewPropositions) {
+        const viewPropositionsWithScope = viewPropositions.filter(
+          (proposition) => proposition.getScope(),
+        );
+        const newViewStorage = groupBy(
+          viewPropositionsWithScope,
+          (proposition) => proposition.getScope().toLowerCase(),
+        );
+        updateCacheDeferred.resolve(newViewStorage);
+        if (viewName) {
+          return getViewPropositions(newViewStorage, viewName);
+        }
+        return [];
+      },
+      cancel() {
+        updateCacheDeferred.reject();
+      },
+    };
+  };
+
+  const getView = (viewName) => {
+    return viewStoragePromise.then((viewStorage) =>
+      getViewPropositions(viewStorage, viewName),
+    );
+  };
+
+  const isInitialized = () => {
+    return cacheUpdateCreatedAtLeastOnce;
+  };
+
+  return {
+    createCacheUpdate,
+    getView,
+    isInitialized,
+  };
+};

package/src/components/Personalization/createViewChangeHandler.js

@@ -0,0 +1,53 @@
+/*
+Copyright 2020 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, viewCache, logger }) => {
+  return ({ personalizationDetails, onResponse }) => {
+    let returnedPropositions;
+    let returnedDecisions;
+    const viewName = personalizationDetails.getViewName();
+
+    onResponse(() => {
+      return {
+        propositions: returnedPropositions,
+        decisions: returnedDecisions,
+      };
+    });
+
+    return viewCache.getView(viewName).then((propositions) => {
+      let render;
+      if (personalizationDetails.isRenderDecisions()) {
+        ({ render, returnedPropositions, returnedDecisions } =
+          processPropositions(propositions));
+
+        logger.logOnContentRendering({
+          status: "rendering-started",
+          message: `Started rendering propositions for view scope - ${viewName}.`,
+          logLevel: "info",
+          detail: {
+            scope: viewName,
+            propositions: propositions.map((proposition) =>
+              proposition.toJSON(),
+            ),
+          },
+        });
+
+        return render();
+      }
+      ({ returnedPropositions, returnedDecisions } = processPropositions(
+        [],
+        propositions,
+      ));
+      return [];
+    });
+  };
+};

package/src/components/Personalization/dom-actions/action.js

@@ -0,0 +1,97 @@
+/*
+Copyright 2019 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 { awaitSelector } from "@adobe/alloy-core/utils/dom";
+import { hideElements, showElements } from "../flicker/index.js";
+import { selectNodesWithEq } from "./dom/index.js";
+
+export { default as setText } from "./setText.js";
+export { default as setHtml } from "./setHtml.js";
+export { default as appendHtml } from "./appendHtml.js";
+export { default as prependHtml } from "./prependHtml.js";
+export { default as replaceHtml } from "./replaceHtml.js";
+export { default as insertHtmlBefore } from "./insertHtmlBefore.js";
+export { default as insertHtmlAfter } from "./insertHtmlAfter.js";
+export { default as setStyles } from "./setStyles.js";
+export { default as setAttributes } from "./setAttributes.js";
+export { default as swapImage } from "./swapImage.js";
+export { default as rearrangeChildren } from "./rearrangeChildren.js";
+
+/**
+ * Renders content into a container element.
+ *
+ * @param {Object} params
+ * @param {Element[]} params.containers
+ * @param {string} params.content
+ * @param {(element: Element) => void} params.decorateProposition
+ * @param {(container: Element, content: string, decorateProposition: (element: Element) => void) => Promise<void>} params.renderFunc
+ * @returns {Promise<void>} A promise that resolves when the content is rendered.
+ */
+const renderContent = ({
+  containers,
+  content,
+  decorateProposition,
+  renderFunc,
+  renderStatusHandler,
+  alwaysRender,
+}) => {
+  const executions = containers
+    .filter(
+      (element) => alwaysRender || renderStatusHandler.shouldRender(element),
+    )
+    .map(async (container) => {
+      await renderFunc(container, content, decorateProposition);
+      renderStatusHandler.markAsRendered(container);
+    });
+
+  return Promise.all(executions);
+};
+
+/**
+ * Creates an action function that renders content into a container element.
+ *
+ * @param {Function} renderFunc - The function that performs the rendering.
+ * @param {boolean} alwaysRender - Whether to always render the content, even if it has already been rendered.
+ */
+export const createAction = (renderFunc, alwaysRender = false) => {
+  /**
+   * Renders content into a container element.
+   *
+   * @param {{ selector: string, prehidingSelector: string, content: string }} itemData - The item data containing the container selector and prehiding selector.
+   * @param {(element: Element) => void} createDecorateProposition
+   * @param {{ shouldRender: (element: Element) => boolean, markAsRendered: (element: Element) => void }} renderStatusHandler
+   */
+  return async (itemData, decorateProposition, renderStatusHandler) => {
+    const {
+      selector: containerSelector,
+      prehidingSelector,
+      content,
+    } = itemData;
+    hideElements(prehidingSelector);
+    try {
+      const containers = await awaitSelector(
+        containerSelector,
+        selectNodesWithEq,
+      );
+      renderContent({
+        containers,
+        content,
+        decorateProposition,
+        renderFunc,
+        renderStatusHandler,
+        alwaysRender,
+      });
+    } finally {
+      showElements(prehidingSelector);
+    }
+  };
+};

package/src/components/Personalization/dom-actions/addNonceToInlineStyleElements.js

@@ -0,0 +1,37 @@
+/*
+Copyright 2019 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 { selectNodes } from "@adobe/alloy-core/utils/dom";
+import { STYLE } from "@adobe/alloy-core/constants/tagName.js";
+import { SRC } from "@adobe/alloy-core/constants/elementAttribute.js";
+import { getAttribute, getNonce } from "./dom/index.js";
+
+const is = (element, tagName) => element.tagName === tagName;
+const isInlineStyleElement = (element) =>
+  is(element, STYLE) && !getAttribute(element, SRC);
+
+export default (fragment) => {
+  const styleNodes = selectNodes(STYLE, fragment);
+  const { length } = styleNodes;
+  const nonce = getNonce();
+  if (!nonce) {
+    return;
+  }
+
+  for (let i = 0; i < length; i += 1) {
+    const element = styleNodes[i];
+    if (!isInlineStyleElement(element)) {
+      continue;
+    }
+    element.nonce = nonce;
+  }
+};

package/src/components/Personalization/dom-actions/appendHtml.js

@@ -0,0 +1,42 @@
+/*
+Copyright 2019 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 { appendNode } from "@adobe/alloy-core/utils/dom";
+import { createFragment, getChildNodes } from "./dom/index.js";
+import { loadImages } from "./images.js";
+import addNonceToInlineStyleElements from "./addNonceToInlineStyleElements.js";
+import {
+  executeInlineScripts,
+  executeRemoteScripts,
+  getInlineScripts,
+  getRemoteScriptsUrls,
+} from "./scripts.js";
+
+export default (container, html, decorateProposition) => {
+  const fragment = createFragment(html);
+  addNonceToInlineStyleElements(fragment);
+  const elements = getChildNodes(fragment);
+  const scripts = getInlineScripts(fragment);
+  const scriptsUrls = getRemoteScriptsUrls(fragment);
+
+  loadImages(fragment);
+
+  elements.forEach((element) => {
+    appendNode(container, element);
+  });
+
+  decorateProposition(container);
+
+  executeInlineScripts(container, scripts);
+
+  return executeRemoteScripts(scriptsUrls);
+};

package/src/components/Personalization/dom-actions/clicks/collectClicks.js

@@ -0,0 +1,89 @@
+/*
+Copyright 2019 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 matchesSelectorWithEq from "../dom/matchesSelectorWithEq.js";
+import { VIEW_SCOPE_TYPE } from "../../constants/scopeType.js";
+import { cleanMetas, dedupeMetas } from "../../utils/metaUtils.js";
+
+const getMetasIfMatches = (clickedElement, selector, getClickMetas) => {
+  const { documentElement } = document;
+  let element = clickedElement;
+  let i = 0;
+
+  while (element && element !== documentElement) {
+    if (matchesSelectorWithEq(selector, element)) {
+      const matchedMetas = getClickMetas(selector);
+      const returnValue = {
+        metas: matchedMetas,
+      };
+      const foundMetaWithLabel = matchedMetas.find(
+        (meta) => meta.trackingLabel,
+      );
+      if (foundMetaWithLabel) {
+        returnValue.label = foundMetaWithLabel.trackingLabel;
+        returnValue.weight = i;
+      }
+      const foundMetaWithScopeTypeView = matchedMetas.find(
+        (meta) => meta.scopeType === VIEW_SCOPE_TYPE,
+      );
+      if (foundMetaWithScopeTypeView) {
+        returnValue.viewName = foundMetaWithScopeTypeView.scope;
+        returnValue.weight = i;
+      }
+      return returnValue;
+    }
+
+    element = element.parentNode;
+    i += 1;
+  }
+
+  return {
+    metas: null,
+  };
+};
+
+export default (clickedElement, selectors, getClickMetas) => {
+  const result = [];
+  let resultLabel = "";
+  let resultLabelWeight = Number.MAX_SAFE_INTEGER;
+  let resultViewName;
+  let resultViewNameWeight = Number.MAX_SAFE_INTEGER;
+
+  for (let i = 0; i < selectors.length; i += 1) {
+    const { metas, label, weight, viewName } = getMetasIfMatches(
+      clickedElement,
+      selectors[i],
+      getClickMetas,
+    );
+
+    if (!metas) {
+      continue;
+    }
+
+    if (label && weight <= resultLabelWeight) {
+      resultLabel = label;
+      resultLabelWeight = weight;
+    }
+    if (viewName && weight <= resultViewNameWeight) {
+      resultViewName = viewName;
+      resultViewNameWeight = weight;
+    }
+    result.push(...cleanMetas(metas));
+  }
+
+  return {
+    decisionsMeta: dedupeMetas(result),
+    propositionActionLabel: resultLabel,
+    propositionActionToken: undefined,
+    viewName: resultViewName,
+  };
+};

package/src/components/Personalization/dom-actions/clicks/collectInteractions.js

@@ -0,0 +1,113 @@
+/*
+Copyright 2019 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 { VIEW_SCOPE_TYPE } from "../../constants/scopeType.js";
+import getAttribute from "../dom/getAttribute.js";
+import {
+  CLICK_LABEL_DATA_ATTRIBUTE,
+  CLICK_TOKEN_DATA_ATTRIBUTE,
+  INTERACT_ID_DATA_ATTRIBUTE,
+} from "../../handlers/createDecorateProposition.js";
+import { cleanMetas } from "../../utils/metaUtils.js";
+import {
+  ALWAYS,
+  DECORATED_ELEMENTS_ONLY,
+} from "@adobe/alloy-core/constants/propositionInteractionType.js";
+
+const getInteractionDetail = (clickedElement) => {
+  const { documentElement } = document;
+  let element = clickedElement;
+
+  const interactIds = new Set();
+  let clickLabel;
+  let clickToken;
+
+  while (
+    element &&
+    element !== documentElement &&
+    !(element instanceof ShadowRoot)
+  ) {
+    const interactId = getAttribute(element, INTERACT_ID_DATA_ATTRIBUTE);
+
+    if (interactId) {
+      interactIds.add(interactId);
+    }
+
+    clickLabel =
+      clickLabel || getAttribute(element, CLICK_LABEL_DATA_ATTRIBUTE);
+
+    clickToken =
+      clickToken || getAttribute(element, CLICK_TOKEN_DATA_ATTRIBUTE);
+
+    element = element.parentNode;
+  }
+
+  return { interactIds: [...interactIds], clickLabel, clickToken };
+};
+
+const extractViewName = (metas) => {
+  const foundMetaWithScopeTypeView = metas.find(
+    (meta) => meta.scopeType === VIEW_SCOPE_TYPE,
+  );
+
+  return foundMetaWithScopeTypeView
+    ? foundMetaWithScopeTypeView.scope
+    : undefined;
+};
+
+const createMetaFilter =
+  (autoCollectPropositionInteractions, clickLabel, clickToken) => (meta) => {
+    const { scopeDetails = {} } = meta;
+    const { decisionProvider } = scopeDetails;
+    if (autoCollectPropositionInteractions[decisionProvider] === ALWAYS) {
+      return true;
+    }
+
+    return (
+      autoCollectPropositionInteractions[decisionProvider] ===
+        DECORATED_ELEMENTS_ONLY &&
+      (clickLabel || clickToken)
+    );
+  };
+
+export default (
+  clickedElement,
+  getInteractionMetas,
+  autoCollectPropositionInteractions,
+) => {
+  const {
+    interactIds,
+    clickLabel = "",
+    clickToken,
+  } = getInteractionDetail(clickedElement);
+
+  const metasMatchingConfigurationOptions = createMetaFilter(
+    autoCollectPropositionInteractions,
+    clickLabel,
+    clickToken,
+  );
+
+  if (interactIds.length === 0) {
+    return {};
+  }
+
+  const metas = getInteractionMetas(interactIds).filter(
+    metasMatchingConfigurationOptions,
+  );
+
+  return {
+    decisionsMeta: cleanMetas(metas),
+    propositionActionLabel: clickLabel,
+    propositionActionToken: clickToken,
+    viewName: extractViewName(metas),
+  };
+};

package/src/components/Personalization/dom-actions/collectInteractions.js

@@ -0,0 +1,15 @@
+/*
+Copyright 2019 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 (container, content, decorateProposition) => {
+  decorateProposition(container);
+};

package/src/components/Personalization/dom-actions/createPreprocess.js

@@ -0,0 +1,21 @@
+/*
+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 (preprocessors) => (action) => {
+  if (!action) {
+    return action;
+  }
+  return preprocessors.reduce(
+    (processed, fn) => ({ ...processed, ...fn(processed) }),
+    action,
+  );
+};

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

@@ -0,0 +1,23 @@
+/*
+Copyright 2019 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 (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(() => {});
+  };

package/src/components/Personalization/dom-actions/dom/createFragment.js

@@ -0,0 +1,18 @@
+/*
+Copyright 2019 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 { createNode } from "@adobe/alloy-core/utils/dom";
+import { DIV } from "@adobe/alloy-core/constants/tagName.js";
+
+export default (content = "undefined") => {
+  return createNode(DIV, {}, { innerHTML: content });
+};

package/src/components/Personalization/dom-actions/dom/getAttribute.js

@@ -0,0 +1,15 @@
+/*
+Copyright 2019 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 (element, name) => {
+  return element.getAttribute(name);
+};

package/src/components/Personalization/dom-actions/dom/getChildNodes.js

@@ -0,0 +1,23 @@
+/*
+Copyright 2019 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 { toArray } from "@adobe/alloy-core/utils";
+
+export default (element) => {
+  const { childNodes } = element;
+
+  if (childNodes) {
+    return toArray(childNodes);
+  }
+
+  return [];
+};