Creating Test on pages with React js | Community
Skip to main content
Ridder_M
Ridder_M
New Participant
March 31, 2016
Solved

Creating Test on pages with React js

  • March 31, 2016
  • 15 replies
  • 16877 views

Hello,

I'm trying to create a test on a page that is built using React.js and although I can see the changes in the VEC, when running the test, the changes are not shown.  I did saw in one instance that the image flickered, then it displayed the original content.

I've attached an image of what the VEC editor shows, which is not consistent to what is shown on the page.  I tried troubleshooting it and didn't see any errors.  Any help will be greatly appreciated.

Thanks,

Ridder H. Manzanet

    This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
    Best answer by dwright-adobe

    Ok, good luck to you!  I would really encourage you to drop the legacy integration and move to A4T.  Not only are the capabilities much better with the integration, but it would allow you to upgrade to at.js.  Since A4T uses server side calls from Target to Analytics, you don't have to be as concerned about the sequencing of client-side hits to make sure the integration data gets sent to Analytics which can get very tricky in SPAs.

    15 replies

    Show previous replies
    D
    dwright-adobeAccepted solution
    Employee
    April 8, 2016

    Ok, good luck to you!  I would really encourage you to drop the legacy integration and move to A4T.  Not only are the capabilities much better with the integration, but it would allow you to upgrade to at.js.  Since A4T uses server side calls from Target to Analytics, you don't have to be as concerned about the sequencing of client-side hits to make sure the integration data gets sent to Analytics which can get very tricky in SPAs.

    Ridder_M
    Ridder_MAuthor
    New Participant
    April 6, 2016

    Hi Daniel,

    So here's what's interesting: VEC works when changing text on elements that are in the react class, which renders when I load the test page.  What its failing to do is add new elements.  I did looked at migrating to at.js, but it doesn't support SC/Target integration, which is something that we have.  For now, I'm trying to find a solution working with the mbox.js file.

    Thanks,

    Ridder

    D
    dwright-adobe
    Employee
    April 4, 2016

    Hi Ridder,

    I don't see the mbox div getting written to the DOM at all.  Maybe React's virtual dom doesn't allow it?  Try at.js--which doesn't add a div to the DOM for the global mbox to work--and let us know if you get better results.

    Daniel

    Ridder_M
    Ridder_MAuthor
    New Participant
    April 4, 2016

    Thanks for the reply and I'll keep in mind switching to the at.js.  As for the activity in question, I had the test deactivated, but I went ahead the activated it again.  Feel free to look at the activity and provide any feedback.

    Thanks,

    Ridder H. Manzanet  

    D
    dwright-adobe
    Employee
    April 4, 2016

    Ridder,

    I see you are using mbox.js.  You should consider using our new library at.js.  It's in First Look status right now and is scheduled for release later this month.  You can download it now via API (search Help for at.js).  We are developing extensions for at.js to tie into different SPA frameworks.  We have several for AngularJS which we developed for the at.js beta participants and are working on React currently.  When complete, they will be posted to the at.js extension github repository.  I would check back there in a few weeks.  These extensions will give you options for deploying mboxes.

    Regarding your VEC issues, I don't actually see a test being delivered to your http://test.manzanet.us/account.html?qa=testA URL, so it's likely there is something off in your targeting of the activity.

    Terms & ConditionsAccessibility statement

    Loading footer...