chore: fix storybook dev mode warning (#5896)

TarunAdobe · web-flow · commit 0f9feba31f66 · 2025-11-18T16:17:47.000-07:00
diff --git a/1st-gen/packages/action-menu/src/ActionMenu.ts b/1st-gen/packages/action-menu/src/ActionMenu.ts
@@ -148,19 +148,21 @@ export class ActionMenu extends ObserveSlotPresence(
     }
 
     protected override warnNoLabel(): void {
-        window.__swc.warn(
-            this,
-            `<${this.localName}> needs one of the following to be accessible:`,
-            'https://opensource.adobe.com/spectrum-web-components/components/action-menu/#accessibility',
-            {
-                type: 'accessibility',
-                issues: [
-                    `an <sp-field-label> element with a \`for\` attribute referencing the \`id\` of the \`<${this.localName}>\`, or`,
-                    'value supplied to the "label" attribute, which will be displayed visually as placeholder text',
-                    'text content supplied in a <span> with slot="label", or, text content supplied in a <span> with slot="label-only"',
-                    'which will also be displayed visually as placeholder text.',
-                ],
-            }
-        );
+        if (window.__swc?.DEBUG) {
+            window.__swc.warn(
+                this,
+                `<${this.localName}> needs one of the following to be accessible:`,
+                'https://opensource.adobe.com/spectrum-web-components/components/action-menu/#accessibility',
+                {
+                    type: 'accessibility',
+                    issues: [
+                        `an <sp-field-label> element with a \`for\` attribute referencing the \`id\` of the \`<${this.localName}>\`, or`,
+                        'value supplied to the "label" attribute, which will be displayed visually as placeholder text',
+                        'text content supplied in a <span> with slot="label", or, text content supplied in a <span> with slot="label-only"',
+                        'which will also be displayed visually as placeholder text.',
+                    ],
+                }
+            );
+        }
     }
 }
diff --git a/1st-gen/packages/overlay/src/slottable-request-directive.ts b/1st-gen/packages/overlay/src/slottable-request-directive.ts
@@ -74,7 +74,7 @@ export class SlottableRequestDirective extends AsyncDirective {
             { signal }
         );
 
-        if (window.__swc.DEBUG) {
+        if (window.__swc?.DEBUG) {
             window.__swc.warn(
                 undefined,
                 `⚠️  WARNING ⚠️ : The Overlay Trigger Directive is experimental and there is no guarantees behind its usage in an application!! Its API and presence within the library could be changed at anytime. See "sp-overlay" or "Overlay.open()" for a stable API for overlaying content on your application.`,
diff --git a/1st-gen/packages/overlay/src/slottable-request-event.ts b/1st-gen/packages/overlay/src/slottable-request-event.ts
@@ -23,7 +23,7 @@ export class SlottableRequestEvent extends Event {
         this.name = name;
         this.data = data;
         this.slotName = key !== undefined ? `${name}.${key}` : name;
-        if (window.__swc.DEBUG) {
+        if (window.__swc?.DEBUG) {
             window.__swc.warn(
                 undefined,
                 `⚠️  WARNING ⚠️ : \`slottable-request\` events are experimental and there is no guarantees behind usage of them in an application!! Their shape and presence within the library could be changed at anytime.
diff --git a/1st-gen/packages/picker/src/Picker.ts b/1st-gen/packages/picker/src/Picker.ts
@@ -556,19 +556,21 @@ export class PickerBase extends SizedMixin(SpectrumElement, {
     }
 
     protected warnNoLabel(): void {
-        window.__swc.warn(
-            this,
-            `<${this.localName}> needs one of the following to be accessible:`,
-            'https://opensource.adobe.com/spectrum-web-components/components/picker/#accessibility',
-            {
-                type: 'accessibility',
-                issues: [
-                    `an <sp-field-label> element with a \`for\` attribute referencing the \`id\` of the \`<${this.localName}>\`, or`,
-                    'value supplied to the "label" attribute, which will be displayed visually as placeholder text, or',
-                    'text content supplied in a <span> with slot="label", which will also be displayed visually as placeholder text.',
-                ],
-            }
-        );
+        if (window.__swc?.DEBUG) {
+            window.__swc.warn(
+                this,
+                `<${this.localName}> needs one of the following to be accessible:`,
+                'https://opensource.adobe.com/spectrum-web-components/components/picker/#accessibility',
+                {
+                    type: 'accessibility',
+                    issues: [
+                        `an <sp-field-label> element with a \`for\` attribute referencing the \`id\` of the \`<${this.localName}>\`, or`,
+                        'value supplied to the "label" attribute, which will be displayed visually as placeholder text, or',
+                        'text content supplied in a <span> with slot="label", which will also be displayed visually as placeholder text.',
+                    ],
+                }
+            );
+        }
     }
 
     protected renderOverlay(menu: TemplateResult): TemplateResult {
@@ -1000,7 +1002,7 @@ export class Picker extends PickerBase {
         );
         if (!this.value || nextItem !== this.selectedItem) {
             // updates picker text but does not fire change event until action is completed
-            if (!!nextItem) this.setValueFromItem(nextItem as MenuItem);
+            if (nextItem) this.setValueFromItem(nextItem as MenuItem);
         }
     };
 }
diff --git a/1st-gen/packages/slider/src/Slider.ts b/1st-gen/packages/slider/src/Slider.ts
@@ -31,7 +31,7 @@ import {
 
 import sliderStyles from './slider.css.js';
 import { ObserveSlotText } from '@spectrum-web-components/shared/src/observe-slot-text.js';
-import { StyleInfo } from 'lit/directives/style-map.js';
+import type { StyleInfo } from '@spectrum-web-components/base/src/directives.js';
 import '@spectrum-web-components/field-label/sp-field-label.js';
 import type { NumberField } from '@spectrum-web-components/number-field';
 import { HandleController, HandleValueDictionary } from './HandleController.js';
@@ -232,7 +232,7 @@ export class Slider extends SizedMixin(ObserveSlotText(SliderHandle, ''), {
         this.handleController.hostConnected();
 
         // Deprecation warning for default slot when content is provided
-        if (window.__swc.DEBUG && this.textContent?.trim()) {
+        if (window.__swc?.DEBUG && this.textContent?.trim()) {
             window.__swc.warn(
                 this,
                 `The default slot for text label in <${this.localName}> has been deprecated and will be removed in a future release. Use the "label" property instead.`,
diff --git a/1st-gen/storybook/preview.js b/1st-gen/storybook/preview.js
@@ -16,6 +16,25 @@ import { Locales } from '@spectrum-web-components/story-decorator/src/locales.js
 import DocumentationTemplate from './DocumentationTemplate.mdx';
 import '@spectrum-web-components/story-decorator/sp-story-decorator.js';
 
+/**
+ * Ensure that window.__swc is defined in the storybook runtime.
+ *
+ * This prevents debug-only calls like `window.__swc.warn(...)` from throwing
+ * when the debug flag is inlined to `true` by the dev build configuration.
+ */
+if (typeof window !== 'undefined') {
+    window.__swc = window.__swc || {};
+    if (typeof window.__swc.DEBUG === 'undefined') {
+        window.__swc.DEBUG = true;
+    }
+    if (typeof window.__swc.warn !== 'function') {
+        window.__swc.warn = (...args) => {
+            // Forward warnings to the console for visibility in storybook.
+            console.warn('[SWC]', ...args);
+        };
+    }
+}
+
 // const cem = await import('./custom-elements.json', {
 //     assert: { type: 'json' },
 // });
