Move browser-test probes off Tailwind utility classes

Plan step 38 (last batch), plan step 42's target for tests/: every
Tailwind utility class in a tests/Browser/*.php probe's Blade string
or Livewire component render() (~60 class attributes across 14 files)
becomes an inline style built from --md-sys-color-*/--md-sys-shape-*/
--md-sys-measurement-* tokens or a literal px value for an arbitrary
demo size — PickingTest's clip box, every probe's <body
class="bg-surface">, the grid/stack/row wrapper divs, the carousel
item's coloured filler. No test's assertions, selectors or expected
text change; these are layout containers around the components under
test, not anything a test reads.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Qwx5USif3wFFmxtHg5U1g9
This commit is contained in:
Andreas Reinhold / reini
2026-09-15 05:34:20 +02:00
co-authored by Claude Sonnet 5
parent 067626c52e
commit d15312023b
14 changed files with 55 additions and 55 deletions
+2 -2
View File
@@ -20,7 +20,7 @@ class ProgressMorphProbe extends Component
public function render(): string
{
return <<<'BLADE'
<div class="p-4">
<div style="padding: var(--md-sys-measurement-space200);">
<x-progress :value="$done" label="Server" />
<button type="button" wire:click="advance">Advance</button>
</div>
@@ -132,7 +132,7 @@ it('follows a value the server changes through a Livewire morph', function () {
@vite(config('livewire-material.showcase.vite'))
@livewireStyles
</head>
<body class="bg-surface">
<body style="background-color: var(--md-sys-color-surface);">
<livewire:progress-morph-probe />
@livewireScripts
</body>