Andreas Reinhold / reiniandClaude Fable 5.1
9fb3126038
Plan steps 15-17's testing. `tests/Feature/BreakpointsTest.php` reads every file under resources/views, resources/css and resources/js — showcase example heredocs included — and fails on any Tailwind breakpoint prefix and on any media query or `matchMedia` string at 40, 48, 64 or 80rem (or 640/768/1024/ 1280px, or the 39.99rem that stood for "below 640"). Both scans were checked against a deliberately reintroduced `sm:w-auto` and an 80rem query. Every render test that asserted a `sm:`/`lg:`/`xl:` class now asserts the M3 class, the drawer's pane query is 52.5rem, and the theme script keeps `data-rail-auto` through `wire:navigate`. NavigationTest drives the shell at 599/600/839/840/1199/1200/1600 with the expectation each class carries: the bar on a compact window, the 96px rail from the medium class's first pixel, a standard rail collapsed through expanded whose menu button widens it in place with no scrim, and the rail expanded to begin with from large and at extra-large. (Not run here — the Browser suite is out of scope for this stream.) Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Qwx5USif3wFFmxtHg5U1g9
69 lines
3.2 KiB
PHP
69 lines
3.2 KiB
PHP
<?php
|
||
|
||
use Illuminate\Pagination\LengthAwarePaginator;
|
||
use Illuminate\Pagination\Paginator;
|
||
use Livewire\Component;
|
||
use Livewire\Livewire;
|
||
use Livewire\WithPagination;
|
||
|
||
it('marks a table for its styles and takes a size', function () {
|
||
expect((string) $this->blade('<x-table class="min-w-160"><tbody><tr><td>a</td></tr></tbody></x-table>'))
|
||
->toContain('<table data-table data-size="sm" class="min-w-160">')
|
||
->and((string) $this->blade('<x-table size="xs" />'))->toContain('data-size="xs"')
|
||
->and((string) $this->blade('<x-table size="huge" />'))->toContain('data-size="sm"');
|
||
});
|
||
|
||
it('sorts by its column, ascending first and then flipping', function () {
|
||
expect((string) $this->blade('<x-sort-header column="size" :sort-by="[\'column\' => \'name\', \'direction\' => \'asc\']">Size</x-sort-header>'))
|
||
->not->toContain('aria-sort')
|
||
->toContain('wire:click="$set(\'sortBy\', {"column":"size","direction":"asc"})"')
|
||
->and((string) $this->blade('<x-sort-header column="size" model="order" :sort-by="[\'column\' => \'size\', \'direction\' => \'asc\']" class="text-end">Size</x-sort-header>'))
|
||
->toContain('aria-sort="ascending"')
|
||
->toContain('class="text-end"')
|
||
->toContain('$set(\'order\', {"column":"size","direction":"desc"})')
|
||
->and((string) $this->blade('<x-sort-header column="size" :sort-by="[\'column\' => \'size\', \'direction\' => \'desc\']">Size</x-sort-header>'))
|
||
->toContain('aria-sort="descending"')
|
||
->toContain('"direction":"asc"');
|
||
});
|
||
|
||
it('draws Laravel\'s paginators in M3', function () {
|
||
$pages = new LengthAwarePaginator(range(1, 10), 95, 10, 3, ['path' => '/shares']);
|
||
|
||
expect((string) $pages->links())
|
||
->toContain('data-pagination')
|
||
->toContain('Page 3 of 10')
|
||
->toContain('21–30 of 95')
|
||
->toContain('<span aria-current="page" class="grid size-10 place-items-center rounded-corner-full type-label-lg tabular-nums bg-secondary-container text-on-secondary-container max-medium:hidden">3</span>')
|
||
->toContain('href="/shares?page=2" rel="prev"')
|
||
->toContain('aria-label="Go to page 4"')
|
||
->not->toContain('text-gray');
|
||
|
||
expect((string) (new Paginator(range(1, 11), 10, 2, ['path' => '/shares']))->links())
|
||
->toContain('data-pagination')
|
||
->toContain('href="/shares?page=1"')
|
||
->toContain('href="/shares?page=3"')
|
||
->toContain('Previous');
|
||
});
|
||
|
||
it('draws Livewire\'s paginators in M3, wired to its page actions', function () {
|
||
Livewire::component('paging-probe', new class extends Component
|
||
{
|
||
use WithPagination;
|
||
|
||
public function render(): string
|
||
{
|
||
return <<<'BLADE'
|
||
<div>
|
||
{{ (new \Illuminate\Pagination\LengthAwarePaginator(range(1, 10), 95, 10, $this->getPage(), ['path' => '/'])) ->links() }}
|
||
</div>
|
||
BLADE;
|
||
}
|
||
});
|
||
|
||
expect(Livewire::test('paging-probe')->html())
|
||
->toContain('data-pagination')
|
||
->toContain('wire:click="gotoPage(2, \'page\')"')
|
||
->toContain('wire:click="nextPage(\'page\')"')
|
||
->not->toContain('text-gray');
|
||
});
|