/**
* Tests for the FilamentHoverCard component.
* Focuses on fill level display and Spoolman source indicator.
*/
import { describe, it, expect, vi, beforeEach } from 'vitest';
import { render, screen, fireEvent, waitFor } from '../utils';
import { FilamentHoverCard, EmptySlotHoverCard } from '../../components/FilamentHoverCard';
const baseFilamentData = {
vendor: 'Bambu Lab' as const,
profile: 'PLA Basic',
colorName: 'Red',
colorHex: 'FF0000',
kFactor: '0.030',
fillLevel: 75,
trayUuid: 'A1B2C3D4E5F6A1B2C3D4E5F6A1B2C3D4',
};
function renderWithHover(ui: React.ReactElement) {
const result = render(ui);
// Trigger hover to show the card
const trigger = result.container.firstElementChild as HTMLElement;
fireEvent.mouseEnter(trigger);
return result;
}
describe('FilamentHoverCard', () => {
beforeEach(() => {
vi.useFakeTimers({ shouldAdvanceTime: true });
});
describe('fill level display', () => {
it('shows fill percentage when fillLevel is set', async () => {
renderWithHover(
trigger
);
vi.advanceTimersByTime(100);
await waitFor(() => {
expect(screen.getByText('75%')).toBeInTheDocument();
});
});
it('shows dash when fillLevel is null', async () => {
renderWithHover(
trigger
);
vi.advanceTimersByTime(100);
await waitFor(() => {
expect(screen.getByText('—')).toBeInTheDocument();
});
});
it('shows 0% when fillLevel is zero', async () => {
renderWithHover(
trigger
);
vi.advanceTimersByTime(100);
await waitFor(() => {
expect(screen.getByText('0%')).toBeInTheDocument();
});
});
});
describe('fill source badge transparency (#11)', () => {
it('never shows a Spoolman-source badge — UI stays mode-agnostic', async () => {
renderWithHover(
trigger
);
vi.advanceTimersByTime(100);
await waitFor(() => {
expect(screen.getByText('80%')).toBeInTheDocument();
expect(screen.queryByText('(Spoolman)')).not.toBeInTheDocument();
});
});
it('never shows an inventory-source badge — UI stays mode-agnostic', async () => {
renderWithHover(
trigger
);
vi.advanceTimersByTime(100);
await waitFor(() => {
expect(screen.getByText('80%')).toBeInTheDocument();
expect(screen.queryByText('(Inv)')).not.toBeInTheDocument();
});
});
it('does not render an empty source-label span when fillLevel is null', async () => {
renderWithHover(
trigger
);
vi.advanceTimersByTime(100);
await waitFor(() => {
expect(screen.getByText('—')).toBeInTheDocument();
expect(screen.queryByText('(Spoolman)')).not.toBeInTheDocument();
expect(screen.queryByText('(Inv)')).not.toBeInTheDocument();
});
});
});
describe('hover behavior', () => {
it('does not show card when disabled', () => {
renderWithHover(
trigger
);
vi.advanceTimersByTime(100);
// Card should not be visible
expect(screen.queryByText('PLA Basic')).not.toBeInTheDocument();
});
it('shows filament details on hover', async () => {
renderWithHover(
trigger
);
vi.advanceTimersByTime(100);
await waitFor(() => {
expect(screen.getByText('Red')).toBeInTheDocument();
expect(screen.getByText('PLA Basic')).toBeInTheDocument();
expect(screen.getByText('0.030')).toBeInTheDocument();
});
});
});
// The inventory section was previously hidden for `vendor === 'Bambu Lab'`
// because BL spools were assumed to be managed entirely via RFID. #1133
// removed that gate so users who don't want to scan via SpoolBuddy NFC
// can still pick a BL spool from inventory the same way they pick a
// third-party one.
describe('inventory section vendor visibility (#1133)', () => {
it('shows the assign-spool button on a Bambu Lab slot when the spool is unassigned', async () => {
const onAssign = vi.fn();
renderWithHover(
trigger
);
vi.advanceTimersByTime(100);
await waitFor(() => {
expect(screen.getByText(/assign/i)).toBeInTheDocument();
});
});
it('shows the unassign button on a Bambu Lab slot when an inventory spool is already assigned', async () => {
// Regression guard: the original gate hid BOTH the assign and unassign
// buttons for BL slots. A user who'd already assigned an inventory
// spool to a BL slot couldn't undo it without dropping into the
// inventory page directly.
const onUnassign = vi.fn();
renderWithHover(
trigger
);
vi.advanceTimersByTime(100);
await waitFor(() => {
expect(screen.getByText(/unassign/i)).toBeInTheDocument();
});
});
it('still shows the assign-spool button for a non-Bambu vendor (no behaviour change)', async () => {
const onAssign = vi.fn();
renderWithHover(
trigger
);
vi.advanceTimersByTime(100);
await waitFor(() => {
expect(screen.getByText(/assign/i)).toBeInTheDocument();
});
});
it('shows the assign-spool button as disabled when isAssigned=true', async () => {
const onAssign = vi.fn();
renderWithHover(
trigger
);
vi.advanceTimersByTime(100);
await waitFor(() => {
expect(screen.getByText(/assign/i)).toBeInTheDocument();
expect(screen.getByText(/assign/i).closest('button')).toBeDisabled();
});
});
it('does not call onAssignSpool when the button is disabled via isAssigned', async () => {
const onAssign = vi.fn();
renderWithHover(
trigger
);
vi.advanceTimersByTime(100);
await waitFor(() => expect(screen.getByText(/assign/i)).toBeInTheDocument());
const btn = screen.getByText(/assign/i).closest('button')!;
btn.click();
expect(onAssign).not.toHaveBeenCalled();
});
});
// For RFID-synced BL spools, both spoolman.linkedSpoolId and
// inventory.assignedSpool.id point to the same Spoolman spool. Rendering
// both branches gave two identical "Open in Inventory" buttons. The
// inventory-side button is suppressed when it would duplicate the
// spoolman-side link.
describe('"Open in Inventory" deduplication', () => {
const inventorySpool = {
id: 42,
material: 'PLA',
brand: 'eSun',
color_name: 'Black',
};
it('shows only one Open in Inventory button when spoolman linkedSpoolId matches assignedSpool id', async () => {
renderWithHover(
trigger
);
vi.advanceTimersByTime(100);
await waitFor(() => {
expect(screen.getByText(/assigned/i)).toBeInTheDocument();
});
expect(screen.queryAllByTitle('Open in Inventory')).toHaveLength(1);
});
it('shows two Open in Inventory buttons when spoolman and inventory point to different spools', async () => {
renderWithHover(
trigger
);
vi.advanceTimersByTime(100);
await waitFor(() => {
expect(screen.getByText(/assigned/i)).toBeInTheDocument();
});
expect(screen.queryAllByTitle('Open in Inventory')).toHaveLength(2);
});
it('shows one Open in Inventory button when spoolman is absent but inventory spool is assigned', async () => {
renderWithHover(
trigger
);
vi.advanceTimersByTime(100);
await waitFor(() => {
expect(screen.getByText(/assigned/i)).toBeInTheDocument();
});
expect(screen.queryAllByTitle('Open in Inventory')).toHaveLength(1);
});
it('shows the spool ID in the assigned-spool block', async () => {
renderWithHover(
trigger
);
vi.advanceTimersByTime(100);
await waitFor(() => {
expect(screen.getByText('#42')).toBeInTheDocument();
});
});
});
// The card is portaled at z-[60] — above ConfigureAmsSlotModal and
// LinkSpoolModal at z-50 — so a card left standing draws OVER the dialog its
// own button just opened. Mouseleave is the only thing that used to hide it,
// and a touch device never sends one after the tap that opened the card, so on
// a tablet it hung there indefinitely: two overlapping layers, competing focus.
describe('dismissal when an action opens a dialog (#2631)', () => {
it('closes the card when Configure is pressed, and still configures', async () => {
const onConfigure = vi.fn();
renderWithHover(
trigger
);
vi.advanceTimersByTime(100);
await waitFor(() => expect(screen.getByText(/configure/i)).toBeInTheDocument());
fireEvent.click(screen.getByText(/configure/i));
expect(onConfigure).toHaveBeenCalledTimes(1);
await waitFor(() => expect(screen.queryByText('PLA Basic')).not.toBeInTheDocument());
});
it('stays closed with no mouseleave, which is all a tablet ever gives us', async () => {
renderWithHover(
trigger
);
vi.advanceTimersByTime(100);
await waitFor(() => expect(screen.getByText(/configure/i)).toBeInTheDocument());
fireEvent.click(screen.getByText(/configure/i));
await waitFor(() => expect(screen.queryByText('PLA Basic')).not.toBeInTheDocument());
// A pending show timer would resurrect the card on top of the dialog.
vi.advanceTimersByTime(1000);
expect(screen.queryByText('PLA Basic')).not.toBeInTheDocument();
});
it('closes the card when Assign Spool is pressed', async () => {
const onAssignSpool = vi.fn();
renderWithHover(
trigger
);
vi.advanceTimersByTime(100);
await waitFor(() => expect(screen.getByText(/assign/i)).toBeInTheDocument());
fireEvent.click(screen.getByText(/assign/i));
expect(onAssignSpool).toHaveBeenCalledTimes(1);
await waitFor(() => expect(screen.queryByText('PLA Basic')).not.toBeInTheDocument());
});
it('closes the card when Unassign Spool is pressed', async () => {
const onUnassignSpool = vi.fn();
renderWithHover(
trigger
);
vi.advanceTimersByTime(100);
await waitFor(() => expect(screen.getByText(/unassign/i)).toBeInTheDocument());
fireEvent.click(screen.getByText(/unassign/i));
expect(onUnassignSpool).toHaveBeenCalledTimes(1);
await waitFor(() => expect(screen.queryByText('PLA Basic')).not.toBeInTheDocument());
});
});
});
// EmptySlotHoverCard is the hover wrapper rendered for a physically empty
// AMS slot. #1133 removed its inventory affordance: a slot with nothing
// loaded has no spool to attach an inventory record to, and offering the
// action there only led to users assigning the wrong spool to a slot the
// printer hadn't actually loaded yet. The configure-slot affordance is
// kept, since "preset for the next spool to land here" is still a sensible
// thing to do on an empty slot.
describe('EmptySlotHoverCard (#1133)', () => {
beforeEach(() => {
vi.useFakeTimers({ shouldAdvanceTime: true });
});
it('does not render an assign-spool button when onAssignSpool is not provided', async () => {
const result = render(
trigger
);
fireEvent.mouseEnter(result.container.firstElementChild as HTMLElement);
vi.advanceTimersByTime(100);
await waitFor(() => {
// The card itself is showing — guard the negative assertion against
// a card that simply never opened.
expect(screen.getByText(/empty/i)).toBeInTheDocument();
});
expect(screen.queryByText(/assign spool/i)).not.toBeInTheDocument();
});
it('still shows the configure button on an empty slot', async () => {
const onConfigure = vi.fn();
const result = render(
trigger
);
fireEvent.mouseEnter(result.container.firstElementChild as HTMLElement);
vi.advanceTimersByTime(100);
await waitFor(() => {
expect(screen.getByText(/configure/i)).toBeInTheDocument();
});
});
it('shows Assign Spool button when onAssignSpool is provided', async () => {
const onAssign = vi.fn();
const result = render(
trigger
);
fireEvent.mouseEnter(result.container.firstElementChild as HTMLElement);
vi.advanceTimersByTime(100);
await waitFor(() => {
expect(screen.getByText(/assign spool/i)).toBeInTheDocument();
});
});
it('calls onAssignSpool when Assign Spool button is clicked', async () => {
const onAssign = vi.fn();
const result = render(
trigger
);
fireEvent.mouseEnter(result.container.firstElementChild as HTMLElement);
vi.advanceTimersByTime(100);
await waitFor(() => expect(screen.getByText(/assign spool/i)).toBeInTheDocument());
fireEvent.click(screen.getByText(/assign spool/i));
expect(onAssign).toHaveBeenCalledTimes(1);
});
// Same z-[60]-over-a-z-50-dialog problem as FilamentHoverCard (#2631).
describe('dismissal when an action opens a dialog (#2631)', () => {
it('closes the card when Configure is pressed, and still configures', async () => {
const onConfigure = vi.fn();
const result = render(
trigger
);
fireEvent.mouseEnter(result.container.firstElementChild as HTMLElement);
vi.advanceTimersByTime(100);
await waitFor(() => expect(screen.getByText(/configure/i)).toBeInTheDocument());
fireEvent.click(screen.getByText(/configure/i));
expect(onConfigure).toHaveBeenCalledTimes(1);
await waitFor(() => expect(screen.queryByText(/empty/i)).not.toBeInTheDocument());
});
it('closes the card when Assign Spool is pressed', async () => {
const onAssign = vi.fn();
const result = render(
trigger
);
fireEvent.mouseEnter(result.container.firstElementChild as HTMLElement);
vi.advanceTimersByTime(100);
await waitFor(() => expect(screen.getByText(/assign spool/i)).toBeInTheDocument());
fireEvent.click(screen.getByText(/assign spool/i));
expect(onAssign).toHaveBeenCalledTimes(1);
await waitFor(() => expect(screen.queryByText(/empty/i)).not.toBeInTheDocument());
});
});
});