Triggering click event with modifier keys on input element

Question

I'm writing a test for some functionality that involves user shift-clicking on a checkbox. I'm using $('input').trigger($.Event('click', { shiftKey: true })); to simulate that.

But when the event listener gets called, event.shiftKey property always gets reported as false when originating from my synthetic events, while real clicks produce the desired effect. What's more confusing, triggering the same event on a non-input element seems to work just fine. See http://jsfiddle.net/huskssk1/ for example.

I'm observing this behaviour both in my browser (Chrome 39, OS X) and test stack (Poltergeist 1.5.1 + PhantomJS 1.9.8).

What's causing this? Is there any way around it?

PS My full test stack is Ruby on Rails + RSpec + Capybara + Poltergeist + PhantomJS, if you know a better way to trigger shift-click, do let me know!

Answer 1

body.on('click', function(e) { 
    //e.stopPropagation();
    console.log('body', e.shiftKey);
});

I just updated your jsfiddle: http://jsfiddle.net/huskssk1/1/

The only change I made is the jQuery version to 1.8.3, since it was not firing input's click event so I commented e.stopPropogation from body click event handler.

This clearly shows that something is different between the two versions of jQuery.