Add unique folder name for add_file_template test

So that on retry we don't get the file already exists error
See https://gitlab.com/gitlab-org/gitlab/-/issues/220997

app/assets/javascripts/ide/components/new_dropdown/index.vue

@@ -64,6 +64,7 @@ export default {
         :aria-label="__('Create new file or directory')"
         type="button"
         class="rounded border-0 d-flex ide-entry-dropdown-toggle"
+        data-qa-selector="dropdown_button"
         @click.stop="openDropdown()"
       >
         <icon name="ellipsis_v" /> <icon name="chevron-down" />
@@ -97,6 +98,7 @@ export default {
             class="d-flex"
             icon="pencil"
             icon-classes="mr-2"
+            data-qa-selector="rename_move_button"
             @click="createNewItem($options.modalTypes.rename)"
           />
         </li>

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

@@ -118,7 +118,12 @@ export default {
     @mouseleave="$emit('mouseleave', $event)"
   >
     <div class="file-row-name-container">
-      <span ref="textOutput" :style="levelIndentation" class="file-row-name str-truncated">
+      <span
+        ref="textOutput"
+        :style="levelIndentation"
+        class="file-row-name str-truncated"
+        data-qa-selector="file_name_content"
+      >
         <file-icon
           class="file-row-icon"
           :class="{ 'text-secondary': file.type === 'tree' }"

qa/qa/page/component/web_ide/modal/create_new_file.rb

@@ -9,7 +9,7 @@ module QA
             view 'app/assets/javascripts/ide/components/new_dropdown/modal.vue' do
               element :file_name_field, required: true
               element :new_file_modal, required: true
-              element :template_list, required: true
+              element :template_list
             end
           end
         end

qa/qa/page/project/web_ide/edit.rb

@@ -50,6 +50,15 @@ module QA
             element :first_file_button
           end
 
+          view 'app/assets/javascripts/vue_shared/components/file_row.vue' do
+            element :file_name_content
+          end
+
+          view 'app/assets/javascripts/ide/components/new_dropdown/index.vue' do
+            element :dropdown_button
+            element :rename_move_button
+          end
+
           def has_file?(file_name)
             within_element(:file_list) do
               page.has_content? file_name
@@ -132,6 +141,14 @@ module QA
             fill_element(:file_name_field, file_name)
             click_button('Create file')
           end
+
+          def rename_file(file_name, new_file_name)
+            click_element(:file_name_content, text: file_name)
+            click_element(:dropdown_button)
+            click_element(:rename_move_button, Page::Component::WebIDE::Modal::CreateNewFile)
+            fill_element(:file_name_field, new_file_name)
+            click_button('Rename file')
+          end
         end
       end
     end

qa/qa/specs/features/browser_ui/3_create/web_ide/add_file_template_spec.rb

 # frozen_string_literal: true
 
+require 'securerandom'
+
 module QA
   RSpec.describe 'Create' do
     describe 'Web IDE file templates' do
@@ -53,10 +55,11 @@ module QA
             ide.create_new_file_from_template template[:file_name], template[:name]
 
             expect(ide.has_file?(template[:file_name])).to be_truthy
-
             expect(ide).to have_button('Undo')
             expect(ide).to have_normalized_ws_text(content[0..100])
 
+            ide.rename_file(template[:file_name], "#{SecureRandom.hex(8)}/#{template[:file_name]}")
+
             ide.commit_changes
 
             expect(ide).to have_content(template[:file_name])