Commit 13a91b56 authored by Fatih Acet's avatar Fatih Acet

Merge branch 'fix-textarea-expansion' into 'master'

Add textarea autoresize after comment

## What does this MR do?
Adds an autoresize after a comment is posted

## Are there points in the code the reviewer needs to double check?
Shouldn't be

## Why was this MR needed?
To keep the UI consistent (the same as if you were to refresh it)

## Screenshots (if relevant)
Before:
![IyCczzXfaf](/uploads/2229bad47e3f3821f1efaa6868a52025/IyCczzXfaf.gif)

After:
![E6O0kRBrJq](/uploads/4aec6b436ff172ba281c2c2a4481906d/E6O0kRBrJq.gif)

## Does this MR meet the acceptance criteria?

- [x] [CHANGELOG](https://gitlab.com/gitlab-org/gitlab-ce/blob/master/CHANGELOG) entry added
- Tests
  - [x] Added for this feature/bug
  - [x] All builds are passing
- [x] Conform by the [merge request performance guides](http://docs.gitlab.com/ce/development/merge_request_performance_guidelines.html)
- [x] Conform by the [style guides](https://gitlab.com/gitlab-org/gitlab-ce/blob/master/CONTRIBUTING.md#style-guides)
- [x] Branch has no merge conflicts with `master` (if you do - rebase it please)
- [x] [Squashed related commits together](https://git-scm.com/book/en/Git-Tools-Rewriting-History#Squashing-Commits)

## What are the relevant issue numbers?
Closes #21667

See merge request !6152
parents 723ea707 e7b0334c
...@@ -24,6 +24,7 @@ v 8.12.0 (unreleased) ...@@ -24,6 +24,7 @@ v 8.12.0 (unreleased)
- Remove suggested colors hover underline (ClemMakesApps) - Remove suggested colors hover underline (ClemMakesApps)
- Shorten task status phrase (ClemMakesApps) - Shorten task status phrase (ClemMakesApps)
- Add hover color to emoji icon (ClemMakesApps) - Add hover color to emoji icon (ClemMakesApps)
- Add textarea autoresize after comment (ClemMakesApps)
- Fix branches page dropdown sort alignment (ClemMakesApps) - Fix branches page dropdown sort alignment (ClemMakesApps)
- Add white background for no readme container (ClemMakesApps) - Add white background for no readme container (ClemMakesApps)
- API: Expose issue confidentiality flag. (Robert Schilling) - API: Expose issue confidentiality flag. (Robert Schilling)
......
...@@ -331,7 +331,12 @@ ...@@ -331,7 +331,12 @@
form.find(".js-md-write-button").click(); form.find(".js-md-write-button").click();
form.find(".js-note-text").val("").trigger("input"); form.find(".js-note-text").val("").trigger("input");
form.find(".js-note-text").data("autosave").reset(); form.find(".js-note-text").data("autosave").reset();
return this.updateTargetButtons(e);
var event = document.createEvent('Event');
event.initEvent('autosize:update', true, false);
form.find('.js-autosize')[0].dispatchEvent(event);
this.updateTargetButtons(e);
}; };
Notes.prototype.reenableTargetFormSubmitButton = function() { Notes.prototype.reenableTargetFormSubmitButton = function() {
......
.flash-container.timeline-content
.timeline-icon.hidden-xs.hidden-sm
%a.author_link
%img
.timeline-content.timeline-content-form
%form.new-note.js-quick-submit.common-note-form.gfm-form.js-main-target-form
.md-area
.md-header
.md-write-holder
.zen-backdrop.div-dropzone-wrapper
.div-dropzone-wrapper
.div-dropzone.dz-clickable
%textarea.note-textarea.js-note-text.js-gfm-input.js-autosize.markdown-area
.note-form-actions.clearfix
%input.btn.btn-nr.btn-create.append-right-10.comment-btn.js-comment-button{ type: 'submit' }
%a.btn.btn-nr.btn-reopen.btn-comment.js-note-target-reopen
Reopen issue
%a.btn.btn-nr.btn-close.btn-comment.js-note-target-close
Close issue
%a.btn.btn-cancel.js-note-discard
Discard draft
\ No newline at end of file
/*= require notes */ /*= require notes */
/*= require autosize */
/*= require gl_form */ /*= require gl_form */
/*= require lib/utils/text_utility */
(function() { (function() {
window.gon || (window.gon = {}); window.gon || (window.gon = {});
...@@ -12,29 +11,63 @@ ...@@ -12,29 +11,63 @@
}; };
describe('Notes', function() { describe('Notes', function() {
return describe('task lists', function() { describe('task lists', function() {
fixture.preload('issue_note.html'); fixture.preload('issue_note.html');
beforeEach(function() { beforeEach(function() {
fixture.load('issue_note.html'); fixture.load('issue_note.html');
$('form').on('submit', function(e) { $('form').on('submit', function(e) {
return e.preventDefault(); e.preventDefault();
}); });
return this.notes = new Notes(); this.notes = new Notes();
}); });
it('modifies the Markdown field', function() { it('modifies the Markdown field', function() {
$('input[type=checkbox]').attr('checked', true).trigger('change'); $('input[type=checkbox]').attr('checked', true).trigger('change');
return expect($('.js-task-list-field').val()).toBe('- [x] Task List Item'); expect($('.js-task-list-field').val()).toBe('- [x] Task List Item');
}); });
return it('submits the form on tasklist:changed', function() {
var submitted; it('submits the form on tasklist:changed', function() {
submitted = false; var submitted = false;
$('form').on('submit', function(e) { $('form').on('submit', function(e) {
submitted = true; submitted = true;
return e.preventDefault(); e.preventDefault();
}); });
$('.js-task-list-field').trigger('tasklist:changed'); $('.js-task-list-field').trigger('tasklist:changed');
return expect(submitted).toBe(true); expect(submitted).toBe(true);
});
});
describe('comments', function() {
var commentsTemplate = 'comments.html';
var textarea = '.js-note-text';
fixture.preload(commentsTemplate);
beforeEach(function() {
fixture.load(commentsTemplate);
this.notes = new Notes();
this.autoSizeSpy = spyOnEvent($(textarea), 'autosize:update');
spyOn(this.notes, 'renderNote').and.stub();
$(textarea).data('autosave', {
reset: function() {}
});
$('form').on('submit', function(e) {
e.preventDefault();
$('.js-main-target-form').trigger('ajax:success');
});
}); });
it('autosizes after comment submission', function() {
$(textarea).text('This is an example comment note');
expect(this.autoSizeSpy).not.toHaveBeenTriggered();
$('.js-comment-button').click();
expect(this.autoSizeSpy).toHaveBeenTriggered();
})
}); });
}); });
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment