Merge branch '339452-devops-adoption-remove-data-testid-constants' into 'master'

DevOps Adoption - Remove data-testid constants

See merge request gitlab-org/gitlab!72107

ee/app/assets/javascripts/analytics/devops_report/devops_adoption/components/devops_adoption_overview_table.vue

@@ -12,14 +12,11 @@ import { uniqueId } from 'lodash';
 import LocalStorageSync from '~/vue_shared/components/local_storage_sync.vue';
 import { formatNumber } from '~/locale';
 import {
-  TABLE_TEST_IDS_HEADERS,
   I18N_GROUP_COL_LABEL,
   I18N_TABLE_REMOVE_BUTTON_DISABLED,
   I18N_TABLE_REMOVE_BUTTON,
   I18N_OVERVIEW_TABLE_HEADER_GROUP,
   I18N_OVERVIEW_TABLE_HEADER_SUBGROUP,
-  TABLE_TEST_IDS_ACTIONS,
-  TABLE_TEST_IDS_NAMESPACE,
   DEVOPS_ADOPTION_TABLE_CONFIGURATION,
   OVERVIEW_TABLE_SORT_BY_STORAGE_KEY,
   OVERVIEW_TABLE_SORT_DESC_STORAGE_KEY,
@@ -39,7 +36,7 @@ const formatter = (value, key, item) => {
 
 const fieldOptions = {
   thClass,
-  thAttr: { 'data-testid': TABLE_TEST_IDS_HEADERS },
+  thAttr: { 'data-testid': 'headers' },
   sortable: true,
   sortByFormatted: true,
   formatter,
@@ -65,10 +62,6 @@ export default {
       default: null,
     },
   },
-  testids: {
-    ACTIONS: TABLE_TEST_IDS_ACTIONS,
-    NAMESPACE: TABLE_TEST_IDS_NAMESPACE,
-  },
   cols: DEVOPS_ADOPTION_TABLE_CONFIGURATION,
   sortByStorageKey: OVERVIEW_TABLE_SORT_BY_STORAGE_KEY,
   sortDescStorageKey: OVERVIEW_TABLE_SORT_DESC_STORAGE_KEY,
@@ -174,7 +167,7 @@ export default {
       </template>
 
       <template #cell(name)="{ item }">
-        <div :data-testid="$options.testids.NAMESPACE">
+        <div data-testid="namespace">
           <span v-if="item.group.latestSnapshot" class="gl-font-weight-bold">{{
             item.group.namespace.fullName
           }}</span>
@@ -206,10 +199,7 @@ export default {
       </template>
 
       <template #cell(actions)="{ item }">
-        <span
-          v-gl-tooltip.hover="getDeleteButtonTooltipText(item.group)"
-          :data-testid="$options.testids.ACTIONS"
-        >
+        <span v-gl-tooltip.hover="getDeleteButtonTooltipText(item.group)" data-testid="actions">
           <gl-button
             v-gl-modal="deleteModalId"
             :disabled="isCurrentGroup(item.group)"

ee/app/assets/javascripts/analytics/devops_report/devops_adoption/components/devops_adoption_table.vue

@@ -10,11 +10,6 @@ import {
 import { uniqueId } from 'lodash';
 import LocalStorageSync from '~/vue_shared/components/local_storage_sync.vue';
 import {
-  TABLE_TEST_IDS_HEADERS,
-  TABLE_TEST_IDS_NAMESPACE,
-  TABLE_TEST_IDS_ACTIONS,
-  TABLE_TEST_IDS_LOCAL_STORAGE_SORT_BY,
-  TABLE_TEST_IDS_LOCAL_STORAGE_SORT_DESC,
   TABLE_SORT_BY_STORAGE_KEY,
   TABLE_SORT_DESC_STORAGE_KEY,
   I18N_TABLE_REMOVE_BUTTON,
@@ -44,7 +39,7 @@ const thClass = ['gl-bg-white!', 'gl-text-gray-400'];
 
 const fieldOptions = {
   thClass,
-  thAttr: { 'data-testid': TABLE_TEST_IDS_HEADERS },
+  thAttr: { 'data-testid': 'headers' },
   formatter,
   sortable: true,
   sortByFormatted: true,
@@ -74,12 +69,6 @@ export default {
     removeButtonDisabled: I18N_TABLE_REMOVE_BUTTON_DISABLED,
     removeButton: I18N_TABLE_REMOVE_BUTTON,
   },
-  testids: {
-    NAMESPACE: TABLE_TEST_IDS_NAMESPACE,
-    ACTIONS: TABLE_TEST_IDS_ACTIONS,
-    LOCAL_STORAGE_SORT_BY: TABLE_TEST_IDS_LOCAL_STORAGE_SORT_BY,
-    LOCAL_STORAGE_SORT_DESC: TABLE_TEST_IDS_LOCAL_STORAGE_SORT_DESC,
-  },
   sortByStorageKey: TABLE_SORT_BY_STORAGE_KEY,
   sortDescStorageKey: TABLE_SORT_DESC_STORAGE_KEY,
   props: {
@@ -145,18 +134,8 @@ export default {
 </script>
 <template>
   <div>
-    <local-storage-sync
-      v-model="sortBy"
-      :storage-key="$options.sortByStorageKey"
-      :data-testid="$options.testids.LOCAL_STORAGE_SORT_BY"
-      as-json
-    />
-    <local-storage-sync
-      v-model="sortDesc"
-      :storage-key="$options.sortDescStorageKey"
-      :data-testid="$options.testids.LOCAL_STORAGE_SORT_DESC"
-      as-json
-    />
+    <local-storage-sync v-model="sortBy" :storage-key="$options.sortByStorageKey" as-json />
+    <local-storage-sync v-model="sortDesc" :storage-key="$options.sortDescStorageKey" as-json />
     <gl-table
       :fields="tableHeaderFields"
       :items="enabledNamespaces"
@@ -179,7 +158,7 @@ export default {
       </template>
 
       <template #cell(name)="{ item }">
-        <div :data-testid="$options.testids.NAMESPACE">
+        <div data-testid="namespace">
           <strong v-if="item.latestSnapshot">{{ item.namespace.fullName }}</strong>
           <template v-else>
             <span class="gl-text-gray-400">{{ item.namespace.fullName }}</span>
@@ -201,10 +180,7 @@ export default {
       </template>
 
       <template #cell(actions)="{ item }">
-        <span
-          v-gl-tooltip.hover="getDeleteButtonTooltipText(item)"
-          :data-testid="$options.testids.ACTIONS"
-        >
+        <span v-gl-tooltip.hover="getDeleteButtonTooltipText(item)" data-testid="actions">
           <gl-button
             v-gl-modal="deleteModalId"
             :disabled="isCurrentGroup(item)"

ee/app/assets/javascripts/analytics/devops_report/devops_adoption/constants.js

@@ -7,11 +7,6 @@ export const PROGRESS_BAR_HEIGHT = '8px';
 export const DATE_TIME_FORMAT = 'yyyy-mm-dd HH:MM';
 
 export const OVERVIEW_TABLE_NAME_KEY = 'name';
-export const TABLE_TEST_IDS_HEADERS = 'header';
-export const TABLE_TEST_IDS_NAMESPACE = 'namespaceCol';
-export const TABLE_TEST_IDS_ACTIONS = 'actionsCol';
-export const TABLE_TEST_IDS_LOCAL_STORAGE_SORT_BY = 'localStorageSortBy';
-export const TABLE_TEST_IDS_LOCAL_STORAGE_SORT_DESC = 'localStorageSortDesc';
 
 export const TABLE_SORT_BY_STORAGE_KEY = 'devops_adoption_table_sort_by';
 export const TABLE_SORT_DESC_STORAGE_KEY = 'devops_adoption_table_sort_desc';

ee/spec/frontend/analytics/devops_report/devops_adoption/components/devops_adoption_overview_table_spec.js

 import { GlButton, GlIcon, GlBadge, GlProgressBar } from '@gitlab/ui';
 import DevopsAdoptionDeleteModal from 'ee/analytics/devops_report/devops_adoption/components/devops_adoption_delete_modal.vue';
 import DevopsAdoptionOverviewTable from 'ee/analytics/devops_report/devops_adoption/components/devops_adoption_overview_table.vue';
-import {
-  TABLE_TEST_IDS_NAMESPACE,
-  TABLE_TEST_IDS_ACTIONS,
-  TABLE_TEST_IDS_HEADERS,
-  DEVOPS_ADOPTION_TABLE_CONFIGURATION,
-} from 'ee/analytics/devops_report/devops_adoption/constants';
+import { DEVOPS_ADOPTION_TABLE_CONFIGURATION } from 'ee/analytics/devops_report/devops_adoption/constants';
 import { createMockDirective, getBinding } from 'helpers/vue_mock_directive';
 import { mountExtended } from 'helpers/vue_test_utils_helper';
 import LocalStorageSync from '~/vue_shared/components/local_storage_sync.vue';
 import { devopsAdoptionNamespaceData } from '../mock_data';
 
 const DELETE_MODAL_ID = 'delete-modal-test-unique-id';
+const TABLE_TEST_IDS_HEADERS = 'headers';
+const TABLE_TEST_IDS_NAMESPACE = 'namespace';
+const TABLE_TEST_IDS_ACTIONS = 'actions';
 
 jest.mock('lodash/uniqueId', () => (x) => `${x}test-unique-id`);
 

ee/spec/frontend/analytics/devops_report/devops_adoption/components/devops_adoption_table_spec.js

@@ -4,16 +4,15 @@ import { nextTick } from 'vue';
 import DevopsAdoptionDeleteModal from 'ee/analytics/devops_report/devops_adoption/components/devops_adoption_delete_modal.vue';
 import DevopsAdoptionTable from 'ee/analytics/devops_report/devops_adoption/components/devops_adoption_table.vue';
 import DevopsAdoptionTableCellFlag from 'ee/analytics/devops_report/devops_adoption/components/devops_adoption_table_cell_flag.vue';
-import {
-  TABLE_TEST_IDS_NAMESPACE,
-  TABLE_TEST_IDS_ACTIONS,
-  TABLE_TEST_IDS_HEADERS,
-  DEVOPS_ADOPTION_TABLE_CONFIGURATION,
-} from 'ee/analytics/devops_report/devops_adoption/constants';
+import { DEVOPS_ADOPTION_TABLE_CONFIGURATION } from 'ee/analytics/devops_report/devops_adoption/constants';
 import { createMockDirective, getBinding } from 'helpers/vue_mock_directive';
 import LocalStorageSync from '~/vue_shared/components/local_storage_sync.vue';
 import { devopsAdoptionNamespaceData, devopsAdoptionTableHeaders } from '../mock_data';
 
+const TABLE_TEST_IDS_HEADERS = 'headers';
+const TABLE_TEST_IDS_NAMESPACE = 'namespace';
+const TABLE_TEST_IDS_ACTIONS = 'actions';
+
 describe('DevopsAdoptionTable', () => {
   let wrapper;