feat(spx-gui): fixed the issue of merging line breaks after using a custom self-closing tag

[Overu]

Closed #2472

[gemini-code-assist[bot]]

Summary of Changes

Hello @Overu, I'm Gemini Code Assist[^1]! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

This pull request addresses a specific rendering anomaly within the MarkdownView component where custom self-closing tags, when immediately followed by a line break and text, would lead to an incorrect merging of content. By introducing a new preprocessing step, preprocessInlineComponents, the system now correctly interprets and separates such content into distinct paragraphs, significantly improving the accuracy and predictability of Markdown rendering for custom components.

Highlights

• Markdown Preprocessing Logic: Introduced a new preprocessInlineComponents function to specifically handle and correct the rendering of custom self-closing tags followed by line breaks and text in Markdown. This ensures proper paragraph separation instead of unintended merging into a single HTML block.
• Enhanced Markdown Rendering: Fixed an issue where custom self-closing tags, when followed by a newline and text, would incorrectly merge the subsequent text into the same HTML block. The new logic ensures that such text is treated as a distinct paragraph.
• Comprehensive Test Coverage: Added a dedicated test suite for preprocessInlineComponents covering various scenarios, along with new integration tests for MarkdownView to validate the correct rendering behavior of custom self-closing tags.
• Minor Text Update: A small textual correction was made in a tutorial constraint message.

Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature	Command	Description
Code Review	/gemini review	Performs a code review for the current pull request in its current state.
Pull Request Summary	/gemini summary	Provides a summary of the current pull request in its current state.
Comment	@gemini-code-assist	Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help	/gemini help	Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with :thumbsup: and :thumbsdown: on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

[^1]: Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution.

[xgopilot[bot]]

Code Review Summary

This PR successfully addresses issue #2472 with good test coverage and clear documentation. However, there are critical security and performance issues that must be addressed before merging.

Critical Issues:

• ReDoS vulnerability in regex pattern (line 158) - can freeze browser with malicious input
• Performance: Regex recompiled in loop during streaming causes significant overhead
• Typo: "frist" → "first" still present in tutorial-course-abandon.ts:14

Important Issues:

• Missing regex escaping for tag names (potential injection)
• Documentation example inconsistency (component name changes)
• Test descriptions say "merge" but function "separates"

The implementation is solid with excellent test coverage, but the regex pattern needs immediate attention for both security and performance. See inline comments for detailed recommendations.

[qiniu-ci]

This PR has been deployed to the preview environment. You can explore it using the preview URL.

[!WARNING] Please note that deployments in the preview environment are temporary and will be automatically cleaned up after a certain period. Make sure to explore it before it is removed. For any questions, contact the XBuilder team.