diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js index 319e710b85..e0a7f98b45 100644 --- a/app/assets/javascripts/application.js +++ b/app/assets/javascripts/application.js @@ -57,4 +57,5 @@ //= require keybindings.js //= require realtime_username_validation.js //= require jquery-validation/dist/jquery.validate.js -//= require validation.js \ No newline at end of file +//= require validation.js +//= require submit_form_ajax.js \ No newline at end of file diff --git a/app/assets/javascripts/comment.js b/app/assets/javascripts/comment.js index 8a05047957..664802c24b 100644 --- a/app/assets/javascripts/comment.js +++ b/app/assets/javascripts/comment.js @@ -51,3 +51,13 @@ function insertTitleSuggestionTemplate() { var newText = currentText+template; element.val(newText); } + +// JS API for submitting comments +function addComment(comment, submitTo, parentID = 0) { + submitTo = submitTo || '.comment-form'; // class instead of id because of the bound function on line 3 + let data = { body: comment }; + if (parentID) { + data.reply_to = parentID; + } + sendFormSubmissionAjax(data, submitTo); +} diff --git a/app/assets/javascripts/submit_form_ajax.js b/app/assets/javascripts/submit_form_ajax.js new file mode 100644 index 0000000000..1c70e9d7ba --- /dev/null +++ b/app/assets/javascripts/submit_form_ajax.js @@ -0,0 +1,20 @@ +// Takes in a data object that contains the info to be submitted in the form property: dataString +// and the url to submit to the controller +// Allows data to be submitted from anywhere on the page using Javascript without using the form itself +function sendFormSubmissionAjax(dataObj, submitTo) { + let url = ''; + if(submitTo.slice(0,1) === "/") { + url = submitTo; + } else { + url = $(submitTo).attr('action'); + } + $.ajax({ + url: url, + data: dataObj, + success: (event, success) => { + if (url !== submitTo) { + $(submitTo).trigger('ajax:success', event); + } + } + }); +} \ No newline at end of file diff --git a/app/assets/javascripts/tagging.js b/app/assets/javascripts/tagging.js index e149587490..70ad65be0b 100644 --- a/app/assets/javascripts/tagging.js +++ b/app/assets/javascripts/tagging.js @@ -1,14 +1,16 @@ -function addTag(tagname, selector) { - selector = selector || '#tagform'; + +// Taking the prompt+value retrieved in promptTag() or the links in the drop-down menu and populating the form field before submitting it +// Instead we want to take the tag value and directly submit it with AJAX +function addTag(tagname, submitTo) { + submitTo = submitTo || '#tagform'; if (tagname.slice(0,5).toLowerCase() === "place") { place = tagname.split(":")[1]; place.replace("-", " "); geo = geocodeStringAndPan(place); } else { - var el = $(selector); - el.find('.tag-input').val(tagname); - el.submit(); + let data = { name: tagname }; + sendFormSubmissionAjax(data, submitTo); } } @@ -44,7 +46,7 @@ function initTagForm(deletion_path, selector) { var tag_name = tag[0]; var tag_id = tag[1]; $('.tags-list:first').append("

\ - "+tag_name+" "+tag_name+"

") el.find('.tag-input').val("") diff --git a/app/views/notes/_comment.html.erb b/app/views/notes/_comment.html.erb index 55d5e8c9dd..55d4fc2a00 100644 --- a/app/views/notes/_comment.html.erb +++ b/app/views/notes/_comment.html.erb @@ -127,7 +127,9 @@
<% comment_body = comment.render_body %> -

<%= raw insert_extras(filtered_comment_body(comment_body)) %>

+
+ <%= raw insert_extras(filtered_comment_body(comment_body)) %> +
<% if contain_trimmed_body?(comment_body) %> diff --git a/config/initializers/assets.rb b/config/initializers/assets.rb index 0dcf0cc0ec..7edc663813 100644 --- a/config/initializers/assets.rb +++ b/config/initializers/assets.rb @@ -2,6 +2,7 @@ 'leaflet-blurred-location/dist/Leaflet.BlurredLocation.js', 'advanced_search.js', + 'submit_form_ajax.js', 'application.js', 'comment_expand.js', 'comment.js', diff --git a/test/system/comment_test.rb b/test/system/comment_test.rb new file mode 100644 index 0000000000..d705f5f089 --- /dev/null +++ b/test/system/comment_test.rb @@ -0,0 +1,64 @@ +require 'test_helper' +require "application_system_test_case" +# https://guides.rubyonrails.org/testing.html#implementing-a-system-test + +class CommentTest < ApplicationSystemTestCase + Capybara.default_max_wait_time = 60 + + test 'adding a comment via javascript' do + visit '/' + + click_on 'Login' + + fill_in("username-login", with: "jeff") + fill_in("password-signup", with: "secretive") + click_on "Log in" + + visit "/wiki/wiki-page-path/comments" + + # run the javascript function + page.evaluate_script("addComment('fantastic four')") + + # check that the tag showed up on the page + assert_selector('#comments-list .comment-body p', text: 'fantastic four') + end + + test 'adding a comment via javascript with url only' do + visit '/' + + click_on 'Login' + + fill_in("username-login", with: "jeff") + fill_in("password-signup", with: "secretive") + click_on "Log in" + + visit "/wiki/wiki-page-path/comments" + + # run the javascript function + page.evaluate_script("addComment('superhero', '/comment/create/11')") + + # check that the tag showed up on the page + assert_selector('#comments-list .comment-body p', text: 'superhero') + end + + test 'adding a reply comment via javascript with url only' do + visit '/' + + click_on 'Login' + + fill_in("username-login", with: "jeff") + fill_in("password-signup", with: "secretive") + click_on "Log in" + + visit "/wiki/wiki-page-path/comments" + + # run the javascript function + parentid = "#" + page.find('#comments-list').first('.comment')[:id] + parentid_num = parentid.slice(2..-1) + page.evaluate_script("addComment('batman', '/comment/create/11', #{parentid_num})") + + # check that the tag showed up on the page + assert_selector("#{parentid} .comment .comment-body p", text: 'batman') + end + +end diff --git a/test/system/tag_test.rb b/test/system/tag_test.rb new file mode 100644 index 0000000000..ba0c83f4e0 --- /dev/null +++ b/test/system/tag_test.rb @@ -0,0 +1,48 @@ +require 'test_helper' +require "application_system_test_case" +# https://guides.rubyonrails.org/testing.html#implementing-a-system-test + +class TagTest < ApplicationSystemTestCase + Capybara.default_max_wait_time = 60 + + test 'adding a tag via javascript' do + visit '/' + + click_on 'Login' + + fill_in("username-login", with: "jeff") + fill_in("password-signup", with: "secretive") + click_on "Log in" + + visit "/wiki/wiki-page-path" + + # run the javascript function + page.evaluate_script("addTag('bluebell')") + + # check that the tag showed up on the page + assert_selector('.tags-list .tag-name', text: 'bluebell') + + end + + test 'adding a tag via javascript with url only' do + visit '/' + + click_on 'Login' + + fill_in("username-login", with: "jeff") + fill_in("password-signup", with: "secretive") + click_on "Log in" + + visit "/wiki/wiki-page-path" + + # run the javascript function + page.evaluate_script("addTag('roses', '/tag/create/11')") + + visit "/wiki/wiki-page-path" # refresh page + + # check that the tag showed up on the page + assert_selector('.tags-list .card-body h5', text: 'roses') + + end + +end