test(ui): use data-testid

Author: Guillaume Chau

packages/@vue/cli-ui/src/components/ProjectFeatureItem.vue

@@ -4,7 +4,7 @@
     :class="{
       selected: feature.enabled
     }"
-    :data-id="feature.id"
+    :data-testid="feature.id"
   >
     <VueSwitch
       :value="feature.enabled"

packages/@vue/cli-ui/src/components/ProjectPresetItem.vue

@@ -4,7 +4,7 @@
     :class="{
       selected
     }"
-    :data-id="preset.id"
+    :data-testid="preset.id"
   >
     <div class="content">
       <div

packages/@vue/cli-ui/tests/e2e/specs/test.js

@@ -30,15 +30,15 @@ describe('Vue project manager', () => {
       cy.get('.next').click()
     })
     cy.get('.presets').within(() => {
-      cy.get('[data-id="__manual__"]').click()
+      cy.get('[data-testid="__manual__"]').click()
       cy.get('.next').click()
     })
     cy.get('.features').within(() => {
-      cy.get('[data-id="pwa"] .bullet').click()
-      cy.get('[data-id="router"] .bullet').click()
-      cy.get('[data-id="vuex"] .bullet').click()
-      cy.get('[data-id="css-preprocessor"] .bullet').click()
-      cy.get('[data-id="use-config-files"] .bullet').click()
+      cy.get('[data-testid="pwa"] .bullet').click()
+      cy.get('[data-testid="router"] .bullet').click()
+      cy.get('[data-testid="vuex"] .bullet').click()
+      cy.get('[data-testid="css-preprocessor"] .bullet').click()
+      cy.get('[data-testid="use-config-files"] .bullet').click()
       cy.get('.next').click()
     })
     cy.get('.config').within(() => {