Fix vue/v-on-event-hyphenation violations in CI pipeline graph components

What does this MR do and why?

Fixes vue/v-on-event-hyphenation ESLint violations in 5 Vue components in the CI pipeline graph directory and their parent wrapper by converting camelCase v-on event listeners to kebab-case and updating the corresponding $emit() calls in both the target files and their child components. Also updates Jest specs to match the new kebab-case event names.

The vue/v-on-event-hyphenation rule was enabled in !214221 (merged) (merged) and uncovered many existing violations across the codebase. These files were temporarily suppressed in .eslint_todo/vue-v-on-event-hyphenation.mjs. This MR properly remediates the violations and removes the 5 target files from the allowlist. It also partially remediates graph_component_wrapper.vue (2 of 5 listeners converted; the remaining 3 depend on child components outside this MR's scope).

References

Screenshots or screen recordings

How to set up and validate locally

  1. Check out this branch in your GDK environment

  2. Run ESLint to confirm no violations exist in the fixed files:

    yarn eslint app/assets/javascripts/ci/pipeline_details/graph/components/ --no-warn-ignored

    Expected: no errors

  3. Navigate to any project with pipelines at http://gdk.local:3000

  4. Open a pipeline and view the graph — job nodes, stage columns, and linked pipelines should render and interact correctly

  5. Confirm the 5 files are no longer listed in .eslint_todo/vue-v-on-event-hyphenation.mjs

  6. Run the related Jest specs to confirm they pass: yarn jest spec/frontend/ci/pipeline_details/graph/ --no-coverage

MR acceptance checklist

  • [x] Follow the style guides
  • [x] Changelog entry added, if necessary — not required for this linting/style fix
  • [x] No breaking changes introduced
  • [x] ESLint passes with no offenses on all changed files
Edited by Kent Tran

Merge request reports

Loading