Refactor JS functions add_tag() and create add_comment() for pure JS API

[jywarren]

We have a JavaScript function to add tags, here:

plots2/app/assets/javascripts/tagging.js

Lines 1 to 13 in 86ea8ba

	function addTag(tagname, selector) {
	selector = selector || '#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();
	}
	}

However, it uses the on-page HTML tag form to do this. We should be able to do this directly using AJAX without using an HTML form.

Secondly, we should implement the same functionality for an add_comment('Comment body here') function, similarly AJAX based.

Our functional tests show how these should be possible to run directly, instead of via the HTML page:

plots2/test/functional/comment_controller_test.rb

Lines 43 to 53 in 86ea8ba

	test 'should create note comments' do
	UserSession.create(users(:bob))
	assert_difference 'Comment.count' do
	post :create, params: { id: nodes(:one).nid, body: '[notes:awesome]' }, xhr: true
	end
	assert_response :success
	assert_not_nil :comment
	assert_template partial: 'notes/_comment'
	assert_template partial: 'grids/_notes'
	# assert_equal 1, css_select(".comment table").size # test inline grid rendering
	end

plots2/test/functional/tag_controller_test.rb

Lines 9 to 12 in 86ea8ba

	test 'add one or two tags' do
	UserSession.create(users(:bob))
	post :create, params: { name: 'mytag', nid: nodes(:one).nid, uid: users(:bob).id }

We should create a system test to confirm that these javascript functions actually work! You can run javascript in a system test like this:

plots2/test/system/search_test.rb

Lines 26 to 27 in 86ea8ba

	assert page.evaluate_script("$('.typeahead.dropdown-menu').is(':visible')")
	assert_equal 6, page.evaluate_script("$('.typeahead.dropdown-menu').find('li').length")

[nstjean]

I'll try this out!

[nstjean]

So to check in, what we are doing for that tag form is accepting whatever value is sent in and instead of loading it into the HTML form and submitting the form it is instead sending a POST request via AJAX, right?

$.ajax({ async: false, type: 'POST', url: $('#tagform').attr('action'), data: "name+" + tagname })

The URL of the POST request I either have to grab from the form (as above), or I'd have to have some way to pass the node ID value into the function.