Expand my Community achievements bar.

SOLVED

Using Adobe Target within Salesforce

Avatar

Level 2

Hi there

 

I was wondering if anyone else has had any issues/success with integrating Target into Salesforce Lightning(SFL)? We are trying to run some experiments/personalisation activities within SFL but are having issues with Target being able to modify elements on the page. Target scripts load successfully, and we have successfully injected some CSS onto pages, and modified styles, however DOM manipulations are something else entirely.

 

There seems to be a lot of refreshing that happens with SFL and some sort of race condition seems to not allow Target to successfully modify the DOM. We have tried the following:

  • Tried to load a SFL page into Target VEC with no luck (iframe refreshes SFL page constantly, never allowing us to select any elements)
  • Tried targeting a HTML ID tag directly in VEC, but it doesn’t seem to have any effect on the SFL page
  • Tried using triggerView() but I guess because the SPA isn’t loading into VEC, neither is the triggerView() function firing
  • As mentioned used Target to inject CSS onto SFL page – styles were successfully changed
  • Used Target to do a redirect – this also was successful

 

If anyone has encountered any of this, and found ways around it, I’d love to hear how you managed to get Target running within SFLC

 

================================

Update - it seems the issue with Target not being able to run in SF is due to the locker service, which prevents DOM manipulation, even a simple queryselector in the browser’s console returns null for an element that obviously exists.

 

Locker service info: https://developer.salesforce.com/docs/component-library/documentation/en/lwc/security_locker_service

 

Is there any feasible way around this, that anyone can think of, or has successfully implemented?

1 Accepted Solution

Avatar

Correct answer by
Level 2

So seems like we've had a breakthrough.

Now I'm not sure if all SF configurations are the same as ours, but what seemed to work was first targeting the DIV.ui-widget element and then the element that I needed.

eg. I wanted to target a h3, so using the selector h3:eq(0) (or equivalent) in VEC didn't work, however when we targeted the h3 using DIV.ui-widget:eq(1) h3, then I was able to modify the element.

So now to try some more complex modifications and eventually an Activity.

View solution in original post

3 Replies

Avatar

Community Advisor and Adobe Champion

Hello darrenb_IV,

Answering the ask is tougher for me since I never worked on SFL.

However, why were you not able to load SPA in VEC? triggerView's purpose is to load the SPAs into VEC and it should work. Guess you are missing something there or might be I am overlooking.

Can you explain more on the triggerView() implementation using SFL? That can shed some lights for me.

Thank You, Pratheep Arun Raj B | Xerago | Terryn Winter Analytics 

Avatar

Level 2

Hi @PratheepArunRaj,

thanks for taking the time for replying. This is tricky, and unfortunately it doesn't seem as simple as implementing a triggerView(). It could also be that SFL is working with Lightning Locker (which is a Salesforce architectural layer focused on security - more in here https://resources.docs.salesforce.com/latest/latest/en-us/sfdc/pdf/communities.pdf).

The triggerView() function doesn't even get called within VEC, as the page we are trying to target just keeps on refreshing endlessly within VEC, not allowing for the page, or any DOM or functions to load correctly - hence not calling the triggerView() function.

We've had quite a few discussions with Adobe & SF devs on this, with no solution which seems achievable, hence my reach out to the community to see if anyone has had any experience in integrating these 2 platforms.

Darren

Avatar

Correct answer by
Level 2

So seems like we've had a breakthrough.

Now I'm not sure if all SF configurations are the same as ours, but what seemed to work was first targeting the DIV.ui-widget element and then the element that I needed.

eg. I wanted to target a h3, so using the selector h3:eq(0) (or equivalent) in VEC didn't work, however when we targeted the h3 using DIV.ui-widget:eq(1) h3, then I was able to modify the element.

So now to try some more complex modifications and eventually an Activity.