Smart Lists not updating in Safari / ios.

[heytricia]

I'm using smart content and lists to update card status and gate posts here: https://www.calibermind.com/revenue-marketing-report/cdp-playbook.

If a user is not on our list, the cards are noted as locked, and a form pops up. Once a user submits the form, they're added to a smart list - and in future views smart content does not include the card locks or form again. This works across all browsers, except Safari. 

When testing in Safari on Mac, iPad or IPhone, email addresses entered via the form are not added to the smart list. Has anyone else noticed this? I'm not sure how HubSpot tracks a user across pages and knows they're on a list - I'm guessing something like cookies? Is Safari not allowing this?

[kestrada]

Hi there @heytricia,

I tested this link on Mac and  Microsoft to check what the behavior was.

I can confirm that in both cases I was able to create two contacts:

1. kira.anleu created using Microsoft

2. kestradada created using Mac

I checked the contacts and number one is part of 8 lists whereas the second one is part of 10 lists. Are the two lists that the second contact doesn´t show the ones that you had identified in your query? If so can you please check that also contact one meets the criteria of the same 10 lists.

I hope this helps us get closer to what may be happening here.

[heytricia]

When I check the list built with the form for this view, I do see two contacts with the names you've listed. 

I also submitted a ticket yesterday and received feedback this morning confirming the behavior I was seeing and asking for more input. So I'm under the impression they're still working on this. 

Are you saying you submitted the forms via Safari or iOS? 

[kestrada]

Yes, @heytricia  I had tested it on Mac using Safari.

I was wondering, how did you create the pop-up form as I couldn´t find it within your portal. Are you using APIs to create them? If so, which one? 

If you are using APIs I would highly recommend you that you pass this information on your current ticket open with Support as this will allow them to look into this further.

Regards,

Kira

[heytricia]

@kestrada    Given your note that you had tested in Safari, I tested again. I tried with two different emails, and neither one was added to the RMR Playbook list. Could it be you had already added your email to the list via another browser? I just deleted the test addresses from the list, so you can re-use them within a Safari browser.

Thanks!

[lscanlan]

Hi @heytricia,

I just wanted to chime in here as well. I've been looking into this issue with Patrice, who you've got a Support ticket going with. It sounds like commenting out those Slack scripts didn't resolve things, so I'll keep looking into what's preventing the form submission in Safari.

For what it's worth, I've gone through your setup and I understand how everything is set up. The smart rule based on list membership determines whether the form is added to the page. And then your JS is checking to see if the form element is on the page, and gating the content if it is. It's a clever setup and the code is clean and readable, which definitely helps with the troubleshooting.

I compared the page in Chrome using Chrome's developer tools to the page in Safari using Safari's developer tools. The difference I noticed is that the form submission just isn't going through in Safari. In Chrome you can see the XHR request to the HubSpot form submission URL. But you don't see that happening in Safari. In fact, there's a cancelled request in Safari. I suggested commenting out those Slack URLs because I noticed an error in Safari related to them that I hadn't seen in Chrome, so my hope was that that was causing the issue here. And it seems like smart content based on list membership is working in Safari. I've done some testing in a simper setup, and I haven't run into issues. So really, I think the goal here is to figure out what's preventing the submission in Safari. I'll run some testing on my end to see if I can pinpoint what it is. In my experience, it's a little more difficult to test things like this in Safari, but I think we'll be able to understand what's preventing the submission in Safari. So I just wanted to add an update here as well.

[heytricia]

Thank you @lscanlan . 

We did comment out the clearbit / slack scripts and tested again, but no luck. I've added info to our ticket outlining where these scripts are added should your team need to know this as you continue to troubleshoot. 

Safari is, indeed, more difficult to work with... it just doesn't seem to like combining the form's smart logic with the onFormSubmit events. 

Thanks again!

[heytricia]

We resolved this - sort of. We noticed that submissions within post views DID add to our Smart List - it was submissions within page / list views that did not. So we kept the functionality to update card locks for list views, but removed the script to pop the form and let the form on post views do the capturing.

I'm thinking the conflict had to be with the onFormSubmit function that I used to direct users to the correct URL based on the card they clicked. Why this one function would conflict with form submission - and only in Safari - is beyond me. 

End result is we worked around the issue - but it still exists.

[heytricia]

That's one of the question support has asked as well. Within the page template, there is a noted custom module included named "Global Plays Gateway Form." Here is a screenshot of the module within Design Manager. I left notes for clarity - and to help me remember what we're doing long term.

So to add / edit the form, you would use the "Edit global and smart content" button - which opens a rich text editor. 

Within the default view (for users who are not on our list), I added the form as an embed. To view the embedded code you have to use Advanced > Source Code. If you view the code, you'll see I did add onSubmit functionality to work with scripts included on our js file. Here is the code with IDs removed. 

<h6>Unlock the Playbook</h6>
<p>Enter your email address to unlock The Playbook by CaliberMind.</p>
<script type="text/javascript" src="//js.hsforms.net/forms/v2.js" charset="utf-8"></script>
<script data-hubspot-rendered="true">// <![CDATA[
hbspt.forms.create({
    portalId: "xxxx",
    formId: "xxxx",
    onFormSubmit: function($form) {
      // if RMR page view, redirect to selected card url
      if ( $( 'body.hs-site-page .recent-plays-posts' ).length ) {
        var target = $( 'body' ).attr( 'data-form-target' );
        // close lightbox to prevent form message flash
        $( '#plays-lightbox' ).removeClass( 'takeover' );
        window.location = target;
      }
      // if other view, i.e single-post, close the lightbox
      else {
        $( '#plays-lightbox' ).removeClass( 'takeover' );
        $( 'body' ).removeClass( 'freeze' );
      } 
    } 
  });
// ]]></script>

If we're in a list view, we need to dynamically assign a redirect url. Our js populates the data attr for the body tag based on the url of the card that is clicked. So that's what the first part of the onSubmit function is looking for. If a user is already on a post, we just remove the popup and allow the user to view the post.

Hope this helps... and thanks for being on this! We need the analytics for this - and need a good user experience for Safari users.