Repository navigation
fix(directive-demos): 7 broken tutorials — code-blocks + rich-media + content-reuse - #3091
Merged
Merged
Conversation
…epths, line spans, diff markers Fixes #3076 and step-2/4/5 bugs verified in browser: - Step 1 (CSS): add white-space:pre + overflow-x:auto to .code-block-body pre for console line wrap - Step 2 (highlight-cds): guard Shiki replacement on diff-marker presence; skip blocks with Chroma diff-* line classes so // [!code focus] annotations survive - Step 4 (tree fence): fix reversed strings.TrimLeft arg order (was wrong order → garbage depth); add state-prefix (+/-/~) handling to preserve branch marks - Step 5 (walkthrough): use highlight() instead of markdownify to emit .line spans for JS line-click handlers All 4 code-blocks sub-fixes verified in live browser render (tree structure, depths, icons, state classes, line annotations, css classes, cds diff-focus intact). Tests pass 19/19.
This was referenced Nov 10, 2026
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
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.
Summary
Fixes all 7 broken directive demo tutorials that blocked blog-post publication. Three categories:
Bug 1: code-blocks (directive-code-blocks) — 4 sub-fixes
.code-block-body pre// [!code focus]annotations now survivestrings.TrimLeftarg order (was garbage depth 7, now correct 0/1/2); added state-prefix (+/-/~) handlinghighlight()instead ofmarkdownifyto emit.linespans for JS handlersVerification: all 4 rendered correctly in live browser (tree structure, depths, icons, state classes, diff-focus intact); tests 19/19 pass.
Bug 2: rich-media (directive-rich-media) — placeholder assets
8 labeled stand-in assets (PNGs, SVG, cast) uploaded to meta-tutorials so the demo renders cleanly instead of 404s. Real BTP Cockpit screenshots / diagram should replace them later.
PR in external repo: sap-tutorials/meta-tutorials#17 (all 8 assets committed; ready to merge).
Bug 3: content-reuse (directive-content-reuse) — slug + fail-loud validation
hana-cloud-mission-trial-1(live ✓)catalogBySlugwired in fetch-tutorials.ts — maps all discovery slugs, guarded onsource === 'github', reads real title/time from cache. Dead:tutorial/::requiresrefs now fail the rebuild loudly. Tests locked (directives-reference-links.test.ts line 62, directives-prerequisites.test.ts line 79).Testing
npm test→ 19/19 highlight-cds + directive tests passNext