RELNOTES[NEW]: Update setSafeHtml to not flush pending delayed change…

… events when opt_stopDelayedChange=true

PiperOrigin-RevId: 459599300
Change-Id: I753e93b6a63f744cfa885219b09ee37573a2f517

closure/goog/editor/field.js

@@ -1708,9 +1708,11 @@ goog.editor.Field.prototype.dispatchBeforeTab_ = function(e) {
  * @param {boolean=} opt_stopChange Whether to ignore base change events.
  * @param {boolean=} opt_stopDelayedChange Whether to ignore delayed change
  *     events.
+ * @param {boolean=} opt_cancelPendingDelayedChange Whether to prevent any
+ *     pending delayed change events from firing when we disable the event.
  */
 goog.editor.Field.prototype.stopChangeEvents = function(
-    opt_stopChange, opt_stopDelayedChange) {
+    opt_stopChange, opt_stopDelayedChange, opt_cancelPendingDelayedChange) {
   'use strict';
   if (opt_stopChange) {
     if (this.changeTimerGecko_) {
@@ -1720,7 +1722,13 @@ goog.editor.Field.prototype.stopChangeEvents = function(
     this.stopEvent(goog.editor.Field.EventType.CHANGE);
   }
   if (opt_stopDelayedChange) {
-    this.clearDelayedChange();
+    if (opt_cancelPendingDelayedChange) {
+      // Stop the delayed change timer without emitting pending events.
+      this.stopDelayedChange_();
+    } else {
+      // Immediately emit pending delayed change events, which stops the timer.
+      this.clearDelayedChange();
+    }
     this.stopEvent(goog.editor.Field.EventType.DELAYEDCHANGE);
   }
 };
@@ -1947,6 +1955,20 @@ goog.editor.Field.prototype.clearDelayedChange = function() {
   this.delayedChangeTimer_.fireIfActive();
 };
 
+/**
+ * Stop the timer, effectively canceling any pending delayed changes.
+ *
+ * @private
+ */
+goog.editor.Field.prototype.stopDelayedChange_ = function() {
+  'use strict';
+  // The changeTimerGecko_ will queue up a delayed change so to fully stop
+  // delayed change we must also stop this timer.
+  if (this.changeTimerGecko_) {
+    this.changeTimerGecko_.stop();
+  }
+  this.delayedChangeTimer_.stop();
+};
 
 /**
  * Dispatch beforefocus and focus for FF. Note that both of these actually
@@ -2219,7 +2241,7 @@ goog.editor.Field.prototype.setSafeHtml = function(
   // If we don't want change events to fire, we have to turn off change events
   // before setting the field contents, since that causes mutation events.
   if (opt_dontFireDelayedChange) {
-    this.stopChangeEvents(false, true);
+    this.stopChangeEvents(false, true, true);
   }
 
   this.setInnerHtml_(html);

closure/goog/editor/field_test.js

@@ -1255,6 +1255,45 @@ testSuite({
     }
   },
 
+  testSetSafeHtml_withPendingDelayedChangeEvent() {
+    const editableField = new FieldConstructor('testField', document);
+    const clock = new MockClock(true);
+
+    try {
+      let delayedChangeCalled = false;
+      events.listen(editableField, Field.EventType.DELAYEDCHANGE, () => {
+        delayedChangeCalled = true;
+      });
+
+      editableField.makeEditable();
+      clock.tick(1000);
+      assertFalse(
+          'Make editable must not fire delayed change.', delayedChangeCalled);
+
+      let shouldWrapInParagraphTag = false;
+      editableField.setSafeHtml(
+          shouldWrapInParagraphTag, SafeHtml.htmlEscape('foo'),
+          false /* Fire delayed change */);
+      testingDom.assertHtmlContentsMatch('foo', editableField.getElement());
+      clock.tick(100);
+      assertFalse(
+          'delayedChange should not fire after only 100ms.',
+          delayedChangeCalled);
+
+      editableField.setSafeHtml(
+          shouldWrapInParagraphTag, SafeHtml.htmlEscape('bar'),
+          true /* Don't fire delayed change */);
+      testingDom.assertHtmlContentsMatch('bar', editableField.getElement());
+      clock.tick(1000);
+      assertFalse(
+          'setSafeHtml must not fire pending delayed change if so configured.',
+          delayedChangeCalled);
+    } finally {
+      clock.dispose();
+      editableField.dispose();
+    }
+  },
+
   /**
      Verify that restoreSavedRange() restores the range and sets the focus.
    */