Amphtml: amp-form: add amp-form-submit analytics event

[Jeiwan]

Hi,

I'd like to add amp-form-submit analytics event to amp-form component. The event would be triggered before a form is submitted and would allow to track form submissions (including form fields and values) in amp-analytics. Currently, there are amp-form-submit-success and amp-form-submit-error events, but they're triggered after a form was submitted and only when XHR POST method is used. So with these events it's not possible to track form submissions that reload a page (non-XHR GET).

The event would generate variables that reflect form fields, for example for the form:

<form method="GET" action="/search" id="search_form">
  <input type="text" name="query">
  <input type="submit" value="Search">
</form>

the following variables will be generated: formId and formFields[query]. These variable can be used is amp-analytics like so:

"requests": {"form_submit": "${basePrefix}/form_submit?formId=${formId}&query=${formFields[query]}"}

[aghassemi]

/to @dvoytenko
/cc @rudygalfi

[Jeiwan]

Regarding the 'Category: Analytics' tag, the issue is more about amp-form, there's nothing to modify in amp-analytics extension. Actually I already have this feature implemented, the main change is in the submit_ function: https://github.com/Jeiwan/amphtml/blob/formsubmit_analytics/extensions/amp-form/0.1/amp-form.js#L278

[jridgewell]

Yup, I think this goes to @aghassemi to implement.

[aghassemi]

@Jeiwan Would you be interested in submitting a PR for this given you have already made the effort to implement it? We would love to have external contributors work on core features like this.

[Jeiwan]

Yes, I'll submit a PR tomorrow.

[Jeiwan]

Here's the PR: https://github.com/ampproject/amphtml/pull/8212