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:
co-authored by
Claude Sonnet 5
parent
067626c52e
commit
d15312023b
@@ -26,7 +26,7 @@ class DateProbe extends Component
|
||||
public function render(): string
|
||||
{
|
||||
return <<<'BLADE'
|
||||
<div class="grid max-w-md gap-6 p-4">
|
||||
<div style="display: grid; max-width: 448px; gap: var(--md-sys-measurement-space300); padding: var(--md-sys-measurement-space200);">
|
||||
<p>expires: <span id="expires">{{ $expires }}</span></p>
|
||||
<p>birthday: <span id="birthday">{{ $birthday }}</span></p>
|
||||
<p>delivery: <span id="delivery">{{ $delivery }}</span></p>
|
||||
@@ -57,7 +57,7 @@ function dateProbe(string $locale = 'en')
|
||||
@vite(config('livewire-material.showcase.vite'))
|
||||
@livewireStyles
|
||||
</head>
|
||||
<body class="bg-surface">
|
||||
<body style="background-color: var(--md-sys-color-surface);">
|
||||
<livewire:date-probe />
|
||||
@livewireScripts
|
||||
</body>
|
||||
@@ -83,7 +83,7 @@ class DateFormatProbe extends Component
|
||||
public function render(): string
|
||||
{
|
||||
return <<<'BLADE'
|
||||
<div class="grid max-w-md gap-6 p-4">
|
||||
<div style="display: grid; max-width: 448px; gap: var(--md-sys-measurement-space300); padding: var(--md-sys-measurement-space200);">
|
||||
<p>sunday: <span id="sunday">{{ $sunday }}</span></p>
|
||||
<p>iso: <span id="iso">{{ $iso }}</span></p>
|
||||
<p>dotted: <span id="dotted">{{ $dotted }}</span></p>
|
||||
@@ -113,7 +113,7 @@ function dateFormatProbe(string $locale = 'en')
|
||||
@vite(config('livewire-material.showcase.vite'))
|
||||
@livewireStyles
|
||||
</head>
|
||||
<body class="bg-surface">
|
||||
<body style="background-color: var(--md-sys-color-surface);">
|
||||
<livewire:date-format-probe />
|
||||
@livewireScripts
|
||||
</body>
|
||||
@@ -134,7 +134,7 @@ class ScopedDateProbe extends Component
|
||||
public function render(): string
|
||||
{
|
||||
return <<<'BLADE'
|
||||
<div class="grid max-w-md gap-6 p-4" x-data="{ step: 1 }">
|
||||
<div style="display: grid; max-width: 448px; gap: var(--md-sys-measurement-space300); padding: var(--md-sys-measurement-space200);" x-data="{ step: 1 }">
|
||||
<x-datepicker id="early-field" label="Early" wire:model.live="early" min="2026-09-10" week-start="0" />
|
||||
<x-datepicker id="late-field" label="Late" wire:model.live="late" week-start="1" />
|
||||
</div>
|
||||
@@ -154,7 +154,7 @@ function scopedDateProbe()
|
||||
@vite(config('livewire-material.showcase.vite'))
|
||||
@livewireStyles
|
||||
</head>
|
||||
<body class="bg-surface">
|
||||
<body style="background-color: var(--md-sys-color-surface);">
|
||||
<livewire:scoped-date-probe />
|
||||
@livewireScripts
|
||||
</body>
|
||||
|
||||
Reference in New Issue
Block a user