noNameWEB/livewire-material
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Check icon.css, shape.css and selection.css like every other stylesheet

Browse Source 
Review leftover (plan step 36): none of the three foundation/shared
stylesheets was in a group dataset, so their shape, token and
breakpoint rules went unchecked. icon and shape have views of their
own and sit in components.css's first block, so they join
ActionStylesheetsTest's dataset outright, with that file's block check
narrowed to look for them there instead of the actions block.
selection.css has no view (checkbox, radio and toggle each import it)
and components.css never imports it directly, so it follows
navigation-item.css's pattern in InputStylesheetsTest: a second,
stylesheet-only dataset alongside the view-based one.

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 01:54:55 +02:00
co-authored by Claude Sonnet 5
parent 66847d5104
commit f53bee9ef3
2 changed files with 55 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files
tests/Feature/Components/ActionStylesheetsTest.php
+17 -3
View File
@@ -11,8 +11,16 @@ use NoNameWeb\LivewireMaterial\Tests\Support\ViewClasses;
* `material.components` that imports the stylesheets of the components its view renders, writes
* its values from the tokens and its breakpoints as px range queries, and is imported from the
* "Actions and communication" block of components.css.
*
* `icon` and `shape` are the two foundation components (`<x-icon>`, `<x-shape>`) — no group's view
* renders them exclusively, so they were in no group's dataset at all. They follow the same shape,
* token and view-class rules as every other component, so they run with this group's checks too;
* only "is imported from the actions and communication block" needs to read the two of them from
* components.css's first block ("Foundation components") instead, since that is where they sit.
*/
dataset('action components', [
'icon',
'shape',
'loading',
'tooltip',
'badge',
@@ -87,10 +95,16 @@ it('takes its values from the tokens and its breakpoints in px', function (strin
}
})->with('action components');
it('is imported from the actions and communication block of components.css', function (string $name) {
it('is imported from the actions and communication block of components.css, or icon and shape from the foundation block before it', function (string $name) {
$components = File::get(__DIR__.'/../../../resources/css/components.css');
$block = substr($components, (int) strpos($components, '/* Actions and communication */'));
$block = substr($block, 0, (int) strpos($block, '/* Inputs, selection and data */'));
if (in_array($name, ['icon', 'shape'], true)) {
$block = substr($components, (int) strpos($components, '/* Foundation components */'));
$block = substr($block, 0, (int) strpos($block, '/* Actions and communication */'));
} else {
$block = substr($components, (int) strpos($components, '/* Actions and communication */'));
$block = substr($block, 0, (int) strpos($block, '/* Inputs, selection and data */'));
}
expect($block)->toContain("@import './components/{$name}.css';");
})->with('action components');
tests/Feature/Components/InputStylesheetsTest.php
+38 -23
View File
@@ -17,27 +17,42 @@ use NoNameWeb\LivewireMaterial\Tests\Support\ViewClasses;
* {name}.blade.php` file do not apply to it. It gets the three checks that do not depend on that
* path below, and its own small versions of the other two.
*/
dataset('input components', [
'form',
'field',
'input',
'password',
'textarea',
'select',
'file',
'checkbox',
'radio',
'toggle',
'chip',
'chip-set',
'choices',
'slider',
'search',
'table',
'sort-header',
'datepicker',
'timepicker',
]);
function inputComponents(): array
{
return [
'form',
'field',
'input',
'password',
'textarea',
'select',
'file',
'checkbox',
'radio',
'toggle',
'chip',
'chip-set',
'choices',
'slider',
'search',
'table',
'sort-header',
'datepicker',
'timepicker',
];
}
dataset('input components', inputComponents());
/**
* The checks that read a stylesheet alone also run on the one no view renders by itself:
* selection.css, what the checkbox, radio and switch share (its own file header names them), which
* each of their stylesheets imports. Nothing renders it directly and components.css never imports
* it either — only checkbox.css, radio.css and toggle.css do — so without this its shape and token
* rules would go unchecked, the way navigation-item.css did before NavigationStylesheetsTest.php
* picked it up.
*/
dataset('input stylesheets', [...inputComponents(), 'selection']);
/**
* Fails unless every media query in the stylesheet writes its lengths in px, at one of M3's four
@@ -116,7 +131,7 @@ it('draws the component from a stylesheet shaped like every package stylesheet',
foreach ($css->imports() as $import) {
expect(is_file(dirname(ComponentStylesheet::path($name)).'/'.$import))->toBeTrue("{$name}.css imports {$import}, which does not exist");
}
})->with('input components');
})->with('input stylesheets');
it('imports the stylesheet of every component its view renders', function (string $name) {
preg_match_all('/<x-livewire-material::([a-z-]+)/', File::get(__DIR__."/../../../resources/views/components/{$name}.blade.php"), $tags);
@@ -138,7 +153,7 @@ it('writes no class list into the view but the interaction and text classes', fu
it('takes its values from the tokens and its breakpoints in px', function (string $name) {
assertTokensAndPxBreakpoints(ComponentStylesheet::read($name), "{$name}.css");
})->with('input components');
})->with('input stylesheets');
it('is imported from the inputs, selection and data block of components.css', function (string $name) {
$components = File::get(__DIR__.'/../../../resources/css/components.css');