chore: test for disconnected overlay

This commit is contained in:
Thijs Louisse 2025-07-26 14:56:22 +02:00 committed by Thijs Louisse
parent 1d3a00c022
commit 9a80ba9c55
3 changed files with 38 additions and 0 deletions

View file

@ -0,0 +1,5 @@
---
'@lion/ui': patch
---
[form-core]: make focusableNode teardown defensive in case the node doesn't exist

View file

@ -0,0 +1,5 @@
---
'@lion/ui': patch
---
[overlays]: make sure that edge cases where overlays are connected and immediately disconnected, are covered well

View file

@ -1,5 +1,6 @@
import { import {
unsafeStatic, unsafeStatic,
fixtureSync,
nextFrame, nextFrame,
aTimeout, aTimeout,
defineCE, defineCE,
@ -315,6 +316,33 @@ export function runOverlayMixinSuite({ tagString, tag, suffix = '' }) {
expect(getComputedStyle(el._overlayCtrl.contentWrapperNode).display).not.to.equal('none'); expect(getComputedStyle(el._overlayCtrl.contentWrapperNode).display).not.to.equal('none');
}); });
it('does not run setup when disconnected', async () => {
const el = /** @type {OverlayEl} */ (
fixtureSync(html`
<${tag}>
<div slot="content">content</div>
<button slot="invoker">invoker button</button>
</${tag}>
`)
);
const parentOfEl = /** @type {HTMLDivElement} */ (el.parentElement);
// @ts-expect-error [allow-protected-in-tests]
const setupSpy = sinon.spy(el, '_setupOverlayCtrl');
// In some client apps, this sync disconnect happens...
parentOfEl.removeChild(el);
await el.updateComplete;
expect(setupSpy.callCount).to.equal(0);
// Now add el again...
parentOfEl.appendChild(el);
await el.updateComplete;
expect(setupSpy.callCount).to.equal(1);
setupSpy.restore();
});
/** Prevent unnecessary reset side effects, such as show animation. See: https://github.com/ing-bank/lion/issues/1075 */ /** Prevent unnecessary reset side effects, such as show animation. See: https://github.com/ing-bank/lion/issues/1075 */
it('does not call updateConfig on equivalent config change', async () => { it('does not call updateConfig on equivalent config change', async () => {
const el = /** @type {OverlayEl} */ ( const el = /** @type {OverlayEl} */ (