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
- Issue #583560 — Address
vue/v-on-event-hyphenationoffenses - vue/v-on-event-hyphenation ESLint rule docs
- Related to: #583560
Screenshots or screen recordings
How to set up and validate locally
-
Check out this branch in your GDK environment
-
Run ESLint to confirm no violations exist in the fixed files:
yarn eslint app/assets/javascripts/ci/pipeline_details/graph/components/ --no-warn-ignoredExpected: no errors
-
Navigate to any project with pipelines at
http://gdk.local:3000 -
Open a pipeline and view the graph — job nodes, stage columns, and linked pipelines should render and interact correctly
-
Confirm the 5 files are no longer listed in
.eslint_todo/vue-v-on-event-hyphenation.mjs -
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