wp-calypso
wp-calypso copied to clipboard
Fix excerpt text in reader
The reader isn't rendering the post excerpt correctly.
We have set it to output the no html text but this removes all tags, including the <br>
tags. This means text that was meant to be on a new line is now on the same line and with incorrect spacing.
Example from here with update/reader-card-refresh branch
With this PR
Here is how your PR affects size of JS and CSS bundles shipped to the user's browser:
App Entrypoints (~512 bytes added π [gzipped])
name parsed_size gzip_size
entry-main -530 B (-0.0%) -24 B (-0.0%)
entry-stepper +459 B (+0.0%) +529 B (+0.1%)
entry-gutenboarding -46 B (-0.0%) -1 B (-0.0%)
entry-domains-landing -46 B (-0.0%) -1 B (-0.0%)
entry-browsehappy -46 B (-0.0%) -1 B (-0.0%)
entry-login -29 B (-0.0%) +5 B (+0.0%)
Common code that is always downloaded and parsed every time the app is loaded, no matter which route is used.
Sections (~856 bytes removed π [gzipped])
name parsed_size gzip_size
reader -5923 B (-1.0%) -851 B (-0.5%)
site-blocks -929 B (-0.2%) -285 B (-0.2%)
home +46 B (+0.0%) +22 B (+0.0%)
devdocs -44 B (-0.0%) -10 B (-0.0%)
themes -27 B (-0.0%) -4 B (-0.0%)
theme -27 B (-0.0%) -8 B (-0.0%)
preview -27 B (-0.0%) -1 B (-0.0%)
woocommerce-installation +17 B (+0.0%) +6 B (+0.0%)
woocommerce +17 B (+0.0%) +6 B (+0.0%)
site-purchases +17 B (+0.0%) +6 B (+0.0%)
settings-writing +17 B (+0.0%) +6 B (+0.0%)
settings-security +17 B (+0.0%) +6 B (+0.0%)
settings-performance +17 B (+0.0%) +6 B (+0.0%)
settings-jetpack +17 B (+0.0%) +6 B (+0.0%)
settings-discussion +17 B (+0.0%) +6 B (+0.0%)
settings +17 B (+0.0%) +6 B (+0.0%)
security +17 B (+0.0%) +6 B (+0.0%)
scan +17 B (+0.0%) +6 B (+0.0%)
purchases +17 B (+0.0%) +6 B (+0.0%)
purchase-product +17 B (+0.0%) +6 B (+0.0%)
privacy +17 B (+0.0%) +6 B (+0.0%)
plugins +17 B (+0.0%) +6 B (+0.0%)
plans +17 B (+0.0%) +6 B (+0.0%)
people +17 B (+0.0%) +6 B (+0.0%)
notification-settings +17 B (+0.0%) +6 B (+0.0%)
migrate +17 B (+0.0%) +6 B (+0.0%)
media +17 B (+0.0%) +6 B (+0.0%)
me +17 B (+0.0%) +6 B (+0.0%)
marketplace +17 B (+0.0%) +6 B (+0.0%)
marketing +17 B (+0.0%) +6 B (+0.0%)
jetpack-social +17 B (+0.0%) +6 B (+0.0%)
jetpack-search +17 B (+0.0%) +6 B (+0.0%)
jetpack-connect +17 B (+0.0%) +6 B (+0.0%)
jetpack-cloud-settings +17 B (+0.0%) +6 B (+0.0%)
jetpack-cloud-pricing +17 B (+0.0%) +6 B (+0.0%)
jetpack-cloud-plugin-management +17 B (+0.0%) +6 B (+0.0%)
jetpack-cloud-partner-portal +17 B (+0.0%) +8 B (+0.0%)
jetpack-cloud-agency-dashboard +17 B (+0.0%) +6 B (+0.0%)
jetpack-cloud +17 B (+0.0%) +6 B (+0.0%)
import +17 B (+0.0%) +6 B (+0.0%)
hosting +17 B (+0.0%) +6 B (+0.0%)
help +17 B (+0.0%) +6 B (+0.0%)
happychat +17 B (+0.0%) +6 B (+0.0%)
gutenberg-editor +17 B (+0.0%) +6 B (+0.0%)
google-my-business +17 B (+0.0%) +6 B (+0.0%)
export +17 B (+0.0%) +6 B (+0.0%)
email +17 B (+0.0%) +6 B (+0.0%)
earn +17 B (+0.0%) +6 B (+0.0%)
domains +17 B (+0.0%) +6 B (+0.0%)
customize +17 B (+0.0%) +6 B (+0.0%)
concierge +17 B (+0.0%) +6 B (+0.0%)
comments +17 B (+0.0%) +6 B (+0.0%)
checkout +17 B (+0.0%) +6 B (+0.0%)
backup +17 B (+0.0%) +6 B (+0.0%)
add-ons +17 B (+0.0%) +6 B (+0.0%)
activity +17 B (+0.0%) +6 B (+0.0%)
account-close +17 B (+0.0%) +6 B (+0.0%)
account +17 B (+0.0%) +6 B (+0.0%)
Sections contain code specific for a given set of routes. Is downloaded and parsed only when a particular route is navigated to.
Async-loaded Components (~3855 bytes added π [gzipped])
name parsed_size gzip_size
async-load-design-blocks +6084 B (+0.3%) +2167 B (+0.4%)
async-load-calypso-reader-search-stream +844 B (+1.0%) +223 B (+0.9%)
async-load-calypso-blocks-support-article-dialog-dialog -726 B (-0.6%) -147 B (-0.4%)
async-load-automattic-help-center -713 B (-0.1%) -134 B (-0.1%)
async-load-calypso-reader-sidebar +688 B (+0.5%) +81 B (+0.2%)
async-load-calypso-reader-site-stream +665 B (+2.2%) +228 B (+2.4%)
async-load-calypso-reader-feed-stream +665 B (+2.2%) +230 B (+2.4%)
async-load-calypso-components-web-preview-component +549 B (+0.1%) +535 B (+0.3%)
async-load-calypso-blocks-reader-full-post -161 B (-0.4%) +52 B (+0.4%)
async-load-signup-steps-design-picker -44 B (-0.0%) -6 B (-0.0%)
async-load-calypso-my-sites-site-settings-seo-settings-form -44 B (-0.0%) -10 B (-0.0%)
async-load-calypso-blocks-support-article-dialog -44 B (-1.1%) -19 B (-1.1%)
async-load-calypso-layout-masterbar-drafts-popover +29 B (+0.1%) +20 B (+0.1%)
async-load-calypso-reader-p-2-main -22 B (-0.7%) -16 B (-1.5%)
async-load-calypso-reader-conversations-stream -22 B (-0.5%) -10 B (-0.6%)
async-load-calypso-reader-a-8-c-main -22 B (-0.7%) -16 B (-1.5%)
async-load-signup-steps-theme-selection +17 B (+0.0%) +7 B (+0.0%)
async-load-signup-steps-site-picker +17 B (+0.0%) +6 B (+0.0%)
async-load-signup-steps-plans-atomic-store +17 B (+0.0%) +8 B (+0.0%)
async-load-signup-steps-plans +17 B (+0.0%) +6 B (+0.0%)
async-load-signup-steps-p2-complete-profile +17 B (+0.0%) +6 B (+0.0%)
async-load-signup-steps-difm-site-picker +17 B (+0.0%) +6 B (+0.0%)
async-load-signup-steps-clone-point +17 B (+0.0%) +7 B (+0.0%)
async-load-signup-steps-clone-destination +17 B (+0.0%) +7 B (+0.0%)
async-load-signup-steps-clone-credentials +17 B (+0.0%) +7 B (+0.0%)
async-load-design-playground +17 B (+0.0%) +6 B (+0.0%)
async-load-design +17 B (+0.0%) +6 B (+0.0%)
async-load-calypso-my-sites-checkout-modal +17 B (+0.0%) +8 B (+0.0%)
async-load-calypso-layout-guided-tours-component +17 B (+0.0%) +10 B (+0.0%)
async-load-calypso-components-sites-popover +17 B (+0.0%) +6 B (+0.0%)
async-load-calypso-blocks-legal-updates-banner +17 B (+0.4%) +7 B (+0.4%)
async-load-calypso-blocks-inline-help-popover +17 B (+0.0%) +6 B (+0.0%)
React components that are loaded lazily, when a certain part of UI is displayed for the first time.
Legend
What is parsed and gzip size?
Parsed Size: Uncompressed size of the JS and CSS files. This much code needs to be parsed and stored in memory. Gzip Size: Compressed size of the JS and CSS files. This much data needs to be downloaded over network.
Generated by performance advisor bot at iscalypsofastyet.com.
Just tested this. Overall it looks good.
I ran into one minor issue. If you follow https://snapshotsincursive.com/ and scroll down about 14 posts, you'll see this one which only displays one line for some reason:

You can view the full post here:
https://snapshotsincursive.com/2022/09/18/autumns-second-spring/
Here's the HTML for the excerpt:
<div class="entry-content">
<p>βSummer ends, and Autumn comes,</p>
<p>and he who would have it otherwise</p>
<p>would have high tide always and</p>
<p>a full moon every night.β</p>
<p>~ Hal Borland</p>
http://calypso.localhost:3000/read/feeds/34968577 should be showing 2 lines now in excerpt;
