Fix display style of additional thank-you order-received text in Woo 8.1 and 8.2

[htdat]

Fixes the following issue when testing #7450

Issue

In Woo core 8.1.x and 8.2.x, the additional messages for DuplicatePaymentPreventionService and Duplicate_Payment_Prevention_Service with the div tag is escaped. They look like this:

The expected style would be something like screenshots in #5247 and #5346.

Cause

woocommerce/woocommerce#39758 - this issue is introduced in 8.1
woocommerce/woocommerce#40353 - will be fixed in 8.3.

Changes proposed in this Pull Request

• Add a specific handling for Woo 8.1 and 8.2 by adding a small JavaScript code to add style class woocommerce-info for the message.

Testing instructions

• Test with 8.1 and 8.2. The message looks good, though a bit different from the original one.
• Test with dev version 8.3. The message style looks good and similar to two PRs: Fix duplicate order: Store order ID to session, check it before update/create_confirm intents #5247 and Check intent attached to order before processing payment #5346.

---

• 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

• Link to testing instructions from release testing doc following these instructions : Add link here / 'QA Testing Not Applicable'
• Add or update critical flows and testing instructions for critical flows, if applicable.
• Add what's changed (description, screenshot, demo videos etc.) to the release announcement post, if applicable.

[botwoo]

Test the build

Option 1. Jetpack Beta

• Install and activate Jetpack Beta.
• Use this build by searching for PR number 7566 or branch name fix/thank-you-message-with-correct-style 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: 6056fcd
• Build time: 2023-10-27 07:45:21 UTC

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

[github-actions]

Size Change: 0 B

Total Size: 1.43 MB

ℹ️ 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/blocks-checkout.js	75.1 kB
release/woocommerce-payments/dist/checkout-rtl.css	440 B
release/woocommerce-payments/dist/checkout.css	441 B
release/woocommerce-payments/dist/checkout.js	28.9 kB
release/woocommerce-payments/dist/index-rtl.css	36.4 kB
release/woocommerce-payments/dist/index.css	36.4 kB
release/woocommerce-payments/dist/index.js	284 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-switcher-block.js	60.2 kB
release/woocommerce-payments/dist/multi-currency.css	2.88 kB
release/woocommerce-payments/dist/multi-currency.js	54.9 kB
release/woocommerce-payments/dist/order-rtl.css	676 B
release/woocommerce-payments/dist/order.css	679 B
release/woocommerce-payments/dist/order.js	41.1 kB
release/woocommerce-payments/dist/payment-gateways-rtl.css	690 B
release/woocommerce-payments/dist/payment-gateways.css	692 B
release/woocommerce-payments/dist/payment-gateways.js	38.6 kB
release/woocommerce-payments/dist/payment-request-rtl.css	153 B
release/woocommerce-payments/dist/payment-request.css	153 B
release/woocommerce-payments/dist/payment-request.js	13.1 kB
release/woocommerce-payments/dist/product-details.js	898 B
release/woocommerce-payments/dist/settings-rtl.css	9.05 kB
release/woocommerce-payments/dist/settings.css	9.05 kB
release/woocommerce-payments/dist/settings.js	234 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-modal.js	20.4 kB
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/subscriptions-empty-state.js	19.5 kB
release/woocommerce-payments/dist/tos-rtl.css	230 B
release/woocommerce-payments/dist/tos.css	231 B
release/woocommerce-payments/dist/tos.js	22 kB
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.7 kB
release/woocommerce-payments/dist/upe_with_deferred_intent_creation_checkout.js	37.1 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-blocks-checkout.js	40.9 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/upe-split-blocks-checkout.js	42.5 kB
release/woocommerce-payments/dist/woopay-express-button-rtl.css	153 B
release/woocommerce-payments/dist/woopay-express-button.css	153 B
release/woocommerce-payments/dist/woopay-express-button.js	52 kB
release/woocommerce-payments/dist/woopay-rtl.css	3.91 kB
release/woocommerce-payments/dist/woopay.css	3.91 kB
release/woocommerce-payments/dist/woopay.js	71.7 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.03 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.6 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.4 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}

[RadoslavGeorgiev]

Works like a charm 👌