Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add shopper Tracks events #7268

Merged
merged 10 commits into from
Oct 9, 2023
Merged

Add shopper Tracks events #7268

merged 10 commits into from
Oct 9, 2023

Conversation

malithsen
Copy link
Member

@malithsen malithsen commented Sep 22, 2023

Fixes https://github.com/Automattic/woopay/issues/1907

Changes proposed in this Pull Request

This PR adds the following Tracks events

wcpay_cart_page_view
wcpay_product_page_view
wcpay_gpay_button_click
wcpay_apple_pay_button_click
wcpay_checkout_email_address_woopay_check
wcpay_checkout_woopay_save_my_info_tooltip_hover
wcpay_checkout_woopay_save_my_info_tooltip_learn_more_click
wcpay_checkout_woopay_save_my_info_privacy_policy_click
wcpay_checkout_save_my_info_tos_click

Testing instructions

Save My Info events

  • Add a product to the cart
  • Visit shortcode checkout page as an unregistered WooPay user.
  • Hover over the "i" tooltip in Save My Info section.
  • Click the Learn More link in the tooltip. (wcpay_checkout_woopay_save_my_info_tooltip_hover)
  • Check the save my info checkbox.
  • Click on Terms of Service and Privacy Policy links. (wcpay_checkout_save_my_info_tos_click, wcpay_checkout_woopay_save_my_info_privacy_policy_click)
  • In ~5 minutes, check MC Tracks live view and make sure above events are recorded.
  • Repeat the tests for Blocks checkout.

Payment Request Buttons

  • Click on the Google Pay button from product, cart and checkout page.
  • Click on the Apple Pay button from the product, cart and checkout page.
  • Check Tracks Live view for wcpay_gpay_button_click and wcpay_apple_pay_button_click with the relevant source property indicating the page.

Page Views

  • View the cart page.
  • View a product page.
  • Check MC Live view for wcpay_cart_page_view and wcpay_product_page_view events.

  • Run npm run changelog to add a changelog file, choose patch to leave it empty if the change is not significant. You can add multiple changelog files in one PR by running this command a few times.
  • Covered with tests (or have a good reason not to test in description ☝️)
  • Tested on mobile (or does not apply)

Post merge

@botwoo
Copy link
Collaborator

botwoo commented Sep 22, 2023

Test the build

Option 1. Jetpack Beta

  • Install and activate Jetpack Beta.
  • Use this build by searching for PR number 7268 or branch name add/shopper-tracks-events in your-test.site/wp-admin/admin.php?page=jetpack-beta&plugin=woocommerce-payments

Option 2. Jurassic Ninja - available for logged-in A12s

🚀 Launch a JN site with this branch 🚀

ℹ️ Install this Tampermonkey script to get more options.


Build info:

  • Latest commit: f718230
  • Build time: 2023-10-09 20:19:15 UTC

Note: the build is updated when a new commit is pushed to this PR.

@github-actions
Copy link
Contributor

github-actions bot commented Sep 22, 2023

Size Change: +6.14 kB (0%)

Total Size: 1.43 MB

Filename Size Change
release/woocommerce-payments/dist/blocks-checkout.js 75.2 kB +228 B (0%)
release/woocommerce-payments/dist/checkout.js 29 kB +134 B (0%)
release/woocommerce-payments/dist/index.js 284 kB +135 B (0%)
release/woocommerce-payments/dist/multi-currency-switcher-block.js 60.4 kB +126 B (0%)
release/woocommerce-payments/dist/multi-currency.js 55 kB +121 B (0%)
release/woocommerce-payments/dist/order.js 41.2 kB +124 B (0%)
release/woocommerce-payments/dist/payment-gateways.js 38.7 kB +119 B (0%)
release/woocommerce-payments/dist/payment-request.js 13.1 kB +1.39 kB (+12%) ⚠️
release/woocommerce-payments/dist/settings.js 234 kB +124 B (0%)
release/woocommerce-payments/dist/subscription-product-onboarding-modal.js 20.4 kB +121 B (+1%)
release/woocommerce-payments/dist/subscriptions-empty-state.js 19.6 kB +116 B (+1%)
release/woocommerce-payments/dist/tos.js 22 kB +124 B (+1%)
release/woocommerce-payments/dist/upe_with_deferred_intent_creation_checkout.js 37 kB +121 B (0%)
release/woocommerce-payments/dist/upe-blocks-checkout.js 40.9 kB +1.39 kB (+4%)
release/woocommerce-payments/dist/upe-split-blocks-checkout.js 42.5 kB +1.47 kB (+4%)
release/woocommerce-payments/dist/woopay-express-button.js 52.1 kB +123 B (0%)
release/woocommerce-payments/dist/woopay.js 71.8 kB +183 B (0%)
ℹ️ View Unchanged
Filename Size
release/woocommerce-payments/assets/css/admin.css 1.04 kB
release/woocommerce-payments/assets/css/success.css 158 B
release/woocommerce-payments/dist/blocks-checkout-rtl.css 1.8 kB
release/woocommerce-payments/dist/blocks-checkout.css 1.8 kB
release/woocommerce-payments/dist/checkout-rtl.css 440 B
release/woocommerce-payments/dist/checkout.css 441 B
release/woocommerce-payments/dist/index-rtl.css 36.5 kB
release/woocommerce-payments/dist/index.css 36.5 kB
release/woocommerce-payments/dist/multi-currency-analytics.js 1.05 kB
release/woocommerce-payments/dist/multi-currency-rtl.css 2.88 kB
release/woocommerce-payments/dist/multi-currency.css 2.88 kB
release/woocommerce-payments/dist/order-rtl.css 676 B
release/woocommerce-payments/dist/order.css 679 B
release/woocommerce-payments/dist/payment-gateways-rtl.css 690 B
release/woocommerce-payments/dist/payment-gateways.css 692 B
release/woocommerce-payments/dist/payment-request-rtl.css 146 B
release/woocommerce-payments/dist/payment-request.css 146 B
release/woocommerce-payments/dist/product-details.js 898 B
release/woocommerce-payments/dist/settings-rtl.css 9.04 kB
release/woocommerce-payments/dist/settings.css 9.05 kB
release/woocommerce-payments/dist/subscription-edit-page.js 669 B
release/woocommerce-payments/dist/subscription-product-onboarding-modal-rtl.css 519 B
release/woocommerce-payments/dist/subscription-product-onboarding-modal.css 519 B
release/woocommerce-payments/dist/subscription-product-onboarding-toast.js 693 B
release/woocommerce-payments/dist/subscriptions-empty-state-rtl.css 117 B
release/woocommerce-payments/dist/subscriptions-empty-state.css 117 B
release/woocommerce-payments/dist/tos-rtl.css 230 B
release/woocommerce-payments/dist/tos.css 231 B
release/woocommerce-payments/dist/upe_checkout-rtl.css 440 B
release/woocommerce-payments/dist/upe_checkout.css 441 B
release/woocommerce-payments/dist/upe_checkout.js 34.1 kB
release/woocommerce-payments/dist/upe_split_checkout-rtl.css 440 B
release/woocommerce-payments/dist/upe_split_checkout.css 441 B
release/woocommerce-payments/dist/upe_split_checkout.js 34.6 kB
release/woocommerce-payments/dist/upe-blocks-checkout-rtl.css 1.8 kB
release/woocommerce-payments/dist/upe-blocks-checkout.css 1.8 kB
release/woocommerce-payments/dist/upe-split-blocks-checkout-rtl.css 1.8 kB
release/woocommerce-payments/dist/upe-split-blocks-checkout.css 1.8 kB
release/woocommerce-payments/dist/woopay-express-button-rtl.css 146 B
release/woocommerce-payments/dist/woopay-express-button.css 146 B
release/woocommerce-payments/dist/woopay-rtl.css 3.85 kB
release/woocommerce-payments/dist/woopay.css 3.85 kB
release/woocommerce-payments/includes/subscriptions/assets/css/plugin-page.css 622 B
release/woocommerce-payments/includes/subscriptions/assets/js/plugin-page.js 814 B
release/woocommerce-payments/vendor/automattic/jetpack-assets/build/i18n-loader.js 2.43 kB
release/woocommerce-payments/vendor/automattic/jetpack-assets/src/js/i18n-loader.js 1.01 kB
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/tracks-ajax.js 522 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/tracks-callables.js 581 B
release/woocommerce-payments/vendor/automattic/jetpack-identity-crisis/babel.config.js 160 B
release/woocommerce-payments/vendor/automattic/jetpack-identity-crisis/build/index.css 2.32 kB
release/woocommerce-payments/vendor/automattic/jetpack-identity-crisis/build/index.js 13.8 kB
release/woocommerce-payments/vendor/automattic/jetpack-identity-crisis/build/index.rtl.css 2.32 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/about.css 1.2 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/admin-empty-state.css 291 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/admin-order-statuses.css 403 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/admin.css 3.56 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/checkout.css 299 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/modal.css 742 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/view-subscription.css 572 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/wcs-upgrade.css 411 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/admin-pointers.js 544 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/admin.js 9.63 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/jstz.js 6.8 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/jstz.min.js 3.83 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/meta-boxes-coupon.js 544 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/meta-boxes-subscription.js 2.38 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/moment.js 22.1 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/moment.min.js 11.6 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/payment-method-restrictions.js 1.29 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/wcs-meta-boxes-order.js 502 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/frontend/payment-methods.js 355 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/frontend/single-product.js 429 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/frontend/view-subscription.js 1.38 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/frontend/wcs-cart.js 781 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/modal.js 1.1 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/wcs-upgrade.js 1.27 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/build/index.css 392 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/build/index.js 3.05 kB

compressed-size-action

@malithsen malithsen marked this pull request as ready for review October 4, 2023 20:08
@malithsen malithsen requested review from a team and alefesouza and removed request for a team October 4, 2023 20:08
Comment on lines 56 to 63
const onPaymentRequestButtonClick = () => {
console.log( 'clicked' );
onButtonClick();
};

return (
<PaymentRequestButtonElement
onClick={ onButtonClick }
onClick={ onPaymentRequestButtonClick }
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This looks like debug code.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🤦 Thanks for catching that!
I had some uncommitted changes. To test them please follow instructions under "Payment Request Buttons" on the Blocks checkout page.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@alefesouza I am requesting another review due to the above changes :)

Copy link
Member

@alefesouza alefesouza left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code looks good and events are emitted as expected, just a minor change for a code that probably should not be committed.

@malithsen malithsen requested a review from alefesouza October 6, 2023 17:07
@malithsen malithsen enabled auto-merge October 6, 2023 17:08
@malithsen malithsen disabled auto-merge October 6, 2023 17:08
Copy link
Member

@alefesouza alefesouza left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM, it worth mentioning that the event emitted on Google Pay click is wcpay_googlepay_button_click, not ´ wcpay_gpay_button_click´ as seen on the PR description.

@malithsen
Copy link
Member Author

Thanks @alefesouza fixed the event name in 0287dc7

@malithsen malithsen enabled auto-merge October 9, 2023 20:13
@malithsen malithsen added this pull request to the merge queue Oct 9, 2023
Merged via the queue into develop with commit 0620455 Oct 9, 2023
27 checks passed
@malithsen malithsen deleted the add/shopper-tracks-events branch October 9, 2023 20:46
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants