Size Change: 0 B

Total Size: 1.4 MB

_{compressed-size-action}

Thanks @ZebulanStanphill ! Looking forward to the feature.

Hi Zeb @ZebulanStanphill .
Could you add some instructions on how to test the two items you mention?
Thanks.

@paaljoachim Good idea. I've added testing instructions to PR description.

Hey Zeb.

Using WordPress 5.7 RC2.
A special version of the Gutenberg plugin containing this PR. Instructions for creating the special Gutenberg plugin here: #28881 (There is also a video in the last comment.)
Theme: Twenty Fourteen.
OSX 10.15.7
Chrome

Switched permalinks to plain links.
Made a new post.
Added multiple Headings. Added anchors.
Added Page breaks between them.
Previewed. These worked fine.
Switched permalinks to Post name. This also worked fine.
Here is a video of the result.

Nicely done. This works fine!

--> Sidetrack.
The one general issue I have with HTML anchors is that they move so far down the page that the Heading titles are covered. Like so:

One has to scroll up a bit to see the Heading title.

@paaljoachim To be clear, you should also test to see if the links still work when viewing the post from another page, e.g. the home page's default blog feed. (Some themes will use HTML-stripped summaries, but Twenty Fourteen, like most of the older default themes, displays the entirety of the posts on the home page.) Or maybe you already tested that, but it wasn't clear from your comment.

(I already tested it, and it worked, but it's always nice to get confirmation.)

The one general issue I have with HTML anchors is that they move so far down the page that the Heading titles are covered. Like so:

This is a pretty common issue caused by position: fixed and position: sticky elements not being accounted for by browsers scrolling to a heading. The only way around it is to use JavaScript to shift the scroll position after every anchor link click, but that's something that should be handled by the theme. (Clearly, though, Twenty Fourteen doesn't handle it.)

This is a pretty common issue caused by position: fixed and position: sticky elements not being accounted for by browsers scrolling to a heading. The only way around it is to use JavaScript to shift the scroll position after every anchor link click, but that's something that should be handled by the theme. (Clearly, though, Twenty Fourteen doesn't handle it.)

Offtopic; There's a CSS property for this: https://www.caniuse.com/mdn-css_properties_scroll-margin-top
We use this together with a CSS var if the header height is dynamic.

The url creation here is a good candidate for unit tests to document the cases for permalink choice and multipart posts. I'm fine if it's a follow up though since it might take some work to set up.

Yeah, unit tests would be neat. I'll try and create some in another PR if no one else wants to.