Commit b7e5a1d5 authored by Robert Knight's avatar Robert Knight

Dispatch markdown editor input changes from $apply() block

The input event handler's callback was not invoked inside an $apply()
block, so the $digest function was never called to propagate the changes
in vm.setEditText() in annotation.js. This happened to work previously
because ngModel's $setViewValue() was called to apply input changes,
which internally uses $scope.$apply().

This commit wraps the input events from the markdown editor with $apply
but debounces them. Since $apply() triggers every single watcher in the
application, running it on every keystroke causes noticeable lag
otherwise.

Fixes #3212
parent bed6b6a8
'use strict'; 'use strict';
var angular = require('angular'); var angular = require('angular');
var debounce = require('lodash.debounce');
var katex = require('katex'); var katex = require('katex');
var commands = require('../markdown-commands'); var commands = require('../markdown-commands');
...@@ -220,9 +221,12 @@ module.exports = function($filter, $sanitize) { ...@@ -220,9 +221,12 @@ module.exports = function($filter, $sanitize) {
}; };
// React to the changes to the input // React to the changes to the input
inputEl.bind('blur change keyup', function () { var handleInputChange = debounce(function () {
scope.$apply(function () {
scope.onEditText({text: input.value}); scope.onEditText({text: input.value});
}); });
}, 100);
inputEl.bind('blur change keyup', handleInputChange);
// Re-render the markdown when the view needs updating. // Re-render the markdown when the view needs updating.
scope.$watch('text', function () { scope.$watch('text', function () {
......
...@@ -44,6 +44,12 @@ describe('markdown', function () { ...@@ -44,6 +44,12 @@ describe('markdown', function () {
return 'math:' + input.replace(/$$/g, ''); return 'math:' + input.replace(/$$/g, '');
}, },
}, },
'lodash.debounce': function (fn) {
// Make input change debouncing synchronous in tests
return function () {
fn();
};
},
'../markdown-commands': { '../markdown-commands': {
convertSelectionToLink: mockFormattingCommand, convertSelectionToLink: mockFormattingCommand,
toggleBlockStyle: mockFormattingCommand, toggleBlockStyle: mockFormattingCommand,
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment