Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Markdown block: add support for footnotes. #30149

Merged
merged 2 commits into from
Apr 21, 2023

Conversation

jeherve
Copy link
Member

@jeherve jeherve commented Apr 18, 2023

Fixes #11849

Proposed changes:

Jetpack ships with 2 flavors of Markdown:

  • The Markdown feature available in the classic editor or in a classic block, and made available via our Markdown module:

* Module Name: Markdown
* Module Description: Write posts or pages in plain-text Markdown syntax

  • The Markdown feature available to all Jetpack users in the block editor, via the Markdown block.

This PR is about the latter. It makes no changes to the classic Markdown feature available in the classic editor. This classic Markdown feature already supports footnotes.

The block, however, did not support footnotes, as it relies on a package (markdown-it) that does not support footnotes out of the box. There, you must use plugins to enable extra features.

In this PR, I'm bringing in a new dependency to the Jetpack plugin, to add support for footnotes:

Note
Once this is merged, we will need to make changes to our support documentation to indicate that the Markdown block now supports footnotes.

Other information:

  • Have you written new tests for your changes, if applicable?
  • Have you checked the E2E test CI results, and verified that your changes do not break them?
  • Have you tested your changes on WordPress.com, if applicable (if so, you'll see a generated comment below with a script to run)?

Jetpack product discussion

See #18035 and #11881.

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

  • No

Testing instructions:

  • Start with a site that's connected to WordPress.com or in Offline mode.
  • Go to Posts > Add New
  • Add a Markdown block
  • Add some content to that block. Possibly something quite long.
  • In there, add 2 types of footnotes as highlighted in the docs here.
    • If you'd like, you can use the test content I've added below.
  • Ensure those work well when saving your draft and viewing your changes on the frontend.
Example content
Once upon a time, there was a man named Jack who loved nothing more than cooking up a delicious meal for his loved ones. One day, he decided to prepare [his famous burgers and fries](https://shakeshack.com/) for his family. He spent hours in the kitchen, carefully selecting the freshest ingredients and crafting each burger with love and care.[^1]

As the scent of sizzling beef filled the air, Jack's family gathered around the kitchen, eagerly awaiting the meal. Finally, the burgers were ready and Jack proudly presented them to his loved ones. They took a bite and immediately their faces lit up with delight. "**This is amazing!**" they exclaimed.

But as they continued to eat, something strange began to happen. Jack's family members started to sprout feathers and wings.[^longnote] Before he could react, they had transformed into a flock of birds and flew out of the open window. Jack stood there, stunned, watching as his loved ones disappeared into the distance.

For days, Jack searched for his family, but they were nowhere to be found. Finally, he gave up and resigned himself to the fact that his cooking had somehow turned his family into birds. But despite his grief, he couldn't help but feel a sense of pride. After all, his cooking had been so delicious that it had caused his loved ones to take flight - *quite literally*.

From that day forward, Jack became known as the "bird chef," renowned throughout the land for his incredible burgers and fries that had the power to transform even the most ordinary person into a magnificent bird. And although he never did find his lost family, he took solace in knowing that they were out there somewhere, soaring through the skies, thanks to the power of his cooking.

[^1]: Check [the recipe here](https://www.myrecipes.com/recipe/classic-burger).

[^longnote]: This gets weird from here.

    I've been using ChatGPT at times to help me come up with random content, and this is what happens. I think this quote from ["Cheating is All You Need"](https://about.sourcegraph.com/blog/cheating-is-all-you-need) is appropriate here:

    > A raw LLM is like a Harvard CS grad who knows a lot about coding and took a magic mushroom about 4 hours ago, so it’s mostly worn off, but not totally.

Fixes #11849

Also see #18035 and #11881.

This involves bringing in a new dependency to the Jetpack plugin:

- https://github.com/markdown-it/markdown-it-footnote
- MIT License
@jeherve jeherve added [Type] Enhancement Changes to an existing feature — removing, adding, or changing parts of it [Feature] Markdown [Status] Needs Review To request a review from fellow Jetpack developers. Label will be renamed soon. [Pri] Low [Block] Markdown labels Apr 18, 2023
@jeherve jeherve self-assigned this Apr 18, 2023
@github-actions github-actions bot added the [Plugin] Jetpack Issues about the Jetpack plugin. https://wordpress.org/plugins/jetpack/ label Apr 18, 2023
@github-actions
Copy link
Contributor

github-actions bot commented Apr 18, 2023

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.
  • ✅ All commits were linted before commit.
  • ✅ Add a "[Status]" label (In Progress, Needs Team 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 🤖


The e2e test report can be found here. Please note that it can take a few minutes after the e2e tests checks are complete for the report to be available.


Once your PR is ready for review, check one last time that all required checks (other than "Required review") appearing at the bottom of this PR are passing or skipped.
Then, add the "[Status] Needs Team review" label and ask someone from your team review the code.
Once you’ve done so, switch to the "[Status] Needs Review" label; someone from Jetpack Crew will then review this PR and merge it to be included in the next Jetpack release.


Jetpack plugin:

  • Next scheduled release: May 2, 2023.
  • Scheduled code freeze: April 24, 2023.

@github-actions
Copy link
Contributor

github-actions bot commented Apr 18, 2023

Are you an Automattician? You can now test your Pull Request on WordPress.com. On your sandbox, run

bin/jetpack-downloader test jetpack update/markdown-block-footnotes
bin/jetpack-downloader test jetpack-mu-wpcom-plugin update/markdown-block-footnotes

to get started. More details: p9dueE-5Nn-p2

Copy link
Contributor

@fgiannar fgiannar left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I tested using the provided content on a JN site and my WPCOM Simple site.

Before (Simple site):
Screenshot 2023-04-21 at 11 14 04

After (Simple site):
Screenshot 2023-04-21 at 11 09 57

Before (JN site):
Screenshot 2023-04-21 at 11 15 38

After (JN site):
Screenshot 2023-04-21 at 11 11 27

@fgiannar fgiannar 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 Apr 21, 2023
@jeherve jeherve merged commit db60b37 into trunk Apr 21, 2023
@jeherve jeherve deleted the update/markdown-block-footnotes branch April 21, 2023 10:52
@github-actions github-actions bot removed the [Status] Ready to Merge Go ahead, you can push that green button! label Apr 21, 2023
@zinigor zinigor added this to the Jetpack/12.1 milestone Apr 24, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Block] Markdown [Feature] Markdown [Plugin] Jetpack Issues about the Jetpack plugin. https://wordpress.org/plugins/jetpack/ [Pri] Low [Type] Enhancement Changes to an existing feature — removing, adding, or changing parts of it
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Markdown block: add footnotes support
3 participants