Forms Not Submittable in Firefox

[svamann]

We host our website in Content Hub and use HubSpot Forms. The forms embedded on our website are not submittable (they show all right, but when clicking on the button nothing happens) in Firefox, when the browser is set to Strict Privacy Mode (or some extension enables a similar setting). Is this a known issue? Can we do something to work around this?

Possibly related to: https://community.hubspot.com/t5/Blog-Website-Page-Publishing/CTA-Popup-form-not-working-on-Firefox-...

[Jnix284 · Accepted solution]

@svamann this is a "functional" cookie issue, because Firefox is in Strict Privacy Mode, it is preventing functionality of the website from performing as expected. The user would need to change their settings to resolve the issue or you would need to change from a button to a plain text link for these users.

[Jnix284 · Accepted solution]

Hi @svamann the community team monitors posts to make sure answers are accepted to help others who might have the same questions, not everyone comes back to accept the solution on their own.

After considerably more digging and testing with Firefox, attempting to modify the submit button on the form to a plain text version still doesn't prevent the browser from blocking it. The one thing you could do is have a developer write code that detects the Firefox browser and serves a message that says functionality is blocked and provide them with an alternative option to contact you.

I also tested non-hubspot forms and ran into similar issues, this is pretty conclusively a Firefox issue and not directly related to HubSpot or something that I think could be resolved natively within HubSpot forms - their engineers would know better, you can submit an idea here if support for Strict Privacy Mode is required.

[svamann · Accepted solution]

We now added a script to our website, that shows a warning on forms, if the user is in Firefox with scrict privacy settings. In case anyone want's to do the same, here's the script:

// Detect if the user is using Firefox
const isFirefox = navigator.userAgent.includes("Firefox");

// Function to check if strict privacy settings are likely enabled
function checkStrictMode() {
  if (isFirefox) {
    const script = document.createElement('script');
    script.src='https://js.hubspot.com/web-interactives-embed.js'; // try to load a small, valid, external JS file. Strict mode will supress this.

    script.onload = () => {
      console.log("JavaScript file loaded successfully.");
    };

    script.onerror = () => {
        document.querySelectorAll('.hs_cos_wrapper_type_form').forEach(form => {
            // Create a new div for the warning
            const warningElement = document.createElement('div');
            warningElement.className = 'content__form-firefox-warning';
            warningElement.innerHTML = "<div class='text:md weight:regular'>It seems you're using Firefox with strict privacy settings. To be able to submit this form, please adjust your privacy settings or use a different browser. Sorry for the inconvenience!</div>";

            // Insert the warning before the form
            form.parentNode.insertBefore(warningElement, form);
        });

      console.log("It seems you're using Firefox with strict privacy settings. To be able to submit this form, please adjust your privacy settings or use a different browser. Sorry for the inconvenience!It seems you're using Firefox on Mac with strict privacy settings. Please adjust your settings or use a different browser for the form to work correctly.");
    };

    document.head.appendChild(script);
  }
}

checkStrictMode();

[svamann · Accepted solution]

We now added a script to our website, that shows a warning on forms, if the user is in Firefox with scrict privacy settings. In case anyone want's to do the same, here's the script:

// Detect if the user is using Firefox
const isFirefox = navigator.userAgent.includes("Firefox");

// Function to check if strict privacy settings are likely enabled
function checkStrictMode() {
  if (isFirefox) {
    const script = document.createElement('script');
    script.src='https://js.hubspot.com/web-interactives-embed.js'; // try to load a small, valid, external JS file. Strict mode will supress this.

    script.onload = () => {
      console.log("JavaScript file loaded successfully.");
    };

    script.onerror = () => {
        document.querySelectorAll('.hs_cos_wrapper_type_form').forEach(form => {
            // Create a new div for the warning
            const warningElement = document.createElement('div');
            warningElement.className = 'content__form-firefox-warning';
            warningElement.innerHTML = "<div class='text:md weight:regular'>It seems you're using Firefox with strict privacy settings. To be able to submit this form, please adjust your privacy settings or use a different browser. Sorry for the inconvenience!</div>";

            // Insert the warning before the form
            form.parentNode.insertBefore(warningElement, form);
        });

      console.log("It seems you're using Firefox with strict privacy settings. To be able to submit this form, please adjust your privacy settings or use a different browser. Sorry for the inconvenience!It seems you're using Firefox on Mac with strict privacy settings. Please adjust your settings or use a different browser for the form to work correctly.");
    };

    document.head.appendChild(script);
  }
}

checkStrictMode();

[StackitColin · Accepted solution]

This is great, thank you!

For folks looking to do this, note you need to add a <script> tag at the top, and </script> at the end.

[Jnix284 · Accepted solution]

@svamann this is a "functional" cookie issue, because Firefox is in Strict Privacy Mode, it is preventing functionality of the website from performing as expected. The user would need to change their settings to resolve the issue or you would need to change from a button to a plain text link for these users.

[svamann]

It's a bit weird that someone else accepts an answer to my question as the solution before I even have the chance to read the response... 😅

Anyways, thanks for the input. What would using a link (vs. a button) change? And can I do this with HubSpot forms? Would appreciate a pointer to how to do this, then I'd even agree your response solved my question 😉

[Jnix284 · Accepted solution]

Hi @svamann the community team monitors posts to make sure answers are accepted to help others who might have the same questions, not everyone comes back to accept the solution on their own.

After considerably more digging and testing with Firefox, attempting to modify the submit button on the form to a plain text version still doesn't prevent the browser from blocking it. The one thing you could do is have a developer write code that detects the Firefox browser and serves a message that says functionality is blocked and provide them with an alternative option to contact you.

I also tested non-hubspot forms and ran into similar issues, this is pretty conclusively a Firefox issue and not directly related to HubSpot or something that I think could be resolved natively within HubSpot forms - their engineers would know better, you can submit an idea here if support for Strict Privacy Mode is required.

[svamann]

I appreciate you all being so active in this community. Makes one feel heard.

And thanks for delving into this even deeper. The idea with inserting a marker for Firefox users came up on our end as well, guess this is what we'll end up doing.