diff --git a/app/assets/javascripts/ide/components/repo_file.vue b/app/assets/javascripts/ide/components/repo_file.vue index dbdf0be2809..110eda83bb4 100644 --- a/app/assets/javascripts/ide/components/repo_file.vue +++ b/app/assets/javascripts/ide/components/repo_file.vue @@ -95,16 +95,18 @@ export default { return this.file.changed || this.file.tempFile || this.file.staged; }, }, + watch: { + 'file.active': function fileActiveWatch(active) { + if (this.file.type === 'blob' && active) { + this.scrollIntoView(); + } + }, + }, mounted() { if (this.hasPathAtCurrentRoute()) { this.scrollIntoView(true); } }, - updated() { - if (this.file.type === 'blob' && this.file.active) { - this.scrollIntoView(); - } - }, methods: { ...mapActions(['toggleTreeOpen']), clickFile() { diff --git a/changelogs/unreleased/ide-row-hover-scroll.yml b/changelogs/unreleased/ide-row-hover-scroll.yml new file mode 100644 index 00000000000..24c273b4f25 --- /dev/null +++ b/changelogs/unreleased/ide-row-hover-scroll.yml @@ -0,0 +1,5 @@ +--- +title: Fixed IDE file row scrolling into view when hovering +merge_request: +author: +type: fixed diff --git a/spec/javascripts/ide/components/repo_file_spec.js b/spec/javascripts/ide/components/repo_file_spec.js index f99d1f9890a..fc639a672e2 100644 --- a/spec/javascripts/ide/components/repo_file_spec.js +++ b/spec/javascripts/ide/components/repo_file_spec.js @@ -121,4 +121,25 @@ describe('RepoFile', () => { ).toContain('Locked by testuser'); }); }); + + it('calls scrollIntoView if made active', done => { + createComponent({ + file: { + ...file(), + type: 'blob', + active: false, + }, + level: 0, + }); + + spyOn(vm, 'scrollIntoView'); + + vm.file.active = true; + + vm.$nextTick(() => { + expect(vm.scrollIntoView).toHaveBeenCalled(); + + done(); + }); + }); });