Add GA4 form tracker and section value to survey banner

[AshGDS]

What

• Adds the section value to the GA4 object for the survey banner events, with the value of section being the survey's heading text.
• Adds the GA4 form tracker to the email survey banner to track submitting the form.
• Adds a form_complete event using Ga4AutoTracker when the survey is sent to the user. This adds a <span> to the DOM with GA4 auto on it, rather than adding GA4 code to surveys.js. I thought this would be better as it prevents us adding a bunch of GA4 code in static which checks if GA4 modules exists, if cookie consent exists, and then more code to push the event. Instead we add a <span> with the auto tracker on it, then run window.GOVUK.Modules.start().

Why

• I missed out some tracking requirements in https://trello.com/c/udF07C9O/662-banners-survey-banner-element-visibility-navigation-close-user-interaction-and-form-events

How to test

• Run a local version of static with this branch checked out
• In surveys.js go to the function isSurveyToBeDisplayed and set it to just return true, e.g.:

 isSurveyToBeDisplayed: function (survey) { return true }

• In gem_base.html.erb, add the HTML element somewhere:

<div id="user-satisfaction-survey-container"></div>

[andysellick]

This looks good but I'm wondering if we should think about our modules in this context a bit more. This isn't a criticism of the work you've done here, more something maybe for us to think about in general.

It feels slightly clumsy to create an element, attach attributes to it, then call start modules on it, when perhaps we could be calling the module directly and just pass it what it needs? Maybe a bit more like we do when we run tests...

var attributes = { 'ga4': 'attributes' }
var module = new GOVUK.Modules.Ga4AutoTracker({ attributes: attributes })
module.init()

[AshGDS]

Thanks @andysellick - that's a good idea, I think we should implement that 👍