Andreas Reinhold / reiniandClaude Opus 5
fef20a9178
tests / lint (push) Failing after 2m6s
tests / feature (8.4) (push) Successful in 1m3s
tests / feature (8.5) (push) Successful in 1m7s
tests / browser (safari, webkit) (push) Successful in 3m14s
tests / browser (chrome, chromium) (push) Successful in 2m9s
tests / browser (firefox, firefox) (push) Successful in 2m29s
<x-card> (filled, elevated, outlined), <x-list> and <x-list-item> (plain or M3 Expressive's segmented list), <x-divider>, <x-collapse> on <details>, <x-modal> on the native <dialog>, <x-drawer> as a side sheet or list-detail pane, and <x-bottom-sheet> with drag to dismiss. Dialogs and sheets bind to a Livewire flag or id and write back false or null on close, or use the surrounding Alpine scope. Rows open from anywhere on them through data-list-row and data-list-open. DesignGuard now also reports Blade directives written inside a component tag, where they do not compile. Browser test helpers wait for a complete document with Alpine and Livewire running: in Firefox, networkidle alone could return before a repeated visit had loaded. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01V9NnLxnPp8vaaurb3Z1MFy
41 lines
1.7 KiB
PHP
41 lines
1.7 KiB
PHP
<?php
|
|
|
|
it('draws M3\'s three cards', function (string $variant, string $classes) {
|
|
expect((string) $this->blade("<x-card variant=\"{$variant}\">Body</x-card>"))->toContain($classes)->toContain('rounded-corner-md')->toContain('data-card');
|
|
})->with([
|
|
'filled' => ['filled', 'bg-surface-container-highest'],
|
|
'elevated' => ['elevated', 'bg-surface-container-low shadow-elevation-1'],
|
|
'outlined' => ['outlined', 'border border-outline-variant bg-surface'],
|
|
]);
|
|
|
|
it('is filled unless it knows the variant', function () {
|
|
expect((string) $this->blade('<x-card variant="glass">Body</x-card>'))->toContain('bg-surface-container-highest');
|
|
});
|
|
|
|
it('lays out a header, menu, media, body and actions', function () {
|
|
$html = (string) $this->blade(<<<'BLADE'
|
|
<x-card title="holiday-photos.zip" subtitle="248 MB" separator>
|
|
<x-slot:figure><img src="/x.png" alt=""></x-slot:figure>
|
|
<x-slot:menu><button>⋮</button></x-slot:menu>
|
|
Expires in 3 days.
|
|
<x-slot:actions><button>Copy link</button></x-slot:actions>
|
|
</x-card>
|
|
BLADE);
|
|
|
|
expect($html)
|
|
->toContain('<img src="/x.png" alt="">')
|
|
->toContain('<h3 class="type-title-md">holiday-photos.zip</h3>')
|
|
->toContain('248 MB')
|
|
->toContain('<button>⋮</button>')
|
|
->toContain('role="separator"')
|
|
->toContain('Expires in 3 days.')
|
|
->toContain('<button>Copy link</button>')
|
|
->and(strpos($html, 'Expires'))->toBeLessThan(strpos($html, 'Copy link'));
|
|
});
|
|
|
|
it('passes row attributes through', function () {
|
|
expect((string) $this->blade('<x-card data-list-row><a href="/s/1" data-list-open>Open</a></x-card>'))
|
|
->toContain('data-list-row')
|
|
->toContain('data-list-open');
|
|
});
|