diff --git a/.changeset/bright-trams-march.md b/.changeset/bright-trams-march.md new file mode 100644 index 00000000000..667ad91c87c --- /dev/null +++ b/.changeset/bright-trams-march.md @@ -0,0 +1,5 @@ +--- +'@spectrum-web-components/tooltip': patch +--- + +**Fixed** : tooltip max-width specificity issue diff --git a/packages/help-text/test/help-text.test.ts b/packages/help-text/test/help-text.test.ts index 9bba32492c8..0a5d3560fdd 100644 --- a/packages/help-text/test/help-text.test.ts +++ b/packages/help-text/test/help-text.test.ts @@ -15,38 +15,76 @@ import { elementUpdated, expect, fixture, html } from '@open-wc/testing'; import '@spectrum-web-components/help-text/sp-help-text.js'; import { HelpText } from '@spectrum-web-components/help-text'; import { testForLitDevWarnings } from '../../../test/testing-helpers.js'; +import { HelpTextManager } from '../src/HelpTextManager.js'; describe('HelpText', () => { testForLitDevWarnings( async () => - await fixture( - html` - This is help text. - ` - ) + await fixture(html` + This is help text. + `) ); it('loads default help-text accessibly', async () => { - const el = await fixture( - html` - This is help text. - ` - ); + const el = await fixture(html` + This is help text. + `); await elementUpdated(el); await expect(el).to.be.accessible(); }); it('loads negative/icon help-text accessibly', async () => { - const el = await fixture( - html` - - This is negative help text. - - ` - ); + const el = await fixture(html` + + This is negative help text. + + `); await elementUpdated(el); await expect(el).to.be.accessible(); }); + + describe('HelpTextManager', () => { + let manager: HelpTextManager; + let host: HTMLElement; + + beforeEach(() => { + host = document.createElement('div'); + document.body.appendChild(host); + manager = new HelpTextManager(host, { mode: 'external' }); + }); + + afterEach(() => { + if (host.parentNode) { + host.parentNode.removeChild(host); + } + }); + + it('creates manager with correct id format', () => { + expect(manager.id).to.match(/^sp-help-text-/); + }); + + it('renders template with correct structure', () => { + const template = manager.render(); + expect(template).to.be.instanceOf(Object); + }); + + it('renders negative template when negative is true', () => { + const template = manager.render(true); + expect(template).to.be.instanceOf(Object); + }); + + it('has correct mode setting', () => { + const externalManager = new HelpTextManager(host, { + mode: 'external', + }); + const internalManager = new HelpTextManager(host, { + mode: 'internal', + }); + + expect(externalManager).to.be.instanceOf(HelpTextManager); + expect(internalManager).to.be.instanceOf(HelpTextManager); + }); + }); }); diff --git a/packages/tooltip/src/tooltip.css b/packages/tooltip/src/tooltip.css index a8a85c25254..b2cbb86201b 100644 --- a/packages/tooltip/src/tooltip.css +++ b/packages/tooltip/src/tooltip.css @@ -20,7 +20,6 @@ #tooltip { width: fit-content; white-space: initial; - max-width: var(--spectrum-tooltip-max-inline-size); } #tip {