Skip to content

Add support for collapsible content in content editor

Himanshu Kapoor requested to merge 332082-details into master

What does this MR do?

Issue: #332082 (closed)

Content editor now supports details/summary elements to render and edit collapsible content.

Related MRs:

Screenshots or Screencasts (strongly suggested)

image

How to setup and validate locally (strongly suggested)

Rendering a collapsible section

  1. Create a new wiki page, or edit an existing one

  2. Type in the following HTML in the markdown editor:

    <details>
    <summary>click here to expand</summary>
    
    this portion will be _hidden_!
    
    </summary>
  3. Switch to new editor by clicking "use new editor".

  4. The collapsible section renders successfully.

  5. Save with or without making any changes.

  6. Edit the page again

  7. Note that the markdown / HTML for the details is correct.

Creating a new collapsible section

  1. Type <details> in content editor to insert a new collapsible section. Or use the "Add a collapsible section" icon in the toolbar to insert it.
  2. Press Enter when within a details summary to make it continue to the collapsed content.
  3. Click the arrow icon in the collapsible section to expand or collapse the section.
  4. Press Shift + Tab in the middle of collapsed section to convert it to a regular paragraph. If you press this shortcut in the details summary, the summary turns into a regular paragraph and the first line in the collapsed content becomes the new summary.
  5. Press Enter twice on the last item to exit the collapsible section and start a new paragraph.

Does this MR meet the acceptance criteria?

Conformity

Availability and Testing

Security

Does this MR contain changes to processing or storing of credentials or tokens, authorization and authentication methods or other items described in the security review guidelines? If not, then delete this Security section.

  • Label as security and @ mention @gitlab-com/gl-security/appsec
  • The MR includes necessary changes to maintain consistency between UI, API, email, or other methods
  • Security reports checked/validated by a reviewer from the AppSec team

Related to #332082 (closed)

Edited by Himanshu Kapoor

Merge request reports

Loading