blade('')) ->toContain('size-14 rounded-corner-lg') ->toContain('bg-primary-container text-on-primary-container') ->toContain('shadow-elevation-3') ->toContain('aria-label="New share"') ->toContain('popover="manual"'); }); it('sizes a FAB at 56, 80 and 96px', function (string $size, string $classes, string $icon) { expect((string) $this->blade(""))->toContain($classes)->toContain($icon); })->with([ 'sm' => ['sm', 'size-14 rounded-corner-lg', 'size-6'], 'md' => ['md', 'size-20 rounded-corner-lg-increased', 'size-7'], 'lg' => ['lg', 'size-24 rounded-corner-xl', 'size-8'], ]); it('fills the FAB\'s glyph, as M3 asks twice over', function () { $svg = trim((string) file_get_contents(__DIR__.'/../../../resources/svg/symbols/filled/add.svg')); $filled = substr($svg, (int) strpos($svg, '><') + 1); expect((string) $this->blade(''))->toContain($filled) ->and((string) $this->blade(''))->toContain($filled); }); it('extends with a label', function () { expect((string) $this->blade('')) ->toContain('h-20 min-w-20 gap-3 px-[26px] rounded-corner-lg-increased type-title-lg') ->toContain('bg-tertiary text-on-tertiary') ->toContain('Upload') ->not->toContain('aria-label'); }); it('opens a FAB menu of end-aligned actions above it', function () { $html = (string) $this->blade(<<<'BLADE' BLADE); expect($html) ->toContain('x-data="materialMenu"') ->toContain('aria-label="New"') ->toContain('bg-secondary-container text-on-secondary-container aria-expanded:bg-secondary aria-expanded:text-on-secondary') ->toContain('aria-expanded:rounded-corner-full') ->toContain('role="menu"') ->toContain('[position-area:top_span-left]') ->toContain('role="menuitem"') ->toContain('wire:click="upload"') ->toContain('h-14') ->toContain('Upload files'); });