Andreas Reinhold / reiniandClaude Opus 5
cd64f4f371
tests / browser (firefox, firefox) (push) Successful in 1m54s
tests / browser (safari, webkit) (push) Successful in 2m17s
tests / lint (push) Successful in 59s
tests / feature (8.4) (push) Successful in 1m7s
tests / feature (8.5) (push) Successful in 1m0s
tests / browser (chrome, chromium) (push) Successful in 1m49s
<x-button> (label buttons, icon buttons and toggles in five sizes, with filled, tonal, outlined, elevated and text variants in any colour role), <x-tooltip>, <x-menu> with items, groups and separators, <x-button-group>, <x-group> as a connected button group, <x-split-button>, <x-fab>, <x-fab-menu> and <x-loading>. Sizes, colours and shapes come from androidx Compose Material 3's tokens; the loading indicator ports its Morph into SVG + SMIL. Menus follow WAI-ARIA's menu button pattern on popovers placed by CSS anchor positioning. Browser tests run in Chromium, Firefox and WebKit. The showcase fetches the icon names on demand: inlined, they tripped Pest's test server into HTTP 431s under Firefox. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01V9NnLxnPp8vaaurb3Z1MFy
51 lines
2.1 KiB
PHP
51 lines
2.1 KiB
PHP
<?php
|
|
|
|
it('is a named progressbar in the primary colour, 48px by default', function () {
|
|
$html = (string) $this->blade('<x-loading />');
|
|
|
|
expect($html)
|
|
->toContain('role="progressbar"')
|
|
->toContain('aria-label="Loading"')
|
|
->toContain('size-12')
|
|
->toContain('text-primary')
|
|
->toContain('<animateTransform')
|
|
->toContain('class="size-full motion-reduce:hidden"')
|
|
->toContain('class="hidden size-full motion-reduce:block"');
|
|
});
|
|
|
|
it('sits on a primary-container circle when contained', function () {
|
|
expect((string) $this->blade('<x-loading contained class="size-8" label="Uploading" />'))
|
|
->toContain('rounded-corner-full bg-primary-container text-on-primary-container')
|
|
->toContain('size-8')
|
|
->not->toContain('size-12')
|
|
->toContain('aria-label="Uploading"');
|
|
});
|
|
|
|
it('takes the caller\'s colour', function () {
|
|
expect((string) $this->blade('<x-loading class="text-tertiary" />'))
|
|
->toContain('text-tertiary')
|
|
->not->toContain('text-primary');
|
|
});
|
|
|
|
it('says nothing where something else already does', function () {
|
|
expect((string) $this->blade('<x-loading :label="false" />'))
|
|
->toContain('aria-hidden="true"')
|
|
->not->toContain('role="progressbar"');
|
|
|
|
expect((string) $this->blade('<x-button label="Save" wire:click="save" spinner />'))
|
|
->toContain('<animateTransform')
|
|
->not->toContain('role="progressbar"');
|
|
});
|
|
|
|
it('animates without script and rests the same shape', function () {
|
|
$animated = file_get_contents(__DIR__.'/../../../resources/svg/loading-indicator/indeterminate.svg');
|
|
$static = file_get_contents(__DIR__.'/../../../resources/svg/loading-indicator/static.svg');
|
|
|
|
expect($animated)->toStartWith('<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" fill="currentColor">')
|
|
->toContain('repeatCount="indefinite"')
|
|
->not->toContain('<script')
|
|
->not->toContain('__ID__')
|
|
->and($static)->toStartWith('<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" fill="currentColor">')
|
|
->not->toContain('<animate');
|
|
});
|