minyeamer opened a new pull request, #66809:
URL: https://github.com/apache/airflow/pull/66809
<!-- SPDX-License-Identifier: Apache-2.0
https://www.apache.org/licenses/LICENSE-2.0 -->
This PR improves how `doc_md` content renders in the Dag Documentation
dialog in the new UI.
It adds proper rendering for inline code, fenced code blocks, KaTeX math,
and Mermaid diagrams.
## What changed
- render inline code separately so it stays in normal sentence flow
- render fenced code blocks in a dedicated full-width container with broader
syntax highlighting, line numbers, and a copy action
- add KaTeX support for math expressions and load the bundled stylesheet
needed to display them
- add Mermaid support for diagram blocks with strict security settings
- add regression tests for inline code, fenced code blocks, math, and
Mermaid rendering
## Test plan
- install dependencies with the committed lockfile to confirm the
markdown-related packages and KaTeX assets install correctly:
`cd airflow-core/src/airflow/ui && corepack pnpm install
--frozen-lockfile`
- run the focused React markdown tests to verify inline code, fenced code
blocks, math, and Mermaid rendering:
`cd airflow-core/src/airflow/ui && corepack pnpm vitest run
src/components/ReactMarkdown.test.tsx`
- run eslint on the touched UI files to catch typing, import, and lint
regressions in the markdown rendering changes:
`cd airflow-core/src/airflow/ui && corepack pnpm exec eslint
src/components/ReactMarkdown.tsx src/components/ReactMarkdownBlocks.tsx
src/utils/renderMermaid.ts src/utils/syntaxHighlighter.ts
src/components/ReactMarkdown.test.tsx src/main.tsx`
- build the UI bundle to confirm the new markdown packages and KaTeX styles
work in a production build:
`cd airflow-core/src/airflow/ui && corepack pnpm build`
## Screenshots
| Mode | Before | After |
| --- | --- | --- |
| Light | 
| 
|
| Dark | 
| 
|
---
##### Was generative AI tooling used to co-author this PR?
- [X] Yes
Generated-by: GitHub Copilot (GPT-5.4) following [the
guidelines](https://github.com/apache/airflow/blob/main/contributing-docs/05_pull_requests.rst#gen-ai-assisted-contributions)
---
* Read the **[Pull Request
Guidelines](https://github.com/apache/airflow/blob/main/contributing-docs/05_pull_requests.rst#pull-request-guidelines)**
for more information. Note: commit author/co-author name and email in commits
become permanently public when merged.
* For fundamental code changes, an Airflow Improvement Proposal
([AIP](https://cwiki.apache.org/confluence/display/AIRFLOW/Airflow+Improvement+Proposals))
is needed.
* When adding dependency, check compliance with the [ASF 3rd Party License
Policy](https://www.apache.org/legal/resolved.html#category-x).
* For significant user-facing changes create newsfragment:
`{pr_number}.significant.rst`, in
[airflow-core/newsfragments](https://github.com/apache/airflow/tree/main/airflow-core/newsfragments).
You can add this file in a follow-up commit after the PR is created so you
know the PR number.
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
