Donations: Save fallback for non-frontend contexts #17381

mmtr · 2020-10-05T16:00:08Z

Fixes #17358
Fixes 241-gh-dotcom-manage
Fixes #17359

Changes proposed in this Pull Request:

This PR continues the work initiated in #17256 and adapts the Donations block so the save function is used as a proper fallback for non-frontend contexts while render_callback is used for augmenting the content dynamically for frontend contexts.

The block saves now a fallback output into the post content. That fallback includes a textual call-to-action linking to the post so folks can donate from the website.
The block also sets a render callback that augments the UI with working donate buttons.

Jetpack product discussion

N/A.

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

No.

Testing instructions:

Web

Spin up a JN site running master.
Set up Jetpack and start for free.
You need to sandbox the WP.com store now:
- Edit your /etc/hosts file and point public-api.wordpress.com and subscribe.wordpress.com to your WP.com sandbox IP.
- Go to WP Admin > Settings > Jetpack Constants and enter your WP.com sandbox address in JETPACK__SANDBOX_DOMAIN.
- Add the code below to /wp-content/mu-plugins/0-sandbox.php in your WP.com sandbox:

define( 'USE_STORE_SANDBOX', true );
define( 'USE_BILLING_SANDBOX', true );
define( 'BILLINGDADDY_SANDBOX', rtrim( 'https://' . `hostname` ) );

Purchase a Jetpack Security plan.
Go to WP Admin > Posts > Add new.
Insert a Donations block.
Connect to Stripe.
Publish the post.
Go to WP Admin > Jetpack > Jetpack Beta.
Switch to the branch of this PR (update/donations-fallback).
Visit the frontend of the post you published before.
Make sure there are no regressions in the Donations block.
Go to WP Admin > Posts.
Edit the post you published before.
Make sure there are no regressions in the Donations block.
Open the "More" menu and activate the "Code editor" view.
Make sure the HTML markup is the fallback output (the one with a link to the post).

Switch back to the "Visual editor" view.
Click on the "Update" button.
Visit the frontend of the post.
Make sure the augmented UI is displayed (the one with a working donate button).

API

Go to the WP.com API console.
Make a GET request to /sites/:site/posts/:post-id (where :post-id is the ID of a post that contains a Donations block).
Make sure the post content uses the fallback.

Email, notifications, and reader (only testable in WP.com)

Apply D51410-code to your WP.com sandbox.
Sandbox a WP.com site under a paid plan.
Go to https://wordpress.com/following/manage.
Make sure to follow the site you sandboxed above.
Enable the "Notify me of new posts" option.

Go to https://wordpress.com/post.
Select the site you sandboxed above.
Publish a post that contains a "Donations" block.
Grab the IDs of the post and the site where the post has been published.
In a WP.com sandbox run php ./bin/subscriptions/send.php <BLOG_ID> post <POST_ID> <YOUR_EMAIL>.
Check the email received and make sure it contains the fallback link.

Open the masterbar notifications.
Make sure it includes the fallback link.

Go to Reader.
Open the post you just published above.
Make sure it includes the fallback link.

Proposed changelog entry for your changes:

Donations: Save fallback for non-frontend contexts

jetpackbot · 2020-10-05T16:25:08Z

Scheduled Jetpack release: November 10, 2020.
Scheduled code freeze: November 3, 2020

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

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.

Generated by 🚫 dangerJS against 4030797

blackjackkent · 2020-10-12T20:18:19Z

Is there anything to look at here at this point? (It's listed in the "Needs Review" column but it doesn't look like there's anything testing-wise here right now.)

mmtr · 2020-10-13T10:35:02Z

Is there anything to look at here at this point? (It's listed in the "Needs Review" column but it doesn't look like there's anything testing-wise here right now.)

Nope, that's why I added the "[Status] In Progress" label 🙂. I usually add all the PRs I work on to our board as per our Team Board guidelines (PaYKcK-w0-p2).

Working on something? Assign the PR to the project, and move the PR into Needs Review.

matticbot · 2020-10-19T15:40:34Z

Caution: This PR has changes that must be merged to WordPress.com
Hello mmtr! These changes need to be synced to WordPress.com - If you 're an a11n, please commandeer and confirm D51410-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

mmtr · 2020-10-19T15:42:13Z

extensions/blocks/donations/donations.php

@@ -26,6 +26,63 @@ function register_block() {
 		array(
 			'render_callback' => __NAMESPACE__ . '\render_block',
 			'plan_check'      => true,
+			'attributes'      => array(


Block attributes need to be defined server-side because default values of attributes defined client-side are not available in render_callback.

See WordPress/gutenberg#7342 or WordPress/gutenberg#22491

mmtr · 2020-10-20T16:49:04Z

class-jetpack-currencies.php

+	/**
+	 * Currencies definition
+	 */
+	const CURRENCIES = array(


For folks reviewing, this has been moved from Jetpack_Simple_Payments: https://github.com/Automattic/jetpack/pull/17381/files#diff-b73125af4e0fe93b3939f29ff9c7e6fc33d17e564a32fb7ea8d082d1009e3401

mmtr · 2020-10-20T16:49:33Z

class-jetpack-currencies.php

+	 * @param  bool   $symbol   Whether to display the currency symbol.
+	 * @return string           Formatted price.
+	 */
+	public static function format_price( $price, $currency, $symbol = true ) {


This one comes from Jetpack_Simple_Payments too: https://github.com/Automattic/jetpack/pull/17381/files#diff-b73125af4e0fe93b3939f29ff9c7e6fc33d17e564a32fb7ea8d082d1009e3401

krymson24 · 2020-10-21T05:24:15Z

I don't know why I keep running into this. I double-checked and triple-checked the steps.

Spin up a JN site running master.

Set up Jetpack and go ahead with a free plan.

You need to sandbox the WP.com store now:
Edit your /etc/hosts file and point public-api.wordpress.com to your WP.com sandbox IP.

Go to WP Admin > Settings > Jetpack constants and enter your WP.com sandbox address in JETPACK__SANDBOX_DOMAIN.

Add the code below to /mu-plugins/0-sandbox.php in your WP.com sandbox:
define( 'USE_STORE_SANDBOX', true );
define( 'USE_BILLING_SANDBOX', true );
define( 'BILLINGDADDY_SANDBOX', rtrim( 'https://' . hostname ) );

Purchase any paid plan.

Go to WP Admin > Posts > Add new.

Insert a Donations block.

Donations block not present in the list.

Trying to add a post from Wordpress.com instead of wp-admin

I don't think anything is wrong with your PR; this just prevents me from testing it all the way through.

mmtr · 2020-10-21T10:00:19Z

@krymson24 I double checked the instructions, followed them once more and they are working for me. It seems your site is missing a paid plan.

What do you get when you run Jetpack_Editor_Initial_State.available_blocks.donations in the browser JS console while in the editor?

sixhours · 2020-10-21T13:44:12Z

Donations block not present in the list.

I ran into this problem too @krymson24. I found I had to purchase a more specific Jetpack Complete plan (I think I'd had Jetpack Security initially) for the Donations block to appear. Double check which plan you're on?

@mmtr I got partway through testing this yesterday but couldn't get the Jetpack patch to fully apply on my sandbox. I ran svn up and the pre-patch svn stat looks normal:

I then ran arc patch D51410 and it says the patch applied successfully (with two warnings):

But the output still looks broken for email, notifications, and Reader:

I've confirmed I'm sandboxing the API and the test site(s), so I think it's the patch not applying cleanly. Any ideas?

mmtr · 2020-10-21T13:53:07Z

But the output still looks broken for email, notifications, and Reader:

@sixhours did you publish the post before applying the patch? Seems you applied the patch correctly, but maybe you're testing with a post that was already published?

The fallback is only used when saving posts from now on. Contexts where the fallback output is going to be rendered are usually timely streamers, so we don't need to worry about using the fallback in existing posts.

sixhours · 2020-10-21T13:54:39Z

did you publish the post before applying the patch?

Ahhhh, I bet that's it. I'll give that a try. :D

sixhours · 2020-10-21T14:24:01Z

Huzzah! I not only had to apply the patch first, I had to switch to a different test site, because the other one appears to be "stuck"; I can't disconnect Stripe, but it doesn't seem to be properly connected to Stripe, either. 🙃

krymson24 · 2020-10-22T05:47:22Z

But the output still looks broken for email, notifications, and Reader:

@sixhours did you publish the post before applying the patch? Seems you applied the patch correctly, but maybe you're testing with a post that was already published?

The fallback is only used when saving posts from now on. Contexts where the fallback output is going to be rendered are usually timely streamers, so we don't need to worry about using the fallback in existing posts.

@krymson24 I double checked the instructions, followed them once more and they are working for me. It seems your site is missing a paid plan.

What do you get when you run Jetpack_Editor_Initial_State.available_blocks.donations in the browser JS console while in the editor?

I tried a Jetpack Security and Complete plan, and available is still false.

Confirming I have Jetpack Complete:

See below for screenshot that shows no Donations block as an option.

I thought maybe that I hard coded the availability as false somewhere in my sandbox from a previous change, but I looked through the source code, and I don't think that's it either...

😢

class-jetpack-currencies.php

extensions/blocks/donations/donations.php

class-jetpack-currencies.php

extensions/blocks/donations/donations.php

Co-authored-by: Jeremy Herve <[email protected]>

jeherve

This tests well for me in Jetpack.

kwight · 2020-10-26T22:03:15Z

tests/php/_inc/lib/test-class-jetpack-currencies.php

+/**
+ * Class for testing the Jetpack_Currencies class.
+ */
+class WP_Test_Jetpack_Currencies extends WP_UnitTestCase {


kwight · 2020-10-26T23:13:57Z

I ran into problems testing the WP.com side which looks like it maybe should have been fixed by @jeherve 's last commit (can't cleanly apply the diff related to the currencies bit)? Regardless, the rest looks great and with @sixhours confirmation, I'm approving 👍

jeherve · 2020-10-28T11:27:07Z

Internal reference, part 1: r215962-wpcom

jeherve · 2020-11-10T13:30:53Z

Part 2: r216557-wpcom

I don't see anything in #17381 that discusses this behavior. It's possible it was an accidental bug that wasn't noticed because of the undefined array key access producing null which produces the empty string, and that the test was a copy-paste of the previous test that didn't notice `false` being passed. I see no other uses of `Jetpack_Currencies` with `$symbol = false` in the monorepo or opengrok or wpdirectory, so this should be safe to fix.

mmtr added [Status] In Progress [Block] Donations labels Oct 5, 2020

mmtr self-assigned this Oct 5, 2020

matticbot added the Touches WP.com Files label Oct 5, 2020

mmtr force-pushed the update/donations-fallback branch from 64f402f to 14d3f50 Compare October 19, 2020 15:40

mmtr commented Oct 19, 2020

View reviewed changes

mmtr added [Status] Needs Review To request a review from fellow Jetpack developers. Label will be renamed soon. and removed [Status] In Progress labels Oct 20, 2020

mmtr requested a review from a team October 20, 2020 15:03

mmtr commented Oct 20, 2020

View reviewed changes

mmtr force-pushed the update/donations-fallback branch from 208317e to fcff2c5 Compare October 21, 2020 10:15

Automattic deleted a comment from matsapola Oct 22, 2020

jeherve requested changes Oct 22, 2020

View reviewed changes

jeherve added [Status] Needs Author Reply We would need you to make some changes or provide some more details about your PR. Thank you! and removed [Status] Needs Review To request a review from fellow Jetpack developers. Label will be renamed soon. labels Oct 22, 2020

mmtr force-pushed the update/donations-fallback branch from fcff2c5 to 533ea29 Compare October 26, 2020 11:45

mmtr added [Status] Needs Review To request a review from fellow Jetpack developers. Label will be renamed soon. and removed [Status] Needs Author Reply We would need you to make some changes or provide some more details about your PR. Thank you! labels Oct 26, 2020

mmtr and others added 8 commits October 26, 2020 18:44

Add INR format

f630f6d

Move currencies lib to _inc/lib

3aa3b90

Set classes with Blocks::classes

5598a41

Escape output

1d8618b

Update extensions/blocks/donations/donations.php

6df75be

Co-authored-by: Jeremy Herve <[email protected]>

Use BLOCK_NAME in Pay with PayPal's amp_skip_post

2b52cbc

Add unit tests for Jetpack_Currencies

cf64f54

Add new filet to PHPCS requirelist

4030797

jeherve force-pushed the update/donations-fallback branch from 459a9f5 to 4030797 Compare October 26, 2020 17:45

jeherve approved these changes Oct 26, 2020

View reviewed changes

jeherve added [Status] Ready to Merge Go ahead, you can push that green button! and removed [Status] Needs Review To request a review from fellow Jetpack developers. Label will be renamed soon. labels Oct 26, 2020

jeherve added this to the 9.1 milestone Oct 26, 2020

jeherve added the [Type] Enhancement Changes to an existing feature — removing, adding, or changing parts of it label Oct 26, 2020

kwight reviewed Oct 26, 2020

View reviewed changes

kwight approved these changes Oct 26, 2020

View reviewed changes

jeherve merged commit 60f0fa1 into master Oct 27, 2020

jeherve deleted the update/donations-fallback branch October 27, 2020 11:33

matticbot added [Status] Needs Changelog and removed [Status] Ready to Merge Go ahead, you can push that green button! labels Oct 27, 2020

mmtr mentioned this pull request Oct 27, 2020

Pay with PayPal: Fix currencies lib loading #17625

Merged

jeherve added [Status] Has Changelog and removed [Status] Needs Changelog labels Oct 27, 2020

jeherve added a commit that referenced this pull request Oct 27, 2020

Changelog: add #17381

1990811

mmtr mentioned this pull request Nov 9, 2020

Donation Block: does not render in Subscriber Emails #17730

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Donations: Save fallback for non-frontend contexts #17381

Donations: Save fallback for non-frontend contexts #17381

mmtr commented Oct 5, 2020 •

edited

Loading

jetpackbot commented Oct 5, 2020 •

edited

Loading

blackjackkent commented Oct 12, 2020

mmtr commented Oct 13, 2020

matticbot commented Oct 19, 2020

mmtr Oct 19, 2020

mmtr Oct 20, 2020

mmtr Oct 20, 2020 •

edited

Loading

krymson24 commented Oct 21, 2020 •

edited

Loading

mmtr commented Oct 21, 2020

sixhours commented Oct 21, 2020 •

edited

Loading

mmtr commented Oct 21, 2020 •

edited

Loading

sixhours commented Oct 21, 2020

sixhours commented Oct 21, 2020

krymson24 commented Oct 22, 2020 •

edited

Loading

jeherve left a comment •

edited

Loading

kwight Oct 26, 2020

kwight commented Oct 26, 2020

jeherve commented Oct 28, 2020

jeherve commented Nov 10, 2020

Donations: Save fallback for non-frontend contexts #17381

Donations: Save fallback for non-frontend contexts #17381

Conversation

mmtr commented Oct 5, 2020 • edited Loading

Changes proposed in this Pull Request:

Jetpack product discussion

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

Testing instructions:

Proposed changelog entry for your changes:

jetpackbot commented Oct 5, 2020 • edited Loading

blackjackkent commented Oct 12, 2020

mmtr commented Oct 13, 2020

matticbot commented Oct 19, 2020

mmtr Oct 19, 2020

Choose a reason for hiding this comment

mmtr Oct 20, 2020

Choose a reason for hiding this comment

mmtr Oct 20, 2020 • edited Loading

Choose a reason for hiding this comment

krymson24 commented Oct 21, 2020 • edited Loading

mmtr commented Oct 21, 2020

sixhours commented Oct 21, 2020 • edited Loading

mmtr commented Oct 21, 2020 • edited Loading

sixhours commented Oct 21, 2020

sixhours commented Oct 21, 2020

krymson24 commented Oct 22, 2020 • edited Loading

jeherve left a comment • edited Loading

Choose a reason for hiding this comment

kwight Oct 26, 2020

Choose a reason for hiding this comment

kwight commented Oct 26, 2020

jeherve commented Oct 28, 2020

jeherve commented Nov 10, 2020

mmtr commented Oct 5, 2020 •

edited

Loading

jetpackbot commented Oct 5, 2020 •

edited

Loading

mmtr Oct 20, 2020 •

edited

Loading

krymson24 commented Oct 21, 2020 •

edited

Loading

sixhours commented Oct 21, 2020 •

edited

Loading

mmtr commented Oct 21, 2020 •

edited

Loading

krymson24 commented Oct 22, 2020 •

edited

Loading

jeherve left a comment •

edited

Loading