upload: Use a placeholder when uploading.

Use the placeholder `[uploading file]()` when uploading before the
upload has completed. This behavior prevents an image from being
improperly placed when typing after starting an upload. This is based
on GitHub's handling of image uploading.

Also, add tests to the `upload` Node tests and update existing tests to
account for the new behavior.

Fix #10305.
This commit is contained in:
Marco Burstein 2018-08-14 18:57:35 -07:00 committed by Tim Abbott
parent fa22cf18f6
commit 6f57cd4d23
2 changed files with 24 additions and 8 deletions

View File

@ -38,9 +38,18 @@ run_test('upload_started', () => {
$("#compose-send-status").append = function (html) {
assert.equal(html, test_html);
};
$('#compose-textarea').caret = function () {
return 0;
};
document.execCommand = function (command, show_default, value) {
assert.equal(value, "[Uploading some-file…]() ");
};
upload_opts.drop();
upload_opts.uploadStarted(0, {lastModified: 1549958107000}, 1);
upload_opts.uploadStarted(0, {
lastModified: 1549958107000,
name: 'some-file',
}, 1);
assert.equal($("#compose-send-button").attr("disabled"), '');
assert($("#compose-send-status").hasClass("alert-info"));
@ -103,7 +112,8 @@ run_test('upload_finish', () => {
function test(i, response, textbox_val) {
var compose_ui_autosize_textarea_checked = false;
var compose_actions_start_checked = false;
var syntax_to_insert;
var syntax_to_replace;
var syntax_to_replace_with;
var file_input_clear = false;
function setup() {
@ -111,8 +121,9 @@ run_test('upload_finish', () => {
compose_ui.autosize_textarea = function () {
compose_ui_autosize_textarea_checked = true;
};
compose_ui.insert_syntax_and_focus = function (syntax) {
syntax_to_insert = syntax;
compose_ui.replace_syntax = function (old_syntax, new_syntax) {
syntax_to_replace = old_syntax;
syntax_to_replace_with = new_syntax;
};
compose_state.set_message_type();
global.compose_actions = {
@ -142,7 +153,8 @@ run_test('upload_finish', () => {
function assert_side_effects() {
if (response.uri) {
assert.equal(syntax_to_insert, textbox_val);
assert.equal(syntax_to_replace, '[Uploading some-file…]()');
assert.equal(syntax_to_replace_with, textbox_val);
assert(compose_actions_start_checked);
assert(compose_ui_autosize_textarea_checked);
assert.equal($("#compose-send-button").prop('disabled'), false);
@ -161,7 +173,10 @@ run_test('upload_finish', () => {
};
setup();
upload_opts.uploadFinished(i, {lastModified: 1549958107000}, response);
upload_opts.uploadFinished(i, {
lastModified: 1549958107000,
name: 'some-file',
}, response);
upload_opts.progressUpdated(1, {lastModified: 1549958107000}, 100);
assert_side_effects();
}

View File

@ -73,6 +73,7 @@ exports.options = function (config) {
send_status.append('<div class="progress active">' +
'<div class="bar" id="' + upload_bar + '-' + file.lastModified + '" style="width: 0"></div>' +
'</div>');
compose_ui.insert_syntax_and_focus("[Uploading " + file.name + "…]()", textarea);
};
var progressUpdated = function (i, file, progress) {
@ -132,11 +133,11 @@ exports.options = function (config) {
if (i === -1) {
// This is a paste, so there's no filename. Show the image directly
var pasted_image_uri = "[pasted image](" + uri + ")";
compose_ui.insert_syntax_and_focus(pasted_image_uri, textarea);
compose_ui.replace_syntax("[Uploading " + file.name + "…]()", pasted_image_uri, textarea);
} else {
// This is a dropped file, so make the filename a link to the image
var filename_uri = "[" + filename + "](" + uri + ")";
compose_ui.insert_syntax_and_focus(filename_uri, textarea);
compose_ui.replace_syntax("[Uploading " + file.name + "…]()", filename_uri, textarea);
}
compose_ui.autosize_textarea();