Skip to content

Store breadcrumbs as JSON data attribute in DOM

Thomas Hutterer requested to merge 358113-prepare-json-data-for-vue-breadcrumbs into master

What does this MR do and why?

This stores the breadcrumbs (that we currently still render with Haml) as JSON in a data attribute, behind a wip feature flag.

This is the first step towards replacing our Haml-rendered (not fully Pajamas-compliant) page breadcrumbs with a GlBreadcrumb Vue component. See the feature issue #358113 for more context.

This builds on the existing mechanism for our schema.org breadcrumbs, but adds avatar urls for project and groups.

MR acceptance checklist

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

Screenshots or screen recordings

No visual change yet.

How to set up and validate locally

  • Enable the vue_page_breadcrumbs feature flag.
  • Search the DOM for the #js-vue-page-breadcrumbs element and check its data-breadcrumbs-json attribute. It should match with the rendered breadcrumbs on top of the page.
Edited by Thomas Hutterer

Merge request reports