Ensure the Markdown extensions on tab click

Why

Follow-up to Unify the definitions of "Markdown" behind edit... (!253025 - merged). Closes Live preview is driven by two competing definit... (#619238 - closed).

Unify the definitions of "Markdown" behind edit... (!253025 - merged) drove extension loading and unloading from the file name alone, but tab selection still reads whatever markdownExtensions holds at that point (Follow mid-edit renames to Markdown in the "Pre... (!250889 - merged)). So clicking the Preview tab while the load is in flight, or after it has failed, shows the rendered preview pane even though the file is Markdown. Worse, after a failure the extensions stay unloaded until you touch the file name again.

This MR applies the same definition when a tab is clicked, closing the last gap in Live preview is driven by two competing definit... (#619238 - closed).

What this MR does

When clicking a tab, if the file name is Markdown, await installMarkdownExtensions() before showing the pane. If a load is in flight, this hits the cached promise (Fix races between Markdown extension loading an... (!251306 - merged)). If a previous load failed, the tab click triggers a retry.

If that retry fails too, fall back to the rendered preview pane as before.

---
title: Opens the live preview once the in-flight load resolves
config:
  fontSize: 14
---

sequenceDiagram
    autonumber
    actor User
    participant EditBlob
    participant Import as dynamic import
    participant MdServer as previewMarkdownPath

    User->>EditBlob: open or rename a file as foo.md
    EditBlob->>+Import: start loading the Markdown extensions

    rect
        note right of User: the load is still in flight
        User->>EditBlob: click the Preview tab
        Note over EditBlob: await hits the cached promise —<br>no second load
    end

    Import-->>-EditBlob: import resolves
    EditBlob->>EditBlob: show the editor pane + live preview panel
    EditBlob->>+MdServer: POST the editor content
    MdServer-->>-EditBlob: rendered HTML in the live preview
---
title: Falls back to the rendered preview pane when the retry fails too
config:
  fontSize: 14
---

sequenceDiagram
    autonumber
    actor User
    participant EditBlob
    participant Import as dynamic import
    participant Server as previewUrl

    User->>EditBlob: open or rename a file as foo.md
    EditBlob->>+Import: start loading the Markdown extensions
    Import--x-EditBlob: load fails (alert, cache cleared)

    User->>EditBlob: click the Preview tab
    Note over EditBlob: cache is empty — await starts a fresh load
    EditBlob->>+Import: retry the load
    Import--x-EditBlob: fails again (alert)
    Note over Import: a persistent failure — e.g. the chunk<br>is gone after a deploy

    Note over EditBlob: no extensions — no live preview
    EditBlob->>+Server: POST the editor content
    Note over Server: a plain request to the app —<br>alive even when assets are not
    Server-->>-EditBlob: rendered HTML
    EditBlob->>EditBlob: show the rendered preview pane

References

How to set up and validate locally

The race requires acting before the load completes, so emulate a slow connection:

  1. In DevTools, set network throttling to Slow 4G or similar, and check Disable cache.
  2. In a repository, open the new file page (+ > New file).
  3. Name the file foo.md, then click the Preview tab before the extensions finish loading.

Before this change, the rendered preview pane shows up. After, the tab waits for the load and opens the live preview.

To exercise the fallback, block the chunk requests in DevTools before clicking the Preview tab. The rendered preview pane should appear.

MR acceptance checklist

Evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.

Edited by skkzsh

Merge request reports

Loading
Loading