Skip to content

Migrate accessibility widget to V2

What does this MR do and why?

Migrate accessibility widget to V2 (the deprecation of this widget was reversed)

Convert index.js to index.vue, remove extension from mr_widget_options, import and add to list in widget/app.vue, update specs

Screenshots or screen recordings

Screenshots are required for UI changes, and strongly recommended for all other merge requests.

Before After
Screenshot_2023-10-31_at_15.47.16
Widget is mounted using the old registerExtension method, appears at the top
Screenshot_2023-10-31_at_15.46.32
Widget is mounted with the new <MrWidget /> method, appears at the bottom (this preserves the widget order from before widgets v2)

How to set up and validate locally

Numbered steps to set up and validate the change are strongly suggested.

  1. find/clone/make a project with a pipeline that generates accessibility reports (you can use this one if you don't have one already)
  2. open a merge request for the project
  3. run pipelines to generate accessibility reports for the base commit and the head commit of the merge request's branch
  4. navigate to the merge request and find the accessibility widget
  5. confirm that it's working as expected, it:
  • shows a loading state at first (Accessibility scanning results are being parsed)
  • shows the detected accessibility changes for the merge request (if there are any)
  • shows Accessibility scanning detected no issues for the source branch only if there are no changes
  • shows Accessibility scanning failed loading results on error

to run tests

yarn install && yarn jest vue_merge_request_widget/components/widget/app_spec.js vue_merge_request_widget/extentions/accessibility/index_spec.js

MR acceptance checklist

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

Edited by Miranda Fluharty

Merge request reports