Add rpf-markdown-core syntax for block highlighting - #1584
Draft
cocomarine wants to merge 12 commits into
Draft
Conversation
cocomarine
temporarily deployed
to
previews/1584/merge
August 10, 2026 12:09 — with 
GitHub Actions
Inactive
GitHub Actions
Inactive
vite.lib.js passes `babel: { plugins: [["prismjs", ...]] }` to
@vitejs/plugin-react. Plugin-react v6 transforms with oxc and has no
`babel` option at all, so the config has been ignored since the Vite
migration. That left us with the bare prismjs entry: markup, css, clike
and javascript, no python, and an empty Prism.plugins. rpf-markdown-core
was emitting correct `line-numbers` / `data-line` markup all along;
there was simply no plugin JS to consume it.
Replaced with explicit imports in src/utils/prism.js. Setting
Prism.manual and configuring NormalizeWhitespace at import time also
fixes a latent bug: the old useEffect raced prism-core's automatic
highlight pass and re-registered its before-sanity-check hook on every
mount.
cocomarine
temporarily deployed
to
previews/1584/merge
August 10, 2026 13:51 — with
GitHub Actions
Inactive
GitHub Actions
Inactive
The plugin prepends a shim banner to every pre-bundled dependency and
does not terminate the last statement:
globalThis.global = globalThis.global || __global_polyfill
A newline does not end that statement. Prism's plugin files start with
`(function(){...})()`, so the IIFE parsed as an argument to the shim
and the whole expression was short-circuited away once globalThis.global
was truthy — the plugin body never ran. Verified in Chrome:
Prism.plugins was ["fileHighlight", "NormalizeWhitespace"] under
`yarn start` but the full set in a production build, since the banner
is only wired into optimizeDeps. prism-python escaped it by not
starting with a paren, and normalize-whitespace by getting a
__commonJSMin wrapper that preserved the semicolon.
Excluded the three plugin files from pre-bundling.
cocomarine
temporarily deployed
to
previews/1584/merge
August 10, 2026 13:53 — with
GitHub Actions
Inactive
GitHub Actions
Inactive
cocomarine
temporarily deployed
to
previews/1584/merge
August 10, 2026 14:31 — with
GitHub Actions
Inactive
GitHub Actions
Inactive
cocomarine
had a problem deploying
to
previews/1584/merge
August 10, 2026 14:33 — with
GitHub Actions
Failure
GitHub Actions
Failure
…om:RaspberryPiFoundation/editor-ui into 1690-add-block-highlighting-in-instruction
cocomarine
had a problem deploying
to
previews/1584/merge
August 10, 2026 14:37 — with
GitHub Actions
Failure
GitHub Actions
Failure
cocomarine
temporarily deployed
to
previews/1584/merge
August 10, 2026 14:42 — with
GitHub Actions
Inactive
GitHub Actions
Inactive
cocomarine
marked this pull request as ready for review
August 10, 2026 16:15
cocomarine
marked this pull request as draft
August 10, 2026 16:15
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Closes https://github.com/RaspberryPiFoundation/digital-editor-issues/issues/1682
Block-type text highlighting
Prism and other fixes
While doing this work, I found Prism had stopped working possibly due to the partial Vite migration. Prism provides syntax highlighting, line numbering and line highlighting in code blocks of instructions. Classroom and ExpCS instructions don't use these currently, but CCP instructions do.
The existing
vite.lib.jsconfiguredbabel-plugin-prismjsvia @vitejs/plugin-react's babel option, which plugin-react v6 no longer has. The config was ignored. Replaced with explicit imports in src/utils/prism.js.In dev environment,
vite-plugin-node-polyfillsprepends a shim banner to every pre-bundled dependency without terminating the last statement. Prism's plugin files start with (function(){…})(), so it was parsed as an argument to the shim and then short-circuited away, resulting in line-numbers and line-highlight not registered. Worked around with optimizeDeps.exclude in vite.config.js.Jest couldn't load any test importing rpf-markdown-core. Its CJS build requires marked and scratchblocks, both ESM-only with no CommonJS entry. Updated transformIgnorePatterns to exempt both, matched against the full path so the nested rpf-markdown-core/node_modules/scratchblocks copy is also covered.
Can our users use any other features that the rpf-markdown-core provides?