refactor!: set white-space: pre-wrap on the tooltip content (#8255)

vaadin · Dec 2, 2024 · fc8e744 · fc8e744
1 parent 97e2acb
commit fc8e744
Show file tree

Hide file tree

Showing 3 changed files with 4 additions and 6 deletions.
diff --git a/packages/tooltip/src/vaadin-tooltip-overlay-styles.js b/packages/tooltip/src/vaadin-tooltip-overlay-styles.js
@@ -10,6 +10,10 @@ export const tooltipOverlayStyles = css`
     max-width: 40ch;
   }
 
+  [part='content'] {
+    white-space: pre-wrap;
+  }
+
   :host([position^='top'][top-aligned]) [part='overlay'],
   :host([position^='bottom'][top-aligned]) [part='overlay'] {
     margin-top: var(--vaadin-tooltip-offset-top, 0);

diff --git a/packages/tooltip/test/visual/lumo/tooltip.test.js b/packages/tooltip/test/visual/lumo/tooltip.test.js
@@ -70,9 +70,6 @@ describe('tooltip', () => {
   it('white-space-pre', async () => {
     element.text = 'Line 1\n\nLine 2';
     fire(target, 'mouseenter');
-    const overlay = document.querySelector('vaadin-tooltip-overlay');
-    const content = overlay.shadowRoot.querySelector('[part="content"]');
-    content.style.whiteSpace = 'pre';
     await visualDiff(div, 'white-space-pre');
   });
 });
diff --git a/packages/tooltip/test/visual/material/tooltip.test.js b/packages/tooltip/test/visual/material/tooltip.test.js
@@ -73,9 +73,6 @@ describe('tooltip', () => {
   it('white-space-pre', async () => {
     element.text = 'Line 1\n\nLine 2';
     fire(target, 'mouseenter');
-    const overlay = document.querySelector('vaadin-tooltip-overlay');
-    const content = overlay.shadowRoot.querySelector('[part="content"]');
-    content.style.whiteSpace = 'pre';
     await visualDiff(div, 'white-space-pre');
   });
 });