Question

Inside my app I’m using a jQuery plugin, FullCalendar – it is a jQuery calendar that looks like Google Calendar.

I would like to write a functional test (CalendarControllerTest < ActionController::TestCase) that tests the calendar is being displayed (CalendarController#index).

That would be easy if the calendar was regular HTML, instead it is written in JavaScript so inside my HTML page I have:

<script src="fullcalendar.js" type="text/javascript"></script>
<script src="calendar.js" type="text/javascript"></script>
[...]
<div id="calendar"></div>

Inside calendar.js (scaffolding from Rails 3.1 – CalendarController + calendar.js + calendar.css + CalendarControllerTest) I load FullCalendar:

$('#calendar').fullCalendar();

Thus inside my functional test (CalendarControllerTest) this won’t work:

# Checks <div class="fc-content"> is present i.e the calendar is being displayed
assert_select '.fc-content', count: 1

I tried to use assert_select_jquery without success:

assert_select_jquery :html, '#calendar' do
  assert_select '.fc-content', count: 1
end

I know about Webrat/Capybara but from what I see it is used for integration tests not functional tests.

How would you do that?

Answer 1

Answering to myself…
I use default Rails test framework to test model and controllers (directories test/unit and test/functionnal).
assert_select_jquery is used with functionnal tests (controller) when you have unobstrusive JavaScript like a create.js.erb or destroy.js.erb.
I don’t fully test JavaScript inside functionnal tests, for that I use Capybara within directory test/integration.