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

h/static/scripts/directive/markdown.js

 'use strict';
 
 var angular = require('angular');
+var debounce = require('lodash.debounce');
 var katex = require('katex');
 
 var commands = require('../markdown-commands');
@@ -220,9 +221,12 @@ module.exports = function($filter, $sanitize) {
       };
 
       // React to the changes to the input
-      inputEl.bind('blur change keyup', function () {
-        scope.onEditText({text: input.value});
-      });
+      var handleInputChange = debounce(function () {
+        scope.$apply(function () {
+          scope.onEditText({text: input.value});
+        });
+      }, 100);
+      inputEl.bind('blur change keyup', handleInputChange);
 
       // Re-render the markdown when the view needs updating.
       scope.$watch('text', function () {

h/static/scripts/directive/test/markdown-test.js

@@ -44,6 +44,12 @@ describe('markdown', function () {
             return 'math:' + input.replace(/$$/g, '');
           },
         },
+        'lodash.debounce': function (fn) {
+          // Make input change debouncing synchronous in tests
+          return function () {
+            fn();
+          };
+        },
         '../markdown-commands': {
           convertSelectionToLink: mockFormattingCommand,
           toggleBlockStyle: mockFormattingCommand,