StylesheetsTest.php's new test runs DesignGuard's own family table (check (i)) over resources/views, resources/js, src, tests/Browser and tests/Feature — the guard turned on the package's own source, so the two never drift apart. tests/Feature/DesignGuardTest.php and tests/Fixtures/design-guard/ carry Tailwind on purpose and are left out. The scan found Tailwind-shaped class strings used as caller classes in 21 test files (a component test proving a caller's class lands on the root or a caller's size wins, mostly), left over from before Tailwind cleared the whole stack: replaced with neutral application-style names (`app-hero-icon`) or, where one already carries the right meaning, an `md-*` class (`md-text-end`, `md-ink-warning`). BreakpointsTest.php's own heredoc probe — which needs a genuine Tailwind-shaped breakpoint prefix to prove its detection works — now builds that one string from a placeholder at runtime, so its own source stays clean for this same scan. Plan step 42 (Phase F), Part A. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Qwx5USif3wFFmxtHg5U1g9
60 lines
2.6 KiB
PHP
60 lines
2.6 KiB
PHP
<?php
|
|
|
|
use NoNameWeb\LivewireMaterial\Tests\Support\ComponentStylesheet;
|
|
|
|
it('sets an icon on an Expressive shape above its words and action', function () {
|
|
$html = (string) $this->blade(<<<'BLADE'
|
|
<x-empty-state icon="upload_file" shape="flower" title="No shares yet" description="Files you share appear here.">
|
|
<x-slot:actions><x-button label="Upload files" /></x-slot:actions>
|
|
</x-empty-state>
|
|
BLADE);
|
|
|
|
expect($html)
|
|
->toContain('data-md-empty-state')
|
|
->toContain('data-md-empty-state-shape')
|
|
->toContain('data-md-empty-state-icon')
|
|
->toContain('<h3 data-md-empty-state-title>No shares yet</h3>')
|
|
->toContain('data-md-empty-state-description')
|
|
->toContain('Files you share appear here.')
|
|
->toContain('data-md-empty-state-actions')
|
|
->toContain('Upload files')
|
|
->and(substr_count($html, '<svg'))->toBe(2)
|
|
->and(ComponentStylesheet::read('empty-state')->declarations('[data-md-empty-state-shape]'))->toMatchArray([
|
|
'color' => 'var(--md-sys-color-secondary-container)',
|
|
])
|
|
->and(ComponentStylesheet::read('empty-state')->declarations('[data-md-empty-state-icon]'))->toMatchArray([
|
|
'color' => 'var(--md-sys-color-on-secondary-container)',
|
|
]);
|
|
});
|
|
|
|
it('draws an illustration in place of the shape and icon', function () {
|
|
$html = (string) $this->blade(<<<'BLADE'
|
|
<x-empty-state icon="upload_file" title="No routes yet">
|
|
<x-slot:illustration class="app-illustration-accent"><svg class="app-illustration-icon" viewBox="0 0 10 10" aria-hidden="true"><circle cx="5" cy="5" r="4" /></svg></x-slot:illustration>
|
|
</x-empty-state>
|
|
BLADE);
|
|
|
|
expect($html)
|
|
->toContain('<div class="app-illustration-accent"><svg class="app-illustration-icon" viewBox="0 0 10 10" aria-hidden="true"><circle cx="5" cy="5" r="4" /></svg></div>')
|
|
->not->toContain('data-md-empty-state-shape')
|
|
->not->toContain('data-md-empty-state-icon')
|
|
->toContain('No routes yet')
|
|
->and(substr_count($html, '<svg'))->toBe(1);
|
|
});
|
|
|
|
it('keeps the shape and icon while the illustration slot holds nothing but comments', function () {
|
|
$html = (string) $this->blade(<<<'BLADE'
|
|
<x-empty-state title="No shares yet">
|
|
<x-slot:illustration>
|
|
<!-- artwork to come -->
|
|
</x-slot:illustration>
|
|
</x-empty-state>
|
|
BLADE);
|
|
|
|
expect($html)
|
|
->toContain('data-md-empty-state-shape')
|
|
->toContain('data-md-empty-state-icon')
|
|
->not->toContain('artwork to come')
|
|
->and(substr_count($html, '<svg'))->toBe(2);
|
|
});
|