Skip to content

Conversation

@hainenber
Copy link
Contributor

fix(com/grid-comp/markdown): pin remark-gfm to v3 to allow inline code block by backticks in Markdown

SUMMARY

Fixes #32416

According to this remark-gfm issue post, react-markdown v8 (current version in Superset) only plays well with remark-gfm v3, hence the downgrade. The other alternative is to upgrade react-markdown to v9 but that has breaking change of React 18 requirement.

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

Before

Screen.Recording.2025-02-28.at.12.24.40.mov

After
https://github.com/user-attachments/assets/5d861226-c98f-4687-b9e8-8e90da2a847a

TESTING INSTRUCTIONS

  1. Go to Sales dashboard example dashboard
  2. Add and/or modify a word in Vehicle Sales Dashboard Markdown section.
  3. Receive crash/error

ADDITIONAL INFORMATION

  • Has associated issue:
  • Required feature flags:
  • Changes UI
  • Includes DB Migration (follow approval process in SIP-59)
    • Migration is atomic, supports rollback & is backwards-compatible
    • Confirm DB migration upgrade and downgrade tested
    • Runtime estimates and downtime expectations provided
  • Introduces new feature or API
  • Removes existing feature or API

…ode block by backticks in Markdown

Signed-off-by: hainenber <dotronghai96@gmail.com>
Copy link

@korbit-ai korbit-ai bot left a comment

Choose a reason for hiding this comment

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

I've completed my review and didn't find any issues.

Need a new review? Comment /korbit-review on this PR and I'll review your latest changes.

Korbit Guide: Usage and Customization

Interacting with Korbit

  • You can manually ask Korbit to review your PR using the /korbit-review command in a comment at the root of your PR.
  • You can ask Korbit to generate a new PR description using the /korbit-generate-pr-description command in any comment on your PR.
  • Too many Korbit comments? I can resolve all my comment threads if you use the /korbit-resolve command in any comment on your PR.
  • Chat with Korbit on issues we post by tagging @korbit-ai in your reply.
  • Help train Korbit to improve your reviews by giving a 👍 or 👎 on the comments Korbit posts.

Customizing Korbit

  • Check out our docs on how you can make Korbit work best for you and your team.
  • Customize Korbit for your organization through the Korbit Console.

Current Korbit Configuration

General Settings
Setting Value
Review Schedule Automatic excluding drafts
Max Issue Count 10
Automatic PR Descriptions
Issue Categories
Category Enabled
Documentation
Logging
Error Handling
Readability
Design
Performance
Security
Functionality

Feedback and Support

Note

Korbit Pro is free for open source projects 🎉

Looking to add Korbit to your team? Get started with a free 2 week trial here

@dosubot dosubot bot added the dashboard:markdown Related to the markdown component of the Dashboard label Feb 28, 2025
…-gfm` until reaching React 18

Signed-off-by: hainenber <dotronghai96@gmail.com>
Copy link
Member

@mistercrunch mistercrunch left a comment

Choose a reason for hiding this comment

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

LGTM

@rusackas rusackas merged commit 61b72f0 into apache:master Mar 1, 2025
47 checks passed
@michael-s-molina michael-s-molina added the v5.0 Label added by the release manager to track PRs to be included in the 5.0 branch label Mar 5, 2025
michael-s-molina pushed a commit that referenced this pull request Mar 5, 2025
…ode block by backticks in Markdown (#32420)

Signed-off-by: hainenber <dotronghai96@gmail.com>
michael-s-molina pushed a commit that referenced this pull request Mar 5, 2025
…ode block by backticks in Markdown (#32420)

Signed-off-by: hainenber <dotronghai96@gmail.com>
@mistercrunch mistercrunch added 🍒 5.0.0 Cherry-picked to 5.0.0 🏷️ bot A label used by `supersetbot` to keep track of which PR where auto-tagged with release labels labels Jul 29, 2025
rebenitez1802 added a commit to rebenitez1802/superset that referenced this pull request Dec 3, 2025
This commit addresses a critical dependency incompatibility that causes
the "Cannot set properties of undefined (setting 'inTable')" error when
rendering tables in Markdown components.

## Problem
- remark-gfm v4.0.1 requires remark-parser v11+ (unified v11)
- react-markdown v8.0.7 uses remark-parser v10 (unified v10)
- This version mismatch breaks table rendering in Markdown components

## Solution
1. Downgraded remark-gfm from ^4.0.1 to ^3.0.1 in @superset-ui/core
2. Added npm override in root package.json to prevent auto-upgrades
3. Regenerated package-lock.json to reflect the downgrade

## Related Issues
- This issue was previously fixed in PR apache#32420 (March 2025)
- Dependabot re-introduced the bug by auto-bumping to v4.0.1 (July 2025)
- The npm override prevents this from happening again

## Alternative Solution
Upgrading to react-markdown v9+ would allow remark-gfm v4+, but that
would be a larger change requiring broader testing.

## Testing
Tables in Markdown components now render correctly without errors.
rebenitez1802 added a commit to rebenitez1802/superset that referenced this pull request Jan 7, 2026
Add automated tests to prevent future dependency upgrades from breaking
markdown rendering functionality. These tests will fail if remark-gfm is
upgraded to v4+ without upgrading react-markdown to v9+ (requires React 18).

Tests cover:
1. **Table rendering** - The critical regression from PR apache#32945
   - Verifies tables render without "Cannot set properties of undefined" error
   - Tests table structure (headers, rows, cells)

2. **Inline code blocks** - Original issue from PR apache#32420 (apache#32416)
   - Ensures backticks work correctly

3. **Additional GFM features** - Comprehensive coverage
   - Strikethrough text
   - Task lists with checkboxes

4. **Complex integration** - Real-world scenario
   - Multiple GFM features together
   - Mimics actual dashboard markdown usage

Each test includes detailed comments explaining:
- Why remark-gfm is pinned to v3
- The dependency compatibility constraints
- Historical context (PRs apache#32420, apache#32945)
- What will break if upgraded incorrectly

These tests address reviewer concerns from @sadpandajoe about preventing
future breakage and demonstrating the root cause of the incompatibility.
rebenitez1802 added a commit to rebenitez1802/superset that referenced this pull request Jan 8, 2026
This commit addresses a critical dependency incompatibility that causes
the "Cannot set properties of undefined (setting 'inTable')" error when
rendering tables in Markdown components.

## Problem
- remark-gfm v4.0.1 requires remark-parser v11+ (unified v11)
- react-markdown v8.0.7 uses remark-parser v10 (unified v10)
- This version mismatch breaks table rendering in Markdown components

## Solution
1. Downgraded remark-gfm from ^4.0.1 to ^3.0.1 in @superset-ui/core
2. Added npm override in root package.json to prevent auto-upgrades
3. Regenerated package-lock.json to reflect the downgrade

## Related Issues
- This issue was previously fixed in PR apache#32420 (March 2025)
- Dependabot re-introduced the bug by auto-bumping to v4.0.1 (July 2025)
- The npm override prevents this from happening again

## Alternative Solution
Upgrading to react-markdown v9+ would allow remark-gfm v4+, but that
would be a larger change requiring broader testing.

## Testing
Tables in Markdown components now render correctly without errors.
rebenitez1802 added a commit to rebenitez1802/superset that referenced this pull request Jan 8, 2026
Add automated tests to prevent future dependency upgrades from breaking
markdown rendering functionality. These tests will fail if remark-gfm is
upgraded to v4+ without upgrading react-markdown to v9+ (requires React 18).

Tests cover:
1. **Table rendering** - The critical regression from PR apache#32945
   - Verifies tables render without "Cannot set properties of undefined" error
   - Tests table structure (headers, rows, cells)

2. **Inline code blocks** - Original issue from PR apache#32420 (apache#32416)
   - Ensures backticks work correctly

3. **Additional GFM features** - Comprehensive coverage
   - Strikethrough text
   - Task lists with checkboxes

4. **Complex integration** - Real-world scenario
   - Multiple GFM features together
   - Mimics actual dashboard markdown usage

Each test includes detailed comments explaining:
- Why remark-gfm is pinned to v3
- The dependency compatibility constraints
- Historical context (PRs apache#32420, apache#32945)
- What will break if upgraded incorrectly

These tests address reviewer concerns from @sadpandajoe about preventing
future breakage and demonstrating the root cause of the incompatibility.
rebenitez1802 added a commit to rebenitez1802/superset that referenced this pull request Jan 12, 2026
This commit addresses a critical dependency incompatibility that causes
the "Cannot set properties of undefined (setting 'inTable')" error when
rendering tables in Markdown components.

## Problem
- remark-gfm v4.0.1 requires remark-parser v11+ (unified v11)
- react-markdown v8.0.7 uses remark-parser v10 (unified v10)
- This version mismatch breaks table rendering in Markdown components

## Solution
1. Downgraded remark-gfm from ^4.0.1 to ^3.0.1 in @superset-ui/core
2. Added npm override in root package.json to prevent auto-upgrades
3. Regenerated package-lock.json to reflect the downgrade

## Related Issues
- This issue was previously fixed in PR apache#32420 (March 2025)
- Dependabot re-introduced the bug by auto-bumping to v4.0.1 (July 2025)
- The npm override prevents this from happening again

## Alternative Solution
Upgrading to react-markdown v9+ would allow remark-gfm v4+, but that
would be a larger change requiring broader testing.

## Testing
Tables in Markdown components now render correctly without errors.
rebenitez1802 added a commit to rebenitez1802/superset that referenced this pull request Jan 12, 2026
Add automated tests to prevent future dependency upgrades from breaking
markdown rendering functionality. These tests will fail if remark-gfm is
upgraded to v4+ without upgrading react-markdown to v9+ (requires React 18).

Tests cover:
1. **Table rendering** - The critical regression from PR apache#32945
   - Verifies tables render without "Cannot set properties of undefined" error
   - Tests table structure (headers, rows, cells)

2. **Inline code blocks** - Original issue from PR apache#32420 (apache#32416)
   - Ensures backticks work correctly

3. **Additional GFM features** - Comprehensive coverage
   - Strikethrough text
   - Task lists with checkboxes

4. **Complex integration** - Real-world scenario
   - Multiple GFM features together
   - Mimics actual dashboard markdown usage

Each test includes detailed comments explaining:
- Why remark-gfm is pinned to v3
- The dependency compatibility constraints
- Historical context (PRs apache#32420, apache#32945)
- What will break if upgraded incorrectly

These tests address reviewer concerns from @sadpandajoe about preventing
future breakage and demonstrating the root cause of the incompatibility.
rebenitez1802 added a commit to rebenitez1802/superset that referenced this pull request Jan 14, 2026
This commit addresses a critical dependency incompatibility that causes
the "Cannot set properties of undefined (setting 'inTable')" error when
rendering tables in Markdown components.

## Problem
- remark-gfm v4.0.1 requires remark-parser v11+ (unified v11)
- react-markdown v8.0.7 uses remark-parser v10 (unified v10)
- This version mismatch breaks table rendering in Markdown components

## Solution
1. Downgraded remark-gfm from ^4.0.1 to ^3.0.1 in @superset-ui/core
2. Added npm override in root package.json to prevent auto-upgrades
3. Regenerated package-lock.json to reflect the downgrade

## Related Issues
- This issue was previously fixed in PR apache#32420 (March 2025)
- Dependabot re-introduced the bug by auto-bumping to v4.0.1 (July 2025)
- The npm override prevents this from happening again

## Alternative Solution
Upgrading to react-markdown v9+ would allow remark-gfm v4+, but that
would be a larger change requiring broader testing.

## Testing
Tables in Markdown components now render correctly without errors.
rebenitez1802 added a commit to rebenitez1802/superset that referenced this pull request Jan 14, 2026
Add automated tests to prevent future dependency upgrades from breaking
markdown rendering functionality. These tests will fail if remark-gfm is
upgraded to v4+ without upgrading react-markdown to v9+ (requires React 18).

Tests cover:
1. **Table rendering** - The critical regression from PR apache#32945
   - Verifies tables render without "Cannot set properties of undefined" error
   - Tests table structure (headers, rows, cells)

2. **Inline code blocks** - Original issue from PR apache#32420 (apache#32416)
   - Ensures backticks work correctly

3. **Additional GFM features** - Comprehensive coverage
   - Strikethrough text
   - Task lists with checkboxes

4. **Complex integration** - Real-world scenario
   - Multiple GFM features together
   - Mimics actual dashboard markdown usage

Each test includes detailed comments explaining:
- Why remark-gfm is pinned to v3
- The dependency compatibility constraints
- Historical context (PRs apache#32420, apache#32945)
- What will break if upgraded incorrectly

These tests address reviewer concerns from @sadpandajoe about preventing
future breakage and demonstrating the root cause of the incompatibility.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

🏷️ bot A label used by `supersetbot` to keep track of which PR where auto-tagged with release labels dashboard:markdown Related to the markdown component of the Dashboard dependencies:npm packages size/XS v5.0 Label added by the release manager to track PRs to be included in the 5.0 branch 🍒 5.0.0 Cherry-picked to 5.0.0

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Markdown apostrophe (``) use to highlight a keyword not working

4 participants