#7379784 Experiment: Upsell screen in Jetpack purchase flow

Changes proposed in this Pull Request

This PR implements a new screen to upsell Jetpack products, as an A/B test. This new screen will appear:

• Between the pricing page and the checkout page
• Only if a user selects Backup, Scan, or Antispam (the upsold product is Security)

Context: pbNhbs-2pq-p2

This PR implements all the logic for this experiment and new page. The design of the page is handled in #64329.

Implementation notes

• This new page has a dedicated URL, depending on where the user is seeing the landing page from:
  • cloud.jetpack.com/pricing/upsell/:product/:site?
  • wordpress.com/pricing/upsell/:product/:site?
  • wordpress.com/jetpack/connect/store/upsell/:product
  • wordpress.com/jetpack/connect/plans/upsell/:product/:site
• Name of the experiment: calypso_jetpack_upsell_page_2022_06

Testing instructions

Note: clicking the close button in the checkout page should redirect you to the pricing page (passed in the checkoutBackUrl query param). This doesn’t work as expected, and should be addressed in a separate PR.

Prerequisites

• Make sure you have a site connected to Jetpack with no subscriptions
• Check for JS errors in the console

Regression testing

• If you’ve tested this PR before, make sure to delete the explat-experiment--jetpack_upsell_page_2022_05 key in your local storage, or assign yourself to the control variation in the experiment tool.
• In Calypso blue, visit /plans/:site
• Select a product, and make sure you’re directed to the checkout page with the product in the cart
• Repeat the same operation with a couple more products
• Visit /plans/upsell/jetpack_backup_t1_yearly/:site: you should be redirected to the pricing page (you might briefly see the upsell page flash, but that’s acceptable since we’ll eventually keep or get rid of the page definitively)

Upsell screen

• Assign yourself to the treatment variation
• Calypso pricing page:
  • Visit /plans/:site
  • Check that selecting Backup, Scan, or Anti-spam in the pricing page leads you to the upsell page
  • In the upsell page:
    • Check that the copy makes sense
    • Check that the price difference is accurate
    • Check that both links do what they advertise
    • Refresh the page, and verify that you see the same information
  • Check that selecting another product (than the 3 mentioned above) in the pricing page leads you directly to the checkout page
  • Visit /plans/upsell/jetpack_complete/:site, and check that you’re redirected to the checkout page
• Calypso connect page:
  • Visit /jetpack/connect/store
  • Repeat the aforementioned steps
  • Visit /jetpack/connect/plans/:site
  • Repeat the same steps
• Cloud pricing page:
  • Visit /pricing
  • Repeat the aforementioned steps
  • Visit /pricing/:site
  • Repeat the same steps