fix: hide opening tooltip on color or background button click (#10032)

Author: web-padawan

packages/rich-text-editor/src/vaadin-rich-text-editor-mixin.js

@@ -662,6 +662,7 @@ export const RichTextEditorMixin = (superClass) =>
 
     /** @private */
     __onColorClick() {
+      this._tooltip.opened = false;
       this._colorEditing = true;
     }
 
@@ -678,6 +679,7 @@ export const RichTextEditorMixin = (superClass) =>
 
     /** @private */
     __onBackgroundClick() {
+      this._tooltip.opened = false;
       this._backgroundEditing = true;
     }
 

packages/rich-text-editor/test/toolbar.test.js

@@ -677,5 +677,23 @@ describe('toolbar controls', () => {
 
       expect(undo.hasAttribute('aria-describedby')).to.be.false;
     });
+
+    it('should hide tooltip on color button click after mouseenter', async () => {
+      const color = getButton('color');
+      fire(color, 'mouseenter');
+      color.click();
+
+      await nextRender();
+      expect(overlay.opened).to.be.false;
+    });
+
+    it('should hide tooltip on background button click after mouseenter', async () => {
+      const background = getButton('background');
+      fire(background, 'mouseenter');
+      background.click();
+
+      await nextRender();
+      expect(overlay.opened).to.be.false;
+    });
   });
 });