VEC FAQs and Common Issues

Description

This document is created to list the VEC troubleshooting FAQs and some of the common issues related to Target VEC

Resolution

Preliminary checks

1. Query Parameters

   Check that website allows query parameter

   The VEC automatically appends the following query parameters to the page URL: mboxEdit=1 & mboxDisable=1.

   So, please open the website in a separate tab and append at the end the above query parameters and observe if there is any issue

   If the customer website is: www.customerwebsite.com, then open a new tab and check: www.customerwebsite.com?mboxEdit=1&mboxDisable=1

2. Mixed Content should be allowed

   In case the customer is using custom active content like JavaScript and CSS files these should be downloaded over HTTPS and not HTTP.

   Reference Document  https://experienceleague.adobe.com/docs/target/using/experiences/vec/troubleshoot-composer/mixed-content.html?lang=en

3. The webpage should be accessible within an iframe.

   You can check if the customer website supports iframe or blocks them by going to https://jsbin.com/ and paste below code and see if the customer website opens in an iframe:

   !DOCTYPE html
   html
   head
   meta charset="utf-8"
    meta name="viewport" content="width=device-width"
     titleJS Bin/title
   /head
   body
     iframe src="https://www.facebook.com" height="700" width="850" /iframe
   /body
   /html
   

   Replace facebook.com with the website URL

   There could be one or multiple iframe busting techniques used, few of which are listed below

   • X-Frame-Options header

     X-Frame-Options: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Frame-Options

     This header can be removed if needed via Requestly (Chrome Extension) as described on public the documentation:

     Reference Document: https://docs.adobe.com/content/help/en/target/using/experiences/vec/troubleshoot-composer/troubleshooting-issues-related-to-the-visual-experience-composer-vec.html

   • JS Based Iframe Busting

   This can be done through various JavaScript code.

   A basic example:

   script
   if(top != window) {
       body.style.display = none;
   }
   /script
   

   There are plenty of other JavaScript iFrame Busting techniques and can be seen the most used on this link:

   https://seclab.stanford.edu/websec/framebusting/framebust.pdf

4. Following Target JS scripts are downloaded

   • target-vec.js

   • target-vec-helper.js

5. If the DOM structure has changed there could be errors in VEC where configured modifications are not visible in VEC.

   Figure out - Selector for which action is broken: In Console, you can check using: _AT.querySelectorAll('selector')

   Reference Document for selector configuration: https://experienceleague.adobe.com/docs/target/using/experiences/vec/vec-selectors.html?lang=en#

6. Handle duplicate Ids on the page: As Target uses selectors of the page to create and deliver recommendations, so it is essential to ensure that the page is a compiant to the below points

   • Use Classes
   • Use unique attributes present in the elements
   • Check if the selector matches the Unique element
   • Remove dynamic classNames from selectors like active, selected, etc.

7. Please make sure elements are not contained within an iframe itself, as VEC loads content in an iframe so iframe within a parent iframe would not work.

Common issues:

1. Unable to log in to Online Banking in VEC to perform HTML Edit

   • Adobe Target VEC requires the VEC helper extension to load the page.

   • Allow insecure content from the site settings.

   • Set the EEC as disabled.

   • Navigate the page in VEC using the “Browse mode”

   • Click on Compose to do the changes.

2. Trigger views are not available within VEC to create modifications

   The page may be using service workers which would not allow trigger views to be available. Here are the steps to work around this scenario

   • After loading the page in VEC, make sure to disable EEC from Page Delivery, disable service workers and enable both options in the VEC Helper Extension: Inject Target Libraries and Cookies

   • Click Browse and click Accept Cookies.

   • Click in the address bar from the VEC page and press Enter so that the page refreshes properly within VEC. View names should show up including in the overlay.

   • Ensure that the Trigger views function is consistently firing on the page. Views will be available only when the trigger view function fires.

3. Unable to access authorized pages within VEC

   Access the authorized page in a browser outside VEC. Then access the page in Target, in the new browser tab of the same window

4. Unable to access the page using Shadow DOM within Target VEC

   • Ensure that the page is using the latest Target library
   • Ensure that all the web components are loaded before the page is accessed in VEC

5. Unable to accept cookies and browse the website within VEC

   Access the cookies browser outside VEC. Then access the page in Target, in the new browser tab of the same window

More common VEC issues and their resolutions are also listed here  https://experienceleague.adobe.com/docs/target/using/experiences/vec/troubleshoot-composer/troubleshoot-composer.html?lang=en

Business.Adobe.com resources