Merge branch 'renovate/major-gitlab-packages' into 'master'

Update dependency @gitlab/eslint-plugin to v5

See merge request gitlab-org/gitlab!47607

app/assets/javascripts/blob/components/blob_header.vue

@@ -66,7 +66,7 @@ export default {
 <template>
   <div class="js-file-title file-title-flex-parent">
     <blob-filepath :blob="blob">
-      <template #filepathPrepend>
+      <template #filepath-prepend>
         <slot name="prepend"></slot>
       </template>
     </blob-filepath>

app/assets/javascripts/blob/components/blob_header_filepath.vue

@@ -26,7 +26,7 @@ export default {
 </script>
 <template>
   <div class="file-header-content d-flex align-items-center lh-100">
-    <slot name="filepathPrepend"></slot>
+    <slot name="filepath-prepend"></slot>
 
     <template v-if="blob.path">
       <file-icon :file-name="blob.path" :size="18" aria-hidden="true" css-classes="mr-2" />

app/assets/javascripts/clusters/components/application_row.vue

@@ -343,7 +343,7 @@ export default {
           >
           <span v-else class="js-cluster-application-title">{{ title }}</span>
         </strong>
-        <slot name="installedVia"></slot>
+        <slot name="installed-via"></slot>
         <div>
           <slot name="description"></slot>
         </div>

app/assets/javascripts/clusters/components/applications.vue

@@ -549,8 +549,8 @@ export default {
             @set="setKnativeDomain"
           />
         </template>
-        <template v-if="cloudRun" #installedVia>
-          <span data-testid="installedVia">
+        <template v-if="cloudRun" #installed-via>
+          <span data-testid="installed-via">
             <gl-sprintf
               :message="s__('ClusterIntegration|installed via %{linkStart}Cloud Run%{linkEnd}')"
             >

app/assets/javascripts/design_management/components/design_notes/design_discussion.vue

@@ -210,7 +210,7 @@ export default {
         :class="{ 'gl-bg-blue-50': isDiscussionActive }"
         @error="$emit('update-note-error', $event)"
       >
-        <template v-if="discussion.resolvable" #resolveDiscussion>
+        <template v-if="discussion.resolvable" #resolve-discussion>
           <button
             v-gl-tooltip
             :class="{ 'is-active': discussion.resolved }"
@@ -224,7 +224,7 @@ export default {
             <gl-loading-icon v-else inline />
           </button>
         </template>
-        <template v-if="discussion.resolved" #resolvedStatus>
+        <template v-if="discussion.resolved" #resolved-status>
           <p class="gl-text-gray-500 gl-font-sm gl-m-0 gl-mt-5" data-testid="resolved-message">
             {{ __('Resolved by') }}
             <gl-link
@@ -277,7 +277,7 @@ export default {
             @submit-form="mutate"
             @cancel-form="hideForm"
           >
-            <template v-if="discussion.resolvable" #resolveCheckbox>
+            <template v-if="discussion.resolvable" #resolve-checkbox>
               <label data-testid="resolve-checkbox">
                 <input v-model="shouldChangeResolvedStatus" type="checkbox" />
                 {{ resolveCheckboxText }}

app/assets/javascripts/design_management/components/design_notes/design_note.vue

@@ -108,7 +108,7 @@ export default {
         </span>
       </div>
       <div class="gl-display-flex gl-align-items-baseline">
-        <slot name="resolveDiscussion"></slot>
+        <slot name="resolve-discussion"></slot>
         <button
           v-if="isEditButtonVisible"
           v-gl-tooltip
@@ -127,7 +127,7 @@ export default {
         class="note-text js-note-text md"
         data-qa-selector="note_content"
       ></div>
-      <slot name="resolvedStatus"></slot>
+      <slot name="resolved-status"></slot>
     </template>
     <apollo-mutation
       v-else

app/assets/javascripts/design_management/components/design_notes/design_reply_form.vue

@@ -110,7 +110,7 @@ export default {
         </textarea>
       </template>
     </markdown-field>
-    <slot name="resolveCheckbox"></slot>
+    <slot name="resolve-checkbox"></slot>
     <div class="note-form-actions gl-display-flex gl-justify-content-space-between">
       <gl-button
         ref="submitButton"

app/assets/javascripts/design_management/components/design_sidebar.vue

@@ -207,6 +207,6 @@ export default {
         />
       </gl-collapse>
     </template>
-    <slot name="replyForm"></slot>
+    <slot name="reply-form"></slot>
   </div>
 </template>

app/assets/javascripts/design_management/pages/design/index.vue

@@ -383,7 +383,7 @@ export default {
         @toggleResolvedComments="toggleResolvedComments"
         @todoError="onTodoError"
       >
-        <template #replyForm>
+        <template #reply-form>
           <apollo-mutation
             v-if="isAnnotating"
             #default="{ mutate, loading }"

app/assets/javascripts/environments/components/container.vue

@@ -69,7 +69,7 @@ export default {
   <div class="environments-container">
     <gl-loading-icon v-if="isLoading" size="md" class="gl-mt-3" label="Loading environments" />
 
-    <slot name="emptyState"></slot>
+    <slot name="empty-state"></slot>
 
     <div v-if="!isLoading && environments.length > 0" class="table-holder">
       <environment-table

app/assets/javascripts/environments/components/environments_app.vue

@@ -228,7 +228,7 @@ export default {
         :deploy-boards-help-path="deployBoardsHelpPath"
         @onChangePage="onChangePage"
       >
-        <template v-if="!isLoading && state.environments.length === 0" #emptyState>
+        <template v-if="!isLoading && state.environments.length === 0" #empty-state>
           <empty-state :help-path="helpPagePath" />
         </template>
       </container>

app/assets/javascripts/incidents/components/incidents_list.vue

@@ -419,7 +419,7 @@ export default {
           </template>
         </gl-table>
       </template>
-      <template #emtpy-state>
+      <template #empty-state>
         <gl-empty-state
           :title="emptyStateData.title"
           :svg-path="emptyListSvgPath"

app/assets/javascripts/monitoring/components/dashboard.vue

@@ -423,7 +423,7 @@ export default {
         :prometheus-alerts-available="prometheusAlertsAvailable"
         @timerangezoom="onTimeRangeZoom"
       >
-        <template #topLeft>
+        <template #top-left>
           <gl-button
             ref="goBackBtn"
             v-gl-tooltip

app/assets/javascripts/monitoring/components/dashboard_panel.vue

@@ -365,7 +365,7 @@ export default {
 <template>
   <div v-gl-resize-observer="onResize" class="prometheus-graph">
     <div class="d-flex align-items-center">
-      <slot name="topLeft"></slot>
+      <slot name="top-left"></slot>
       <h5
         ref="graphTitle"
         class="prometheus-graph-title gl-font-lg font-weight-bold text-truncate gl-mr-3"

app/assets/javascripts/related_issues/components/related_issues_block.vue

@@ -138,7 +138,7 @@ export default {
             href="#related-issues"
             aria-hidden="true"
           />
-          <slot name="headerText">{{ __('Linked issues') }}</slot>
+          <slot name="header-text">{{ __('Linked issues') }}</slot>
           <gl-link
             v-if="hasHelpPath"
             :href="helpPath"
@@ -167,7 +167,7 @@ export default {
             />
           </div>
         </h3>
-        <slot name="headerActions"></slot>
+        <slot name="header-actions"></slot>
       </div>
       <div
         class="linked-issues-card-body bg-gray-light"

app/assets/javascripts/reports/components/grouped_test_reports_app.vue

@@ -134,7 +134,7 @@ export default {
     class="mr-widget-section grouped-security-reports mr-report"
     @toggleEvent="handleToggleEvent"
   >
-    <template v-if="showViewFullReport" #actionButtons>
+    <template v-if="showViewFullReport" #action-buttons>
       <gl-button
         :href="testTabURL"
         target="_blank"
@@ -145,7 +145,7 @@ export default {
         {{ s__('ciReport|View full report') }}
       </gl-button>
     </template>
-    <template v-if="hasRecentFailures(summary)" #subHeading>
+    <template v-if="hasRecentFailures(summary)" #sub-heading>
       {{ recentFailuresText(summary) }}
     </template>
     <template #body>

app/assets/javascripts/reports/components/report_section.vue

@@ -181,10 +181,10 @@ export default {
             <slot :name="slotName"></slot>
             <popover v-if="hasPopover" :options="popoverOptions" class="gl-ml-2" />
           </div>
-          <slot name="subHeading"></slot>
+          <slot name="sub-heading"></slot>
         </div>
 
-        <slot name="actionButtons"></slot>
+        <slot name="action-buttons"></slot>
 
         <button
           v-if="isCollapsible"

app/assets/javascripts/vue_shared/components/paginated_table_with_search_and_tabs/paginated_table_with_search_and_tabs.vue

@@ -308,6 +308,6 @@ export default {
       @input="handlePageChange"
     />
 
-    <slot v-if="!showItems" name="emtpy-state"></slot>
+    <slot v-if="!showItems" name="empty-state"></slot>
   </div>
 </template>

app/assets/javascripts/vue_shared/components/upload_dropzone/upload_dropzone.vue

@@ -147,7 +147,7 @@ export default {
         class="card upload-dropzone-border upload-dropzone-overlay gl-w-full gl-h-full gl-absolute gl-display-flex gl-align-items-center gl-justify-content-center gl-p-3 gl-bg-white"
       >
         <div v-show="!isDragDataValid" class="mw-50 gl-text-center">
-          <slot name="invalidDragDataSlot">
+          <slot name="invalid-drag-data-slot">
             <h3 :class="{ 'gl-font-base gl-display-inline': !displayAsCard }">
               {{ __('Oh no!') }}
             </h3>
@@ -159,7 +159,7 @@ export default {
           </slot>
         </div>
         <div v-show="isDragDataValid" class="mw-50 gl-text-center">
-          <slot name="validDragDataSlot">
+          <slot name="valid-drag-data-slot">
             <h3 :class="{ 'gl-font-base gl-display-inline': !displayAsCard }">
               {{ __('Incoming!') }}
             </h3>

ee/app/assets/javascripts/security_configuration/sast/components/configuration_form.vue

@@ -147,7 +147,7 @@ export default {
         </gl-link>
       </template>
 
-      <template #subheading>
+      <template #sub-heading>
         {{ $options.i18n.analyzersSubHeading }}
       </template>
 

ee/app/assets/javascripts/security_configuration/sast/components/expandable_section.vue

@@ -39,8 +39,8 @@ export default {
         <component :is="headingTag" class="gl-font-size-h2 gl-mt-0" data-testid="heading">
           <slot name="heading"></slot>
         </component>
-        <p class="gl-mb-0" data-testid="subheading">
-          <slot name="subheading"></slot>
+        <p class="gl-mb-0" data-testid="sub-heading">
+          <slot name="sub-heading"></slot>
         </p>
       </div>
 

ee/app/assets/javascripts/security_dashboard/components/first_class_vulnerability_severities.vue

@@ -186,7 +186,7 @@ export default {
               </span>
             </h5>
           </template>
-          <template #subTitle>
+          <template #sub-title>
             <p class="gl-m-0 gl-ml-7 gl-pb-2 gl-text-gray-500">{{ severityGroup.warning }}</p>
           </template>
           <div class="gl-ml-7 gl-pb-3">

ee/app/assets/javascripts/security_dashboard/components/pipeline_security_dashboard.vue

@@ -118,7 +118,7 @@ export default {
       :loading-error-illustrations="loadingErrorIllustrations"
       :security-report-summary="securityReportSummary"
     >
-      <template #emptyState>
+      <template #empty-state>
         <gl-empty-state v-bind="emptyStateProps" />
       </template>
     </security-dashboard>

ee/app/assets/javascripts/security_dashboard/components/security_dashboard_table.vue

@@ -110,7 +110,7 @@ export default {
         @openModal="openModal({ vulnerability })"
       />
 
-      <slot v-if="showEmptyState" name="emptyState">
+      <slot v-if="showEmptyState" name="empty-state">
         <gl-empty-state
           :title="s__(`We've found no vulnerabilities`)"
           :description="

ee/app/assets/javascripts/security_dashboard/components/security_dashboard_vuex.vue

@@ -129,8 +129,8 @@ export default {
         </template>
 
         <security-dashboard-table>
-          <template #emptyState>
-            <slot name="emptyState"></slot>
+          <template #empty-state>
+            <slot name="empty-state"></slot>
           </template>
         </security-dashboard-table>
 

ee/app/assets/javascripts/threat_monitoring/components/network_policy_list.vue

@@ -233,7 +233,7 @@ export default {
       </template>
 
       <template #empty>
-        <slot name="emptyState">
+        <slot name="empty-state">
           <gl-empty-state
             ref="tableEmptyState"
             :title="s__('NetworkPolicies|No policies detected')"

ee/app/assets/javascripts/vue_shared/components/accordion/accordion_item.vue

@@ -120,7 +120,7 @@ export default {
         :aria-labelledby="buttonId"
         role="region"
       >
-        <slot name="subTitle"></slot>
+        <slot name="sub-title"></slot>
         <div ref="content" :style="contentStyles"><slot name="default"></slot></div>
       </div>
     </template>

ee/app/assets/javascripts/vue_shared/license_compliance/mr_widget_license_report.vue

@@ -179,7 +179,7 @@ export default {
           </gl-link>
         </div>
       </template>
-      <div v-if="showActionButtons" slot="actionButtons" class="gl-mr-3">
+      <div v-if="showActionButtons" slot="action-buttons" class="gl-mr-3">
         <a
           v-if="licenseManagementSettingsPath"
           :class="{ 'gl-mr-3': fullReportPath }"

ee/app/assets/javascripts/vue_shared/security_reports/grouped_security_reports_app.vue

@@ -401,7 +401,7 @@ export default {
       <security-summary :key="slot" :message="groupedSummaryText" />
     </template>
 
-    <template v-if="pipelinePath" #actionButtons>
+    <template v-if="pipelinePath" #action-buttons>
       <gl-button
         :href="securityTab"
         target="_blank"
@@ -412,7 +412,7 @@ export default {
       </gl-button>
     </template>
 
-    <template v-if="isMRActive && isBaseSecurityReportOutOfDate" #subHeading>
+    <template v-if="isMRActive && isBaseSecurityReportOutOfDate" #sub-heading>
       <div class="text-secondary-700 text-1">
         <gl-sprintf
           v-if="isMRBranchOutdated"

ee/app/assets/javascripts/vulnerabilities/components/related_issues.vue

@@ -264,7 +264,7 @@ export default {
       <template #headerText>
         {{ $options.i18n.relatedIssues }}
       </template>
-      <template v-if="canCreateIssue" #headerActions>
+      <template v-if="canCreateIssue" #header-actions>
         <gl-button
           ref="createIssue"
           variant="success"

ee/spec/frontend/security_configuration/sast/components/expandable_section_spec.js

@@ -10,7 +10,7 @@ describe('ExpandableSection component', () => {
 
   const findButton = () => wrapper.find('button');
   const findHeading = () => wrapper.find('[data-testid="heading"]');
-  const findSubHeading = () => wrapper.find('[data-testid="subheading"]');
+  const findSubHeading = () => wrapper.find('[data-testid="sub-heading"]');
   const findContent = () => wrapper.find('[data-testid="content"]');
 
   afterEach(() => {
@@ -50,7 +50,7 @@ describe('ExpandableSection component', () => {
   describe('subheading slot', () => {
     beforeEach(() => {
       createComponent({
-        slots: { subheading: 'some subheading' },
+        slots: { 'sub-heading': 'some subheading' },
       });
     });
 

ee/spec/frontend/security_dashboard/components/pipeline_security_dashboard_spec.js

@@ -98,7 +98,7 @@ describe('Pipeline Security Dashboard component', () => {
     beforeEach(() => {
       factory({
         stubs: {
-          'security-dashboard': { template: '<div><slot name="emptyState"></slot></div>' },
+          'security-dashboard': { template: '<div><slot name="empty-state"></slot></div>' },
         },
       });
     });

ee/spec/frontend/security_dashboard/components/security_dashboard_table_spec.js

@@ -118,7 +118,7 @@ describe('Security Dashboard Table', () => {
         localVue,
         store,
         slots: {
-          emptyState: '<div class="customEmptyState">Hello World</div>',
+          'empty-state': '<div class="customEmptyState">Hello World</div>',
         },
       });
 

package.json

@@ -162,7 +162,7 @@
   },
   "devDependencies": {
     "@babel/plugin-transform-modules-commonjs": "^7.10.1",
-    "@gitlab/eslint-plugin": "4.1.0",
+    "@gitlab/eslint-plugin": "5.0.0",
     "@testing-library/dom": "^7.16.2",
     "@vue/test-utils": "1.0.0-beta.30",
     "acorn": "^6.3.0",

spec/frontend/blob/components/blob_header_filepath_spec.js

@@ -65,7 +65,7 @@ describe('Blob Header Filepath', () => {
         {},
         {
           scopedSlots: {
-            filepathPrepend: `<span>${slotContent}</span>`,
+            'filepath-prepend': `<span>${slotContent}</span>`,
           },
         },
       );

spec/frontend/clusters/components/__snapshots__/applications_spec.js.snap

@@ -73,7 +73,7 @@ exports[`Applications Ingress application shows the correct warning message 1`]
 
 exports[`Applications Knative application shows the correct description 1`] = `
 <span
-  data-testid="installedVia"
+  data-testid="installed-via"
 >
   installed via 
   <a

spec/frontend/clusters/components/applications_spec.js

@@ -429,7 +429,7 @@ describe('Applications', () => {
 
       await wrapper.vm.$nextTick();
 
-      expect(findByTestId('installedVia').element).toMatchSnapshot();
+      expect(findByTestId('installed-via').element).toMatchSnapshot();
     });
 
     it('emits saveKnativeDomain event when knative domain editor emits save event', () => {

spec/frontend/issuable/related_issues/components/related_issues_block_spec.js

@@ -56,7 +56,7 @@ describe('RelatedIssuesBlock', () => {
           pathIdSeparator: PathIdSeparator.Issue,
           issuableType: 'issue',
         },
-        slots: { headerText },
+        slots: { 'header-text': headerText },
       });
 
       expect(wrapper.find('.card-title').html()).toContain(headerText);
@@ -72,7 +72,7 @@ describe('RelatedIssuesBlock', () => {
           pathIdSeparator: PathIdSeparator.Issue,
           issuableType: 'issue',
         },
-        slots: { headerActions },
+        slots: { 'header-actions': headerActions },
       });
 
       expect(wrapper.find('[data-testid="custom-button"]').html()).toBe(headerActions);

spec/frontend/monitoring/components/dashboard_panel_spec.js

@@ -106,7 +106,7 @@ describe('Dashboard Panel', () => {
         {},
         {
           slots: {
-            topLeft: `<div class="top-left-content">OK</div>`,
+            'top-left': `<div class="top-left-content">OK</div>`,
           },
         },
       );

spec/frontend/monitoring/components/dashboard_spec.js

@@ -508,7 +508,7 @@ describe('Dashboard', () => {
       const mockKeyup = key => window.dispatchEvent(new KeyboardEvent('keyup', { key }));
 
       const MockPanel = {
-        template: `<div><slot name="topLeft"/></div>`,
+        template: `<div><slot name="top-left"/></div>`,
       };
 
       beforeEach(() => {

spec/frontend/reports/components/report_section_spec.js

@@ -244,7 +244,7 @@ describe('Report section', () => {
           hasIssues: true,
         },
         slots: {
-          actionButtons: ['Action!'],
+          'action-buttons': ['Action!'],
         },
       });
     });

spec/frontend/vue_shared/components/paginated_table_with_search_and_tabs/paginated_table_with_search_and_tabs_spec.js

@@ -70,7 +70,7 @@ describe('AlertManagementEmptyState', () => {
         ...props,
       },
       slots: {
-        'emtpy-state': EmptyStateSlot,
+        'empty-state': EmptyStateSlot,
         'header-actions': HeaderActionsSlot,
         title: TitleSlot,
         table: TableSlot,

yarn.lock

@@ -845,10 +845,10 @@
   resolved "https://registry.yarnpkg.com/@gitlab/at.js/-/at.js-1.5.5.tgz#5f6bfe6baaef360daa9b038fa78798d7a6a916b4"
   integrity sha512-282Dn3SPVsUHVDhMsXgfnv+Rzog0uxecjttxGRQvxh25es1+xvkGQFsvJfkSKJ3X1kHVkSjKf+Tt5Rra+Jhp9g==
 
-"@gitlab/eslint-plugin@4.1.0":
-  version "4.1.0"
-  resolved "https://registry.yarnpkg.com/@gitlab/eslint-plugin/-/eslint-plugin-4.1.0.tgz#b59b53b9cd984dc692cd094cca4fbe45e466c8b7"
-  integrity sha512-NjY8XqT9lPKxBiKeaIXAGPGuxLMmbns/W5YF/cqxfWMnMOCCGBPZjwwnPY5wzAeKocT014LCnA7k0ztIUN7DoQ==
+"@gitlab/eslint-plugin@5.0.0":
+  version "5.0.0"
+  resolved "https://registry.yarnpkg.com/@gitlab/eslint-plugin/-/eslint-plugin-5.0.0.tgz#502eb2bccb55d65d6310ce9ef2da76035b6fc319"
+  integrity sha512-zd4pa6D2OUuhPUD2QmyhfpZh7vuXKsNHaCHJdbTb2ld+mHel5IDqdidAzAshCI9On3e6o9XieD6l7rBTpN6H/g==
   dependencies:
     babel-eslint "^10.0.3"
     eslint-config-airbnb-base "^14.0.0"