Wait for the blob editor before opening the commit changes modal

What does this MR do and why?

Stacked on !255321 (merged). Merge that MR first. This MR targets its branch and only adds one commit.

The blob edit header mounts right after EditBlob is created, while the editor still loads the file. A click on Commit changes during that time did nothing:

  • openModal in app/assets/javascripts/repository/pages/blob_edit_header.vue reads the file path through this.editor.filepathFormMediator?..
  • filepathFormMediator is only assigned after the raw file request resolves.
  • So the early click found no file path and returned. No modal opened, and no validation error showed, because the optional chain skipped it.

This is the same race as the tab and soft wrap handlers fixed in !255321 (merged). It depends on the editorReady promise that MR adds to EditBlob.

Changes made:

  • app/assets/javascripts/repository/pages/blob_edit_header.vue
    • openModal awaits this.editor.editorReady before it reads the file path. An early click opens the modal once the editor exists.
  • spec/frontend/repository/pages/blob_edit_header_spec.js
    • Adds editorReady to the mock editor.
    • New test: click Commit changes while editorReady is pending, check no content is read, resolve it, check the modal receives the content.
    • Awaits the click helper in the existing tests, since openModal is now async.

Found during a sweep of SourceEditor consumers for the same readiness race. This was the only other un-gated handler on the deferred editor instance.

How to set up and validate locally

  1. Open any file in a project and click Edit > Edit single file.
  2. In DevTools, throttle the network to "Slow 3G" and reload.
  3. Click Commit changes as soon as the header appears, before the editor content loads.
  4. Check the commit modal opens once the file has loaded, with the file content.
  5. Remove the throttling and check the modal still opens at once.

Screenshots

Both shots: Commit changes clicked while the raw file request was held, then the request released.

Before After
before: file loaded, click lost, no modal after: modal opens once the file has loaded

MR acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

References

🤖 Generated with Claude Code

Edited by Miguel Rincon

Merge request reports

Loading
Loading