Firefox don't apply encoding after form redirect

Hello, my forms are working but there is an issue with Firefox.

When redirecting, Netlify injects a script tag with data from the submitted form just after <head> causing Firefox to show this error (console):

The character encoding declaration of document was found too late for it to take effect. The encoding declaration needs to be moved to be within the first 1024 bytes of the file.

Which causes encoding issues in my site.

Is there anything that can be done in my end?

Could Netlify inject the (useful) script tag before </head> to prevent such issues?

Thanks for the attention.

Hi @marcosmesser,

Can you tell me which script tag it is that you’re saying we are injecting? We don’t inject a script tag in to your code when you using forms. If you can provide a link and/or screen shots that would be useful.

Hello @futuregerald,

I just tested it, the tag below is added just after opening <head> in the the page listed in the action attribute (I’ve redacted some identifying information, but left the ids):

<script>var FormSubmission = {"title":"test","email":"test@test.com","name":"test","first_name":"test","last_name":null,"company":null,"summary":"\u003cstrong\u003etest\u003c/strong\u003e test","body":"test","data":{"name":"test","email":"test@test.com","_subject":"...","message":"test","ip":"...","user_agent":"...","referrer":"..."},"created_at":"2019-07-25T20:11:03.389Z","human_fields":{"Name":"test","Email":"test@test.com","Subject":"...","Message":"test"},"ordered_human_fields":[{"title":"Name","name":"name","value":"test"},{"title":"Email","name":"email","value":"test@test.com"},{"title":"Subject","name":"_subject","value":""},{"title":"Message","name":"message","value":"test"}],"id":"5d3a0cd76dc9d872e783632d","form_id":"5d38a75e1500b1000794665a","site_url":"...","form_name":"..."};</script>

Thanks @marcosmesser, I wasn’t sure which script injection you were referring to. Can you link me to your site so that I can test this and have a repro case for the request I need to file.

Sorry for the late reply, I had a few days off.

You can try this one: Consultoria Acadêmica | Formação Global

(I am aware of the accessibility shortcomings.)

But any form with more than 5 input fields might give the same issue.

Thanks @marcosmesser. I got an issue filed. We’ll let you know once we know more. Note that this shouldn’t actually prevent your site from working though.

Hi @futuregerald , I encountered the exact same issue here:

Has there been any update on that issue?

Best regards,
Andreas

Sorry, but no. As promised, we’ll update this thread if anything changes.

@fool Thank you for the information. Is there maybe a hidden setting in the netlify.toml to disable the injection of the <script> tag?

Hi @ndee, currently there isn’t, but you may be able to remove it dynamically with javascript using something like this:

 const e = document.getElementsByTagName('script')[0]; 
 e.parentNode.removeChild(element);

Looks to me like this is causing issues to those nice Web We Want folks too.

Some discussion in their issues:

1 Like

I have the same problem here.

A solution would be great!

hi chaollin,

thanks for letting us know about this! I understand that it is pretty frustrating, but I have no news for you on when we might implement a fix for this I’m afraid.

Hey everyone, @choallin, @ndee and @marcosmesser,

We have some news we’re excited to share. Thanks to some diligent work, we’ve been able to amend this behaviour and we’ve changed the way this works. The code change has already been deployed :tada:

Please let us know if you still have issues with this, let us know. Thanks for helping us make our products work even better for you & for your patience as we worked to roll this out. :muscle: