Merge branch '322141-remove-ff-compare-repo-dropdown' into 'master'

Remove compare_repo_dropdown feature flag

See merge request gitlab-org/gitlab!67193

app/assets/javascripts/projects/compare/components/app_legacy.vue

-<script>
-import { GlButton } from '@gitlab/ui';
-import csrf from '~/lib/utils/csrf';
-import RevisionDropdown from './revision_dropdown_legacy.vue';
-
-export default {
-  csrf,
-  components: {
-    RevisionDropdown,
-    GlButton,
-  },
-  props: {
-    projectCompareIndexPath: {
-      type: String,
-      required: true,
-    },
-    refsProjectPath: {
-      type: String,
-      required: true,
-    },
-    paramsFrom: {
-      type: String,
-      required: false,
-      default: null,
-    },
-    paramsTo: {
-      type: String,
-      required: false,
-      default: null,
-    },
-    projectMergeRequestPath: {
-      type: String,
-      required: true,
-    },
-    createMrPath: {
-      type: String,
-      required: true,
-    },
-  },
-  data() {
-    return {
-      from: this.paramsFrom,
-      to: this.paramsTo,
-    };
-  },
-  methods: {
-    onSubmit() {
-      this.$refs.form.submit();
-    },
-    onSwapRevision() {
-      [this.from, this.to] = [this.to, this.from]; // swaps 'from' and 'to'
-    },
-    onSelectRevision({ direction, revision }) {
-      this[direction] = revision; // direction is either 'from' or 'to'
-    },
-  },
-};
-</script>
-
-<template>
-  <form
-    ref="form"
-    class="form-inline js-requires-input js-signature-container"
-    method="POST"
-    :action="projectCompareIndexPath"
-  >
-    <input :value="$options.csrf.token" type="hidden" name="authenticity_token" />
-    <revision-dropdown
-      :refs-project-path="refsProjectPath"
-      revision-text="Source"
-      params-name="to"
-      :params-branch="to"
-      data-testid="sourceRevisionDropdown"
-      @selectRevision="onSelectRevision"
-    />
-    <div class="compare-ellipsis gl-display-inline" data-testid="ellipsis">...</div>
-    <revision-dropdown
-      :refs-project-path="refsProjectPath"
-      revision-text="Target"
-      params-name="from"
-      :params-branch="from"
-      data-testid="targetRevisionDropdown"
-      @selectRevision="onSelectRevision"
-    />
-    <gl-button category="primary" variant="success" class="gl-ml-3" @click="onSubmit">
-      {{ s__('CompareRevisions|Compare') }}
-    </gl-button>
-    <gl-button
-      data-testid="swapRevisionsButton"
-      class="btn btn-default gl-button gl-ml-3"
-      @click="onSwapRevision"
-    >
-      {{ s__('CompareRevisions|Swap revisions') }}
-    </gl-button>
-    <gl-button
-      v-if="projectMergeRequestPath"
-      :href="projectMergeRequestPath"
-      data-testid="projectMrButton"
-      class="btn btn-default gl-button gl-ml-3"
-    >
-      {{ s__('CompareRevisions|View open merge request') }}
-    </gl-button>
-    <gl-button
-      v-else-if="createMrPath"
-      :href="createMrPath"
-      data-testid="createMrButton"
-      class="btn btn-default gl-button gl-ml-3"
-    >
-      {{ s__('CompareRevisions|Create merge request') }}
-    </gl-button>
-  </form>
-</template>

app/assets/javascripts/projects/compare/index.js

 import Vue from 'vue';
 import CompareApp from './components/app.vue';
-import CompareAppLegacy from './components/app_legacy.vue';
 
 export default function init() {
   const el = document.getElementById('js-compare-selector');
 
-  if (gon.features?.compareRepoDropdown) {
-    const {
-      refsProjectPath,
-      paramsFrom,
-      paramsTo,
-      projectCompareIndexPath,
-      projectMergeRequestPath,
-      createMrPath,
-      projectTo,
-      projectsFrom,
-    } = el.dataset;
-
-    return new Vue({
-      el,
-      components: {
-        CompareApp,
-      },
-      render(createElement) {
-        return createElement(CompareApp, {
-          props: {
-            refsProjectPath,
-            paramsFrom,
-            paramsTo,
-            projectCompareIndexPath,
-            projectMergeRequestPath,
-            createMrPath,
-            defaultProject: JSON.parse(projectTo),
-            projects: JSON.parse(projectsFrom),
-          },
-        });
-      },
-    });
-  }
-
   const {
     refsProjectPath,
     paramsFrom,
@@ -46,15 +11,17 @@ export default function init() {
     projectCompareIndexPath,
     projectMergeRequestPath,
     createMrPath,
+    projectTo,
+    projectsFrom,
   } = el.dataset;
 
   return new Vue({
     el,
     components: {
-      CompareAppLegacy,
+      CompareApp,
     },
     render(createElement) {
-      return createElement(CompareAppLegacy, {
+      return createElement(CompareApp, {
         props: {
           refsProjectPath,
           paramsFrom,
@@ -62,6 +29,8 @@ export default function init() {
           projectCompareIndexPath,
           projectMergeRequestPath,
           createMrPath,
+          defaultProject: JSON.parse(projectTo),
+          projects: JSON.parse(projectsFrom),
         },
       });
     },

app/controllers/projects/compare_controller.rb

@@ -20,10 +20,6 @@ class Projects::CompareController < Projects::ApplicationController
   # Validation
   before_action :validate_refs!
 
-  before_action do
-    push_frontend_feature_flag(:compare_repo_dropdown, source_project, default_enabled: :yaml)
-  end
-
   feature_category :source_code_management
 
   # Diffs may be pretty chunky, the less is better in this endpoint.
@@ -91,7 +87,6 @@ class Projects::CompareController < Projects::ApplicationController
   def target_project
     strong_memoize(:target_project) do
       next source_project unless params.key?(:from_project_id)
-      next source_project unless Feature.enabled?(:compare_repo_dropdown, source_project, default_enabled: :yaml)
       next source_project if params[:from_project_id].to_i == source_project.id
 
       target_project = target_projects(source_project).find_by_id(params[:from_project_id])

app/helpers/compare_helper.rb

@@ -38,10 +38,8 @@ module CompareHelper
       project_merge_request_path: merge_request.present? ? project_merge_request_path(project, merge_request) : '',
       create_mr_path: create_mr_button? ? create_mr_path : ''
     }.tap do |data|
-      if Feature.enabled?(:compare_repo_dropdown, project, default_enabled: :yaml)
-        data[:project_to] = { id: project.id, name: project.full_path }.to_json
-        data[:projects_from] = target_projects(project).map { |project| { id: project.id, name: project.full_path } }.to_json
-      end
+      data[:project_to] = { id: project.id, name: project.full_path }.to_json
+      data[:projects_from] = target_projects(project).map { |project| { id: project.id, name: project.full_path } }.to_json
     end
   end
 end

config/feature_flags/development/compare_repo_dropdown.yml

----
-name: compare_repo_dropdown
-introduced_by_url: https://gitlab.com/gitlab-org/gitlab/-/issues/14615
-rollout_issue_url: https://gitlab.com/gitlab-org/gitlab/-/issues/322141
-milestone: '13.9'
-type: development
-group: group::source code
-default_enabled: true

spec/frontend/projects/compare/components/app_legacy_spec.js

-import { GlButton } from '@gitlab/ui';
-import { shallowMount } from '@vue/test-utils';
-import CompareApp from '~/projects/compare/components/app_legacy.vue';
-import RevisionDropdown from '~/projects/compare/components/revision_dropdown_legacy.vue';
-
-jest.mock('~/lib/utils/csrf', () => ({ token: 'mock-csrf-token' }));
-
-const projectCompareIndexPath = 'some/path';
-const refsProjectPath = 'some/refs/path';
-const paramsFrom = 'main';
-const paramsTo = 'some-other-branch';
-
-describe('CompareApp component', () => {
-  let wrapper;
-
-  const createComponent = (props = {}) => {
-    wrapper = shallowMount(CompareApp, {
-      propsData: {
-        projectCompareIndexPath,
-        refsProjectPath,
-        paramsFrom,
-        paramsTo,
-        projectMergeRequestPath: '',
-        createMrPath: '',
-        ...props,
-      },
-    });
-  };
-
-  afterEach(() => {
-    wrapper.destroy();
-    wrapper = null;
-  });
-
-  beforeEach(() => {
-    createComponent();
-  });
-
-  const findSourceDropdown = () => wrapper.find('[data-testid="sourceRevisionDropdown"]');
-  const findTargetDropdown = () => wrapper.find('[data-testid="targetRevisionDropdown"]');
-
-  it('renders component with prop', () => {
-    expect(wrapper.props()).toEqual(
-      expect.objectContaining({
-        projectCompareIndexPath,
-        refsProjectPath,
-        paramsFrom,
-        paramsTo,
-      }),
-    );
-  });
-
-  it('contains the correct form attributes', () => {
-    expect(wrapper.attributes('action')).toBe(projectCompareIndexPath);
-    expect(wrapper.attributes('method')).toBe('POST');
-  });
-
-  it('has input with csrf token', () => {
-    expect(wrapper.find('input[name="authenticity_token"]').attributes('value')).toBe(
-      'mock-csrf-token',
-    );
-  });
-
-  it('has ellipsis', () => {
-    expect(wrapper.find('[data-testid="ellipsis"]').exists()).toBe(true);
-  });
-
-  describe('Source and Target BranchDropdown components', () => {
-    const findAllBranchDropdowns = () => wrapper.findAll(RevisionDropdown);
-
-    it('renders the components with the correct props', () => {
-      expect(findAllBranchDropdowns().length).toBe(2);
-      expect(findSourceDropdown().props('revisionText')).toBe('Source');
-      expect(findTargetDropdown().props('revisionText')).toBe('Target');
-    });
-
-    it('sets the revision when the "selectRevision" event is emitted', async () => {
-      findSourceDropdown().vm.$emit('selectRevision', {
-        direction: 'to',
-        revision: 'some-source-revision',
-      });
-
-      findTargetDropdown().vm.$emit('selectRevision', {
-        direction: 'from',
-        revision: 'some-target-revision',
-      });
-
-      await wrapper.vm.$nextTick();
-
-      expect(findTargetDropdown().props('paramsBranch')).toBe('some-target-revision');
-      expect(findSourceDropdown().props('paramsBranch')).toBe('some-source-revision');
-    });
-  });
-
-  describe('compare button', () => {
-    const findCompareButton = () => wrapper.find(GlButton);
-
-    it('renders button', () => {
-      expect(findCompareButton().exists()).toBe(true);
-    });
-
-    it('submits form', () => {
-      findCompareButton().vm.$emit('click');
-      expect(wrapper.find('form').element.submit).toHaveBeenCalled();
-    });
-
-    it('has compare text', () => {
-      expect(findCompareButton().text()).toBe('Compare');
-    });
-  });
-
-  describe('swap revisions button', () => {
-    const findSwapRevisionsButton = () => wrapper.find('[data-testid="swapRevisionsButton"]');
-
-    it('renders the swap revisions button', () => {
-      expect(findSwapRevisionsButton().exists()).toBe(true);
-    });
-
-    it('has the correct text', () => {
-      expect(findSwapRevisionsButton().text()).toBe('Swap revisions');
-    });
-
-    it('swaps revisions when clicked', async () => {
-      findSwapRevisionsButton().vm.$emit('click');
-
-      await wrapper.vm.$nextTick();
-
-      expect(findTargetDropdown().props('paramsBranch')).toBe(paramsTo);
-      expect(findSourceDropdown().props('paramsBranch')).toBe(paramsFrom);
-    });
-  });
-
-  describe('merge request buttons', () => {
-    const findProjectMrButton = () => wrapper.find('[data-testid="projectMrButton"]');
-    const findCreateMrButton = () => wrapper.find('[data-testid="createMrButton"]');
-
-    it('does not have merge request buttons', () => {
-      createComponent();
-      expect(findProjectMrButton().exists()).toBe(false);
-      expect(findCreateMrButton().exists()).toBe(false);
-    });
-
-    it('has "View open merge request" button', () => {
-      createComponent({
-        projectMergeRequestPath: 'some/project/merge/request/path',
-      });
-      expect(findProjectMrButton().exists()).toBe(true);
-      expect(findCreateMrButton().exists()).toBe(false);
-    });
-
-    it('has "Create merge request" button', () => {
-      createComponent({
-        createMrPath: 'some/create/create/mr/path',
-      });
-      expect(findProjectMrButton().exists()).toBe(false);
-      expect(findCreateMrButton().exists()).toBe(true);
-    });
-  });
-});