@truenas/ui-components 0.1.32 → 0.1.33

package/fesm2022/truenas-ui-components.mjs

@@ -17,13 +17,13 @@ import { TemplatePortal, PortalModule, ComponentPortal } from '@angular/cdk/port
 import { CdkMenu, CdkMenuItem, CdkMenuTrigger } from '@angular/cdk/menu';
 import { trigger, state, transition, style, animate } from '@angular/animations';
 import { SPACE, ENTER, END, HOME, DOWN_ARROW, UP_ARROW, RIGHT_ARROW, LEFT_ARROW } from '@angular/cdk/keycodes';
+import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';
 import { DataSource } from '@angular/cdk/collections';
 import * as i1$3 from '@angular/cdk/tree';
 import { CdkTree, CdkTreeModule, CdkTreeNode, CDK_TREE_NODE_OUTLET_NODE, CdkTreeNodeOutlet, CdkNestedTreeNode } from '@angular/cdk/tree';
 export { FlatTreeControl } from '@angular/cdk/tree';
 import { map } from 'rxjs/operators';
 import { DialogRef, DIALOG_DATA, Dialog } from '@angular/cdk/dialog';
-import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';
 import { ScrollingModule } from '@angular/cdk/scrolling';
 
 let nextId = 0;
@@ -4010,6 +4010,190 @@ class TnTabsHarness extends ComponentHarness {
     }
 }
 
+/**
+ * Harness for a single menu item (`button.tn-menu-item`).
+ * @internal Used by TnMenuHarness to interact with individual items.
+ */
+class TnMenuItemHarness extends ComponentHarness {
+    static hostSelector = '.tn-menu-item';
+    _label = this.locatorFor('.tn-menu-item-label');
+    /** Gets the label text of this menu item. */
+    async getLabel() {
+        const label = await this._label();
+        return (await label.text()).trim();
+    }
+    /** Checks whether this menu item is disabled via the native `disabled` attribute. */
+    async isDisabled() {
+        const host = await this.host();
+        const disabled = await host.getProperty('disabled');
+        return !!disabled;
+    }
+    /** Clicks this menu item. */
+    async click() {
+        const host = await this.host();
+        await host.click();
+    }
+}
+/**
+ * Harness for interacting with `tn-menu` in tests.
+ *
+ * Menus render in a CDK overlay **outside** the component tree, so a regular
+ * `TestbedHarnessEnvironment.loader(fixture)` won't find them. Use
+ * `TnMenuTesting.rootLoader(fixture)` instead — it searches the entire document.
+ *
+ * ## Test Setup
+ *
+ * ```typescript
+ * import {
+ *   TnMenuHarness,
+ *   TnMenuTesting,
+ *   TnIconButtonHarness,
+ * } from '@truenas/ui-components';
+ *
+ * let loader: HarnessLoader;   // for components
+ * let rootLoader: HarnessLoader; // for overlays (menus, dialogs)
+ *
+ * beforeEach(() => {
+ *   spectator = createComponent();
+ *   loader = TestbedHarnessEnvironment.loader(spectator.fixture);
+ *   rootLoader = TnMenuTesting.rootLoader(spectator.fixture);
+ * });
+ * ```
+ *
+ * ## Opening a Menu
+ *
+ * Click the trigger element to open the menu before querying it:
+ *
+ * ```typescript
+ * // Via harness (if trigger is a tn-icon-button)
+ * const trigger = await loader.getHarness(
+ *   TnIconButtonHarness.with({ name: 'more_vert' })
+ * );
+ * await trigger.click();
+ *
+ * // Or via DOM
+ * spectator.click('[tnMenuTriggerFor]');
+ * ```
+ *
+ * ## Querying and Clicking Items
+ *
+ * ```typescript
+ * const menu = await rootLoader.getHarness(TnMenuHarness);
+ * expect(await menu.getItemLabels()).toEqual(['Edit', 'Delete']);
+ * await menu.clickItem({ label: 'Edit' });
+ * await menu.clickItem({ label: /del/i }); // regex match
+ * expect(await menu.isItemDisabled({ label: 'Delete' })).toBe(false);
+ * ```
+ */
+class TnMenuHarness extends ComponentHarness {
+    static hostSelector = '.tn-menu';
+    _items = this.locatorForAll(TnMenuItemHarness);
+    /**
+     * Gets a `HarnessPredicate` that can be used to search for a menu.
+     */
+    static with(options = {}) {
+        return new HarnessPredicate(TnMenuHarness, options);
+    }
+    /**
+     * Gets the labels of all menu items.
+     *
+     * @example
+     * ```typescript
+     * const menu = await rootLoader.getHarness(TnMenuHarness);
+     * expect(await menu.getItemLabels()).toEqual(['Edit', 'Delete']);
+     * ```
+     */
+    async getItemLabels() {
+        const items = await this._items();
+        return Promise.all(items.map(item => item.getLabel()));
+    }
+    /**
+     * Clicks a menu item by its label text.
+     *
+     * @param filter Object with `label` to match (string or RegExp).
+     *
+     * @example
+     * ```typescript
+     * const menu = await rootLoader.getHarness(TnMenuHarness);
+     * await menu.clickItem({ label: 'Delete' });
+     * ```
+     */
+    async clickItem(filter) {
+        const items = await this._items();
+        for (const item of items) {
+            const text = await item.getLabel();
+            const matches = filter.label instanceof RegExp
+                ? filter.label.test(text)
+                : text === filter.label;
+            if (matches) {
+                await item.click();
+                return;
+            }
+        }
+        throw new Error(`Could not find menu item matching label "${String(filter.label)}"`);
+    }
+    /**
+     * Checks if a menu item is disabled.
+     *
+     * @param filter Object with `label` to match (string or RegExp).
+     * @returns Promise resolving to true if the item is disabled.
+     *
+     * @example
+     * ```typescript
+     * const menu = await rootLoader.getHarness(TnMenuHarness);
+     * expect(await menu.isItemDisabled({ label: 'Delete' })).toBe(true);
+     * ```
+     */
+    async isItemDisabled(filter) {
+        const items = await this._items();
+        for (const item of items) {
+            const text = await item.getLabel();
+            const matches = filter.label instanceof RegExp
+                ? filter.label.test(text)
+                : text === filter.label;
+            if (matches) {
+                return item.isDisabled();
+            }
+        }
+        throw new Error(`Could not find menu item with label "${String(filter.label)}"`);
+    }
+    /**
+     * Gets the number of menu items (excluding separators).
+     */
+    async getItemCount() {
+        return (await this._items()).length;
+    }
+}
+
+/**
+ * Test utilities for TnMenu.
+ *
+ * Provides a document-root `HarnessLoader` that can find menus rendered
+ * in CDK overlays. Use this alongside `TnDialogTesting.rootLoader()` if
+ * your tests also open dialogs.
+ *
+ * @example
+ * ```typescript
+ * import { TnMenuTesting, TnMenuHarness } from '@truenas/ui-components';
+ *
+ * const rootLoader = TnMenuTesting.rootLoader(spectator.fixture);
+ *
+ * // Open the menu trigger, then query the overlay
+ * spectator.click('[tnMenuTriggerFor]');
+ * const menu = await rootLoader.getHarness(TnMenuHarness);
+ * await menu.clickItem({ label: 'Edit' });
+ * ```
+ */
+class TnMenuTesting {
+    /**
+     * Creates a `HarnessLoader` that searches the entire document,
+     * including CDK overlays where menus are rendered.
+     */
+    static rootLoader(fixture) {
+        return TestbedHarnessEnvironment.documentRootLoader(fixture);
+    }
+}
+
 class TnKeyboardShortcutComponent {
     shortcut = input('', ...(ngDevMode ? [{ debugName: "shortcut" }] : []));
     platform = input('auto', ...(ngDevMode ? [{ debugName: "platform" }] : []));
@@ -11361,5 +11545,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { CommonShortcuts, DEFAULT_THEME, DiskIconComponent, DiskType, FileSizePipe, InputType, LIGHT_THEME, LinuxModifierKeys, LinuxShortcuts, ModifierKeys, QuickShortcuts, ShortcutBuilder, StripMntPrefixPipe, THEME_MAP, THEME_STORAGE_KEY, TN_THEME_DEFINITIONS, TnAutocompleteComponent, TnAutocompleteHarness, TnBannerActionDirective, TnBannerComponent, TnBannerHarness, TnBrandedSpinnerComponent, TnButtonComponent, TnButtonHarness, TnButtonToggleComponent, TnButtonToggleGroupComponent, TnCalendarComponent, TnCalendarHeaderComponent, TnCardComponent, TnCellDefDirective, TnCheckboxComponent, TnCheckboxHarness, TnCheckboxLabelDirective, TnChipComponent, TnConfirmDialogComponent, TnDateInputComponent, TnDateRangeInputComponent, TnDialog, TnDialogHarness, TnDialogShellComponent, TnDialogTesting, TnDividerComponent, TnDividerDirective, TnDrawerComponent, TnDrawerContainerComponent, TnDrawerContainerHarness, TnDrawerContentComponent, TnDrawerHarness, TnEmptyComponent, TnEmptyHarness, TnExpansionPanelComponent, TnFilePickerComponent, TnFilePickerPopupComponent, TnFormFieldComponent, TnFormFieldHarness, TnHeaderCellDefDirective, TnIconButtonComponent, TnIconButtonHarness, TnIconComponent, TnIconHarness, TnIconRegistryService, TnIconTesting, TnInputComponent, TnInputDirective, TnInputHarness, TnKeyboardShortcutComponent, TnKeyboardShortcutService, TnListAvatarDirective, TnListComponent, TnListIconDirective, TnListItemComponent, TnListItemLineDirective, TnListItemPrimaryDirective, TnListItemSecondaryDirective, TnListItemTitleDirective, TnListItemTrailingDirective, TnListOptionComponent, TnListSubheaderComponent, TnMenuActivateHoverDirective, TnMenuComponent, TnMenuTriggerDirective, TnMonthViewComponent, TnMultiYearViewComponent, TnNestedTreeNodeComponent, TnParticleProgressBarComponent, TnProgressBarComponent, TnRadioComponent, TnSelectComponent, TnSelectHarness, TnSelectionListComponent, TnSidePanelActionDirective, TnSidePanelComponent, TnSidePanelHarness, TnSidePanelHeaderActionDirective, TnSlideToggleComponent, TnSliderComponent, TnSliderThumbDirective, TnSliderWithLabelDirective, TnSpinnerComponent, TnSpriteLoaderService, TnStepComponent, TnStepperComponent, TnTabComponent, TnTabHarness, TnTabPanelComponent, TnTabPanelHarness, TnTableColumnDirective, TnTableComponent, TnTabsComponent, TnTabsHarness, TnTheme, TnThemeService, TnTimeInputComponent, TnToastComponent, TnToastMock, TnToastPosition, TnToastRef, TnToastService, TnToastTesting, TnToastType, TnTooltipComponent, TnTooltipDirective, TnTreeComponent, TnTreeFlatDataSource, TnTreeFlattener, TnTreeNodeComponent, TnTreeNodeOutletDirective, TruncatePathPipe, WindowsModifierKeys, WindowsShortcuts, createLucideLibrary, createShortcut, defaultSpriteBasePath, defaultSpriteConfigPath, libIconMarker, registerLucideIcons, setupLucideIntegration, tnIconMarker };
+export { CommonShortcuts, DEFAULT_THEME, DiskIconComponent, DiskType, FileSizePipe, InputType, LIGHT_THEME, LinuxModifierKeys, LinuxShortcuts, ModifierKeys, QuickShortcuts, ShortcutBuilder, StripMntPrefixPipe, THEME_MAP, THEME_STORAGE_KEY, TN_THEME_DEFINITIONS, TnAutocompleteComponent, TnAutocompleteHarness, TnBannerActionDirective, TnBannerComponent, TnBannerHarness, TnBrandedSpinnerComponent, TnButtonComponent, TnButtonHarness, TnButtonToggleComponent, TnButtonToggleGroupComponent, TnCalendarComponent, TnCalendarHeaderComponent, TnCardComponent, TnCellDefDirective, TnCheckboxComponent, TnCheckboxHarness, TnCheckboxLabelDirective, TnChipComponent, TnConfirmDialogComponent, TnDateInputComponent, TnDateRangeInputComponent, TnDialog, TnDialogHarness, TnDialogShellComponent, TnDialogTesting, TnDividerComponent, TnDividerDirective, TnDrawerComponent, TnDrawerContainerComponent, TnDrawerContainerHarness, TnDrawerContentComponent, TnDrawerHarness, TnEmptyComponent, TnEmptyHarness, TnExpansionPanelComponent, TnFilePickerComponent, TnFilePickerPopupComponent, TnFormFieldComponent, TnFormFieldHarness, TnHeaderCellDefDirective, TnIconButtonComponent, TnIconButtonHarness, TnIconComponent, TnIconHarness, TnIconRegistryService, TnIconTesting, TnInputComponent, TnInputDirective, TnInputHarness, TnKeyboardShortcutComponent, TnKeyboardShortcutService, TnListAvatarDirective, TnListComponent, TnListIconDirective, TnListItemComponent, TnListItemLineDirective, TnListItemPrimaryDirective, TnListItemSecondaryDirective, TnListItemTitleDirective, TnListItemTrailingDirective, TnListOptionComponent, TnListSubheaderComponent, TnMenuActivateHoverDirective, TnMenuComponent, TnMenuHarness, TnMenuTesting, TnMenuTriggerDirective, TnMonthViewComponent, TnMultiYearViewComponent, TnNestedTreeNodeComponent, TnParticleProgressBarComponent, TnProgressBarComponent, TnRadioComponent, TnSelectComponent, TnSelectHarness, TnSelectionListComponent, TnSidePanelActionDirective, TnSidePanelComponent, TnSidePanelHarness, TnSidePanelHeaderActionDirective, TnSlideToggleComponent, TnSliderComponent, TnSliderThumbDirective, TnSliderWithLabelDirective, TnSpinnerComponent, TnSpriteLoaderService, TnStepComponent, TnStepperComponent, TnTabComponent, TnTabHarness, TnTabPanelComponent, TnTabPanelHarness, TnTableColumnDirective, TnTableComponent, TnTabsComponent, TnTabsHarness, TnTheme, TnThemeService, TnTimeInputComponent, TnToastComponent, TnToastMock, TnToastPosition, TnToastRef, TnToastService, TnToastTesting, TnToastType, TnTooltipComponent, TnTooltipDirective, TnTreeComponent, TnTreeFlatDataSource, TnTreeFlattener, TnTreeNodeComponent, TnTreeNodeOutletDirective, TruncatePathPipe, WindowsModifierKeys, WindowsShortcuts, createLucideLibrary, createShortcut, defaultSpriteBasePath, defaultSpriteConfigPath, libIconMarker, registerLucideIcons, setupLucideIntegration, tnIconMarker };
 //# sourceMappingURL=truenas-ui-components.mjs.map