diff --git a/CHANGELOG.rst b/CHANGELOG.rst index 4207c376c1..fb722bb7db 100644 --- a/CHANGELOG.rst +++ b/CHANGELOG.rst @@ -5,6 +5,8 @@ These are notable changes in edx-platform. This is a rolling list of changes, in roughly chronological order, most recent first. Add your entries at or near the top. Include a label indicating the component affected. +Blades: Fix bug when image response in Firefox does not retain input. BLD-711. + Blades: Give numerical response tolerance as a range. BLD-25. Blades: Allow user with BetaTester role correctly use LTI. BLD-641. diff --git a/common/lib/xmodule/xmodule/js/spec/capa/imageinput_spec.js b/common/lib/xmodule/xmodule/js/spec/capa/imageinput_spec.js index d539108a88..b58eeb2f3b 100644 --- a/common/lib/xmodule/xmodule/js/spec/capa/imageinput_spec.js +++ b/common/lib/xmodule/xmodule/js/spec/capa/imageinput_spec.js @@ -18,13 +18,9 @@ el.append(createTestImage('cross_12345', 300, 400, 'red')); state = new ImageInput('12345'); - - spyOn(state, 'clickHandler').andCallThrough(); }); it('initialization', function () { - expect(state.elementId).toBe('12345'); - // Check that object's properties are present, and that the DOM // elements they reference exist. expect(state.el).toBeDefined(); @@ -36,12 +32,7 @@ expect(state.inputEl).toBeDefined(); expect(state.inputEl).toExist(); - // Check that the click handler has been attached to the `state.el` - // element. Note that `state.clickHandler()` method is called from - // within the attached handler. That is why we can't use - // Jasmine-jQuery `toHandleWith()` method. - state.el.click(); - expect(state.clickHandler).toHaveBeenCalled(); + expect(state.el).toHandle('click'); }); it('cross becomes visible after first click', function () { @@ -81,7 +72,8 @@ }); it('coordinates are updated [offsetX is NOT set]', function () { - var event, posX, posY, cssLeft, cssTop; + var offset = state.el.offset(), + event, posX, posY, cssLeft, cssTop; // Set up of 'click' event. event = jQuery.Event( @@ -91,12 +83,10 @@ pageX: 35.3, pageY: 42.7 } ); - state.el[0].offsetLeft = 12; - state.el[0].offsetTop = 3; // Calculating the expected coordinates. - posX = event.pageX - state.el[0].offsetLeft; - posY = event.pageY - state.el[0].offsetTop; + posX = event.pageX - offset.left; + posY = event.pageY - offset.top; // Triggering 'click' event. jQuery(state.el).trigger(event); diff --git a/common/lib/xmodule/xmodule/js/src/capa/imageinput.js b/common/lib/xmodule/xmodule/js/src/capa/imageinput.js index d5df6e2ba6..1e182cba8d 100644 --- a/common/lib/xmodule/xmodule/js/src/capa/imageinput.js +++ b/common/lib/xmodule/xmodule/js/src/capa/imageinput.js @@ -24,24 +24,19 @@ window.ImageInput = (function ($, undefined) { return ImageInput; function ImageInputConstructor(elementId) { - var _this = this; + this.el = $('#imageinput_' + elementId); + this.crossEl = $('#cross_' + elementId); + this.inputEl = $('#input_' + elementId); - this.elementId = elementId; - - this.el = $('#imageinput_' + this.elementId); - this.crossEl = $('#cross_' + this.elementId); - this.inputEl = $('#input_' + this.elementId); - - this.el.on('click', function (event) { - _this.clickHandler(event); - }); + this.el.on('click', this.clickHandler.bind(this)); } function clickHandler(event) { - var posX = event.offsetX ? - event.offsetX : event.pageX - this.el[0].offsetLeft, + var offset = this.el.offset(), + posX = event.offsetX ? + event.offsetX : event.pageX - offset.left, posY = event.offsetY ? - event.offsetY : event.pageY - this.el[0].offsetTop, + event.offsetY : event.pageY - offset.top, // To reduce differences between values returned by different kinds // of browsers, we round `posX` and `posY`.