Social: prevent raw message-template placeholders in previews while rendering

[gmjuhasz]

Fixes SOCIAL-518

From Jetpack 16.0 internal testing feedback (comment 9119 on the testing post, linked from the Linear issue): after closing/reopening the Social preview (or editing title/body/excerpt), previews could show raw {title} / {excerpt} placeholders instead of rendered values — and stay that way.

Two root causes:

1. A failed render request was cached forever. The getRenderedMessages resolver swallows fetch errors, so wp.data marked the resolution as complete. One failed render-messages request (easy to hit on a flaky host, like the testing environment where this was reported) permanently locked that input combination into "settled, no rendered text", with no retry on reopen.
2. The pending state fell back to the raw template. useConnectionPreviewData() returned baseMessage whenever there was no rendered string yet — and since the share message meta now defaults to the saved site template, that means raw placeholders.

Proposed changes

• useDriveRenderedMessagesFetch(): when the resolved batch is empty (the fetch failed), invalidate the resolution so the next mount — e.g. reopening the preview — retries instead of serving the empty slot forever. No retry loop: nothing re-resolves until remount or the render inputs change.
• useConnectionPreviewData(): keep the last rendered message per connection (a ref) and show it while a new render is pending (e.g. after a title/excerpt edit commits), instead of flashing the skeleton or the raw template. With nothing rendered yet, the skeleton shows. The raw template can only appear once rendering has settled without ever producing a result (templates disabled, or the request failed with nothing better to show).
• Regression tests for both hooks: pending state never yields the raw template, the previous rendered message is kept across a cache-key change, and the empty-batch resolution is invalidated while a successful one is kept.

Related product discussion/links

• SOCIAL-518

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

No.

Testing instructions

Requires a site with the message templates feature (social-message-templates) and at least one social connection.

• In Jetpack → Social settings, set a Default share message template with placeholders, e.g. New post: {title} — {excerpt}.
• Create a post with a title, body, and excerpt.
• Open the Social preview/customization modal: the preview should show the rendered values (never literal {title} / {excerpt}). While the render request is in flight you should see the loading skeleton, not the raw template.
• Edit the message template text in the modal: while the debounce + request are pending, the preview should keep showing the previous rendered message (no skeleton flash), then update.
• Close the modal, change the post title/excerpt, and reopen: the preview should show a skeleton and then render with the new (unsaved) values.
• Failure/retry path (the reported bug):
  • In dev tools → Network, block requests to **/publicize/render-messages*.
  • Close and reopen the modal, and change the title so a fresh render is needed. The request fails; the preview falls back to the raw template (existing settled-failure behavior).
  • Unblock the request and close/reopen the modal: the request should be retried and the preview should render real values again. Before this fix it stayed on raw placeholders forever.
• cd projects/packages/publicize && pnpm jest _inc/hooks — all tests pass.

[github-actions]

Are you an Automattician? Please test your changes on all WordPress.com environments to help mitigate accidental explosions.

• To test on WoA, go to the Plugins menu on a WoA dev site. Click on the "Upload" button and follow the upgrade flow to be able to upload, install, and activate the Jetpack Beta plugin. Once the plugin is active, go to Jetpack > Jetpack Beta, select your plugin (Jetpack), and enable the social-518-social-prevent-raw-message-template-placeholders-in-previews branch.
• To test on Simple, run the following command on your sandbox:

bin/jetpack-downloader test jetpack social-518-social-prevent-raw-message-template-placeholders-in-previews

Interested in more tips and information?

• In your local development environment, use the jetpack rsync command to sync your changes to a WoA dev blog.
• Read more about our development workflow here: PCYsg-eg0-p2
• Figure out when your changes will be shipped to customers here: PCYsg-eg5-p2

[github-actions]

Thank you for your PR!

When contributing to Jetpack, we have a few suggestions that can help us test and review your patch:

• ✅ Include a description of your PR changes.
  
• ✅ Add a "[Status]" label (In Progress, Needs Review, ...).
  
• ✅ Add testing instructions.
  
• ✅ Specify whether this PR includes any changes to data or privacy.
  
• ✅ Add changelog entries to affected projects
  

This comment will be updated as you work on your PR and make changes. If you think that some of those checks are not needed for your PR, please explain why you think so. Thanks for cooperation 🤖

---

Follow this PR Review Process:

1. Ensure all required checks appearing at the bottom of this PR are passing.
2. Make sure to test your changes on all platforms that it applies to. You're responsible for the quality of the code you ship.
3. You can use GitHub's Reviewers functionality to request a review.
4. When it's reviewed and merged, you will be pinged in Slack to deploy the changes to WordPress.com simple once the build is done.

If you have questions about anything, reach out in #jetpack-developers for guidance!

[jp-launch-control]

Code Coverage Summary

Coverage changed in 2 files.

File	Coverage	Δ%	Δ Uncovered
projects/packages/publicize/_inc/hooks/use-connection-preview-data/index.ts	40/49 (81.63%)	4.71%	0 💚
projects/packages/publicize/_inc/hooks/use-render-message-items/index.ts	64/68 (94.12%)	10.78%	-7 💚

Full summary · PHP report · JS report