fix: allow "updateComplete" to resolve to a boolean like the LitEleme…

…nt default

packages/bundle/elements.ts

@@ -76,5 +76,7 @@ import '@spectrum-web-components/theme/src/themes.js';
 import '@spectrum-web-components/thumbnail/sp-thumbnail.js';
 import '@spectrum-web-components/toast/sp-toast.js';
 import '@spectrum-web-components/tooltip/sp-tooltip.js';
+import '@spectrum-web-components/top-nav/sp-top-nav.js';
+import '@spectrum-web-components/top-nav/sp-top-nav-item.js';
 import '@spectrum-web-components/tray/sp-tray.js';
 import '@spectrum-web-components/underlay/sp-underlay.js';

packages/bundle/package.json

@@ -100,6 +100,7 @@
         "@spectrum-web-components/thumbnail": "^0.2.2",
         "@spectrum-web-components/toast": "^0.8.12",
         "@spectrum-web-components/tooltip": "^0.8.12",
+        "@spectrum-web-components/top-nav": "^0.3.5",
         "@spectrum-web-components/tray": "^0.0.4",
         "@spectrum-web-components/underlay": "^0.6.7",
         "tslib": "^2.0.0"

packages/bundle/src/index.ts

@@ -60,5 +60,6 @@ export * from '@spectrum-web-components/theme';
 export * from '@spectrum-web-components/thumbnail';
 export * from '@spectrum-web-components/toast';
 export * from '@spectrum-web-components/tooltip';
+export * from '@spectrum-web-components/top-nav';
 export * from '@spectrum-web-components/tray';
 export * from '@spectrum-web-components/underlay';

packages/bundle/tsconfig.json

@@ -61,6 +61,7 @@
         { "path": "../thumbnail" },
         { "path": "../toast" },
         { "path": "../tooltip" },
+        { "path": "../top-nav" },
         { "path": "../tray" },
         { "path": "../underlay" }
     ]

packages/icon/src/Icon.ts

@@ -116,8 +116,9 @@ export class Icon extends IconBase {
         return { iconset: iconsetName, icon: iconName };
     }
 
-    protected async _getUpdateComplete(): Promise<void> {
-        await super._getUpdateComplete();
+    protected async _getUpdateComplete(): Promise<boolean> {
+        const complete = (await super._getUpdateComplete()) as boolean;
         await this.updateIconPromise;
+        return complete;
     }
 }

packages/icon/test/benchmark/test-basic.ts

@@ -15,9 +15,14 @@ import '@spectrum-web-components/icons/sp-icons-medium.js';
 import { html } from '@spectrum-web-components/base';
 import { measureFixtureCreation } from '../../../../test/benchmark/helpers.js';
 
-const iconset = document.createElement('sp-icons-medium');
-document.body.append(iconset);
+async function test(): Promise<void> {
+    const iconset = document.createElement('sp-icons-medium');
+    document.body.append(iconset);
+    await iconset.updateComplete;
 
-measureFixtureCreation(html`
-    <sp-icon name="ui:CheckmarkMedium"></sp-icon>
-`);
+    measureFixtureCreation(html`
+        <sp-icon name="ui:Arrow100"></sp-icon>
+    `);
+}
+
+test();

packages/iconset/stories/icons-demo.ts

@@ -42,16 +42,19 @@ export class DelayedReady extends SpectrumElement {
         );
     }
 
-    protected async _getUpdateComplete(): Promise<void> {
-        await super._getUpdateComplete();
+    protected async _getUpdateComplete(): Promise<boolean> {
+        const complete = (await super._getUpdateComplete()) as boolean;
         await this._delayedReady;
+        return complete;
     }
 
     public handleSlotchange({
         target,
     }: Event & { target: HTMLSlotElement }): void {
         if (target.assignedElements({ flatten: true }).length) {
-            this._resolveDelayedReady();
+            requestAnimationFrame(() => {
+                this._resolveDelayedReady();
+            });
         }
     }
 }

packages/overlay/src/ActiveOverlay.ts

@@ -512,8 +512,9 @@ export class ActiveOverlay extends SpectrumElement {
     private stealOverlayContentPromise = Promise.resolve();
     private stealOverlayContentResolver!: () => void;
 
-    protected async _getUpdateComplete(): Promise<void> {
-        await super._getUpdateComplete();
+    protected async _getUpdateComplete(): Promise<boolean> {
+        const complete = (await super._getUpdateComplete()) as boolean;
         await this.stealOverlayContentPromise;
+        return complete;
     }
 }

packages/picker/src/Picker.ts

@@ -481,9 +481,10 @@ export class PickerBase extends SizedMixin(Focusable) {
     private menuStatePromise = Promise.resolve();
     private menuStateResolver!: () => void;
 
-    protected async _getUpdateComplete(): Promise<void> {
-        await super._getUpdateComplete();
+    protected async _getUpdateComplete(): Promise<boolean> {
+        const complete = (await super._getUpdateComplete()) as boolean;
         await this.menuStatePromise;
+        return complete;
     }
 
     public connectedCallback(): void {

packages/tabs/src/Tabs.ts

@@ -392,9 +392,10 @@ export class Tabs extends Focusable {
         return;
     };
 
-    protected async _getUpdateComplete(): Promise<void> {
-        await super._getUpdateComplete();
+    protected async _getUpdateComplete(): Promise<boolean> {
+        const complete = (await super._getUpdateComplete()) as boolean;
         await this.tabChangePromise;
+        return complete;
     }
 
     public connectedCallback(): void {

test/benchmark/cli.ts

@@ -210,6 +210,7 @@ $ node test/benchmark/cli -n 20
                         label: 'remote',
                         dependencies: {
                             '@spectrum-web-components/bundle': opts.compare,
+                            '@spectrum-web-components/top-nav': 'latest',
                         },
                     },
                     measurement: 'global',