Guard snippet view against empty and errored GraphQL responses

What does this MR do and why?

Fixes a production Sentry error (TypeError: Cannot read properties of undefined (reading 'updateSnippet')). There are two distinct crash paths.

  1. GetSnippetQuery can succeed but return an empty nodes array — likely an authorization edge case where GraphQL reports success but yields no snippet. The snippets mixin was setting snippet to {} in that case, and snippet_header.vue then read snippet.userPermissions.updateSnippet from it unconditionally, throwing.
  2. vue-apollo v3 calls a smart query's update() hook with undefined data on errored responses unless errorPolicy is explicitly 'none'. All three snippet queries were reading into the payload unguarded, so a network or GraphQL error would also throw.

The fix addresses both paths.

  1. For the empty-response case, optional chaining guards the permission reads in the snippet header, and the snippet show page renders a danger alert ("Could not load the snippet. Refresh the page and try again.") instead of mounting the snippet components when no snippet is returned.
  2. For the error case, explicit errorPolicy: ERROR_POLICY_NONE is added to the three snippet queries, with an error() hook in the mixin that sets an error flag and reports to Sentry.

This mirrors the patterns established by !254565 (merged) and https://gitlab.com/gitlab-org/gitlab/-/work_items/625054 (blob_content_viewer) as part of the Sentry Signal Loop epic.

References

Screenshots or screen recordings

Taken on a local instance with GetSnippetQuery stubbed to return empty nodes (the production failure mode) — before = master, after = this branch.

Before After
before-crash after-error-alert
Snippet content never renders (TypeError: Cannot read properties of undefined (reading 'updateSnippet') in console) Danger alert: "Could not load the snippet. Refresh the page and try again."

How to set up and validate locally

  1. Visit any snippet page (personal or project) — it should render normally as a regression check.
  2. To trigger the new error state: open DevTools → Network, enable request blocking for /api/graphql, then reload the snippet page. The page should display the danger alert instead of crashing or spinning indefinitely.

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 Chaoyue Zhao

Merge request reports

Loading
Loading