fix: fire change event on hyperlink edit, update test timings (#7250) (…

…#7253)
vaadin · Mar 21, 2024 · 8c5b0ea · 8c5b0ea
1 parent 3eaa9e2
commit 8c5b0ea
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 4 deletions.
diff --git a/packages/rich-text-editor/src/vaadin-rich-text-editor.js b/packages/rich-text-editor/src/vaadin-rich-text-editor.js
@@ -634,8 +634,9 @@ class RichTextEditor extends ElementMixin(ThemableMixin(PolymerElement)) {
     });
 
     editorContent.addEventListener('focus', () => {
-      // Format changed, but no value changed happened
-      if (this._toolbarState === STATE.CLICKED) {
+      // When editing link, editor gets focus while dialog is still open.
+      // Keep toolbar state as clicked in this case to fire change event.
+      if (this._toolbarState === STATE.CLICKED && !this._linkEditing) {
         this._cleanToolbarState();
       }
     });

diff --git a/packages/rich-text-editor/test/basic.test.js b/packages/rich-text-editor/test/basic.test.js
@@ -401,34 +401,39 @@ describe('rich text editor', () => {
       });
 
       describe('change', () => {
-        it('should dispatch change event if the value has been updated', () => {
+        it('should dispatch change event if the value has been updated', async () => {
           rte.value = JSON.stringify([{ insert: 'Vaadin' }]);
           editor.focus();
           editor.setSelection(0, 6);
           flushValueDebouncer();
           btn.click();
+          await nextRender();
+
           rte.$.linkUrl.value = url;
 
           const spy = sinon.spy();
           rte.addEventListener('change', spy);
 
           rte.$.confirmLink.click();
+          await nextRender();
           flushValueDebouncer();
           expect(spy.calledOnce).to.be.true;
         });
 
-        it('should not change value and not dispatch change if the dialog was cancelled', () => {
+        it('should not change value and not dispatch change if the dialog was cancelled', async () => {
           const value = `[{"attributes":{"link":"${url}"},"insert":"Vaadin"},{"insert":"\\n"}]`;
           rte.value = value;
           flushValueDebouncer();
           editor.focus();
           editor.setSelection(0, 6);
           btn.click();
+          await nextRender();
 
           const spy = sinon.spy();
           rte.addEventListener('change', spy);
 
           rte.$.cancelLink.click();
+          await nextRender();
           flushValueDebouncer();
           expect(rte.value).to.equal(value);
           expect(spy.called).to.be.false;