Commit 04ceeac1 authored by Fatih Acet's avatar Fatih Acet

Merge branch 'backport-epic-fullscreen' into 'master'

Backport epic fullscreen

See merge request gitlab-org/gitlab-ce!15437
parents f8de23e6 880c9a2c
...@@ -36,7 +36,10 @@ export default function dropzoneInput(form) { ...@@ -36,7 +36,10 @@ export default function dropzoneInput(form) {
$formDropzone.append(divHover); $formDropzone.append(divHover);
$formDropzone.find('.div-dropzone-hover').append(iconPaperclip); $formDropzone.find('.div-dropzone-hover').append(iconPaperclip);
if (!uploadsPath) return; if (!uploadsPath) {
$formDropzone.addClass('js-invalid-dropzone');
return;
}
const dropzone = $formDropzone.dropzone({ const dropzone = $formDropzone.dropzone({
url: uploadsPath, url: uploadsPath,
......
...@@ -71,7 +71,7 @@ export default class ZenMode { ...@@ -71,7 +71,7 @@ export default class ZenMode {
this.active_textarea = this.active_backdrop.find('textarea'); this.active_textarea = this.active_backdrop.find('textarea');
// Prevent a user-resized textarea from persisting to fullscreen // Prevent a user-resized textarea from persisting to fullscreen
this.active_textarea.removeAttr('style'); this.active_textarea.removeAttr('style');
return this.active_textarea.focus(); this.active_textarea.focus();
} }
exit() { exit() {
...@@ -81,7 +81,11 @@ export default class ZenMode { ...@@ -81,7 +81,11 @@ export default class ZenMode {
this.scrollTo(this.active_textarea); this.scrollTo(this.active_textarea);
this.active_textarea = null; this.active_textarea = null;
this.active_backdrop = null; this.active_backdrop = null;
return Dropzone.forElement('.div-dropzone').enable();
const $dropzone = $('.div-dropzone');
if ($dropzone && !$dropzone.hasClass('js-invalid-dropzone')) {
Dropzone.forElement('.div-dropzone').enable();
}
} }
} }
......
/* eslint-disable space-before-function-paren, no-var, one-var, one-var-declaration-per-line, object-shorthand, comma-dangle, no-return-assign, new-cap, max-len */
/* global Mousetrap */ /* global Mousetrap */
import Dropzone from 'dropzone'; import Dropzone from 'dropzone';
import ZenMode from '~/zen_mode'; import ZenMode from '~/zen_mode';
(function() { describe('ZenMode', () => {
var enterZen, escapeKeydown, exitZen; let zen;
const fixtureName = 'merge_requests/merge_request_with_comment.html.raw';
describe('ZenMode', function() {
var fixtureName = 'merge_requests/merge_request_with_comment.html.raw'; preloadFixtures(fixtureName);
preloadFixtures(fixtureName);
beforeEach(function() { function enterZen() {
loadFixtures(fixtureName); $('.notes-form .js-zen-enter').click();
spyOn(Dropzone, 'forElement').and.callFake(function() { }
return {
enable: function() { function exitZen() {
return true; $('.notes-form .js-zen-leave').click();
} }
};
// Stub Dropzone.forElement(...).enable() function escapeKeydown() {
}); $('.notes-form textarea').trigger($.Event('keydown', {
this.zen = new ZenMode(); keyCode: 27,
// Set this manually because we can't actually scroll the window }));
return this.zen.scroll_position = 456; }
beforeEach(() => {
loadFixtures(fixtureName);
spyOn(Dropzone, 'forElement').and.callFake(() => ({
enable: () => true,
}));
zen = new ZenMode();
// Set this manually because we can't actually scroll the window
zen.scroll_position = 456;
});
describe('on enter', () => {
it('pauses Mousetrap', () => {
spyOn(Mousetrap, 'pause');
enterZen();
expect(Mousetrap.pause).toHaveBeenCalled();
}); });
describe('on enter', function() {
it('pauses Mousetrap', function() { it('removes textarea styling', () => {
spyOn(Mousetrap, 'pause'); $('.notes-form textarea').attr('style', 'height: 400px');
enterZen(); enterZen();
return expect(Mousetrap.pause).toHaveBeenCalled(); expect($('.notes-form textarea')).not.toHaveAttr('style');
});
return it('removes textarea styling', function() {
$('.notes-form textarea').attr('style', 'height: 400px');
enterZen();
return expect($('.notes-form textarea')).not.toHaveAttr('style');
});
}); });
describe('in use', function() { });
beforeEach(function() {
return enterZen(); describe('in use', () => {
}); beforeEach(enterZen);
return it('exits on Escape', function() {
escapeKeydown(); it('exits on Escape', () => {
return expect($('.notes-form .zen-backdrop')).not.toHaveClass('fullscreen'); escapeKeydown();
}); expect($('.notes-form .zen-backdrop')).not.toHaveClass('fullscreen');
});
});
describe('on exit', () => {
beforeEach(enterZen);
it('unpauses Mousetrap', () => {
spyOn(Mousetrap, 'unpause');
exitZen();
expect(Mousetrap.unpause).toHaveBeenCalled();
}); });
return describe('on exit', function() {
beforeEach(function() { it('restores the scroll position', () => {
return enterZen(); spyOn(zen, 'scrollTo');
}); exitZen();
it('unpauses Mousetrap', function() { expect(zen.scrollTo).toHaveBeenCalled();
spyOn(Mousetrap, 'unpause');
exitZen();
return expect(Mousetrap.unpause).toHaveBeenCalled();
});
return it('restores the scroll position', function() {
spyOn(this.zen, 'scrollTo');
exitZen();
return expect(this.zen.scrollTo).toHaveBeenCalled();
});
}); });
}); });
enterZen = function() { describe('enabling dropzone', () => {
return $('.notes-form .js-zen-enter').click(); beforeEach(() => {
}; enterZen();
});
exitZen = function() { it('should not call dropzone if element is not dropzone valid', () => {
return $('.notes-form .js-zen-leave').click(); $('.div-dropzone').addClass('js-invalid-dropzone');
}; exitZen();
expect(Dropzone.forElement).not.toHaveBeenCalled();
});
escapeKeydown = function() { it('should call dropzone if element is dropzone valid', () => {
return $('.notes-form textarea').trigger($.Event('keydown', { $('.div-dropzone').removeClass('js-invalid-dropzone');
keyCode: 27 exitZen();
})); expect(Dropzone.forElement).toHaveBeenCalled();
}; });
}).call(window); });
});
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