Contact Form: add a CRM Connection setting

[kbrown9]

Changes proposed in this Pull Request:

• Add a CRM Connection setting to the Advanced section in the Contact Form block sidebar. The setting will allow the user to enable and disable the form's integration with a CRM.

Jetpack product discussion

• pbhBOz-b7-p2

Does this pull request change what data or activity we track or use?

• No.

Testing instructions:

Test Site

1. Install, activate, and connect this branch.
2. Create a post, add a Jetpack form block, and publish the post. The form must have an email field.

Test with CRM <v3.0.19 (no form integration is available)

3. Install Jetpack CRM v3.0.18. (don't activate yet).
4. Navigate to the post created above. Navigate to the form sidebar and open the CRM Integration section. Confirm that it suggests that you update the CRM plugin.
5. Activate Jetpack CRM.
6. Navigate to CRM -> Manage Extensions. Activate the Jetpack Form extension, which is found at the bottom of the page, in the Core Modules section.
7. Navigate to the post created above. Navigate to the form sidebar and open the CRM Integration section. Confirm that it suggests that you update the CRM plugin.
8. Navigate to the form post. Fill out the form and submit it.
9. Navigate to wp-admin -> Feedback and confirm that the form submission is displayed.
10. Confirm that no errors were generated in the console and debug.log.

Test with CRM v4.0 (form integration is available)

11. Install Jetpack CRM v4.0. (don't activate yet)
12. Navigate to the post created above. Navigate to the form sidebar and open the CRM Integration section. Confirm that it suggests that you activate the CRM plugin.
13. Activate Jetpack CRM.
14. Navigate to CRM -> Manage Extensions. Activate the Jetpack Form extension, which is found at the bottom of the page, in the Core Modules section.
15. Navigate to the post created above. Navigate to the form sidebar and open the CRM Integration section. Confirm that it informs you that the form can be integrated with the CRM.
16. Navigate to the form post. Fill out the form and submit it.
17. Navigate to wp-admin -> Feedback and confirm that the form submission is displayed.
18. Navigate to CRM -> contacts. Confirm that a new contact was created with the email address that you submitted.
19. Confirm that no errors were generated in the console and debug.log.

Test with Jetpack CRM PR 756

20. Install and activate the Jetpack CRM branch in PR 756.
21. Manually change the Jetpack CRM plugin version so something greater than 4.0.
22. Navigate to CRM -> Manage Extensions. Activate the Jetpack Form extension, which is found at the bottom of the page, in the Core Modules section.

Test with the toggle switch on.

23. Navigate to the post created above. Navigate to the form sidebar and open the CRM Integration section. Confirm that it informs you that the form can be integrated with the CRM. Also, a toggle switch should be displayed, and it should default to 'on'.
24. Navigate to the form post. Fill out the form and submit it.
25. Navigate to wp-admin -> Feedback and confirm that the form submission is displayed.
26. Navigate to CRM -> contacts. Confirm that a new contact was created with the email address that you submitted.

Test with the toggle switch off.

27. Navigate to the post created above. Navigate to the form sidebar and open the CRM Integration section. Turn the toggle switch off.
28. Navigate to the form post. Fill out the form and submit it.
29. Navigate to wp-admin -> Feedback and confirm that the form submission is displayed.
30. Navigate to CRM -> contacts. Confirm that a new contact was not created for the email address that you submitted.
31. Confirm that no errors were generated in the console and debug.log.

Proposed changelog entry for your changes:

• tbd

[test-case-reminder]

Here are some suggested test cases for this PR.

Contact Form

• Publish a post with default form block
• Edit a post that includes a block that was created with a previous version of the plugin
• Submit a form via frontend using form block
• Check different predefined form types
• Verify it renders as expected in both non-AMP and AMP views
• Check in mobile view
• Check in a older version of WordPress
• Check with the Gutenberg plugin
• Check without the Gutenberg plugin
• Check in IE11

If you think that suggestions should be improved please edit the configuration file here. You can also modify/add test-suites to be used in the configuration file.

[jetpackbot]

Thank you for the great PR description!

When this PR is ready for review, please apply the [Status] Needs Review label. If you are an a11n, please have someone from your team review the code if possible. The Jetpack team will also review this PR and merge it to be included in the next Jetpack release.

E2E results is available here (for debugging purposes): https://jetpack-e2e-dashboard.herokuapp.com/pr-16519

Scheduled Jetpack release: August 4, 2020.
Scheduled code freeze: July 28, 2020

Generated by 🚫 dangerJS against d43f92a

[dereksmart]

Tested all 3 scenarios, and works as expected.

For the future, we should re-visit this text when the extension is active. It made me feel like I needed to activate it, though it already was. Also the spacing at the top seems off

Tested the toggle both on and off - confirmed intended behavior.

@jeherve FYY I asked Avengers to test it out, but they don't have the bandwidth to do it before code freeze and said they'd be on the lookout to test in the beta.

[matticbot]

Caution: This PR has changes that must be merged to WordPress.com
Hello kbrown9! These changes need to be synced to WordPress.com - If you 're an a11n, please commandeer and confirm D46945-code works as expected before merging this PR. Once this PR is merged, please commit the changes to WP.com. Thank you!
This revision will be updated with each commit to this PR

[jeherve]

r211436-wpcom