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
30 lines
1.3 KiB
PHP
30 lines
1.3 KiB
PHP
<?php
|
|
|
|
it('wraps a trigger and anchors the bubble to it', function () {
|
|
$html = (string) $this->blade('<x-tooltip text="Copy link"><button>Copy</button></x-tooltip>');
|
|
|
|
preg_match('/anchor-name: (--material-tooltip-[a-z0-9]+)/', $html, $anchor);
|
|
|
|
expect($anchor)->not->toBeEmpty()
|
|
->and($html)
|
|
->toContain('<button>Copy</button>')
|
|
->toContain('popover="manual"')
|
|
->toContain('x-data="materialTooltip"')
|
|
->toContain("position-anchor: {$anchor[1]}")
|
|
->toContain('bg-inverse-surface')
|
|
->toContain('[position-area:top]');
|
|
});
|
|
|
|
it('places the bubble on the side asked for, flipping when there is no room', function (string $side, string $classes) {
|
|
expect((string) $this->blade("<x-tooltip text=\"Hi\" side=\"{$side}\"><span>x</span></x-tooltip>"))->toContain($classes);
|
|
})->with([
|
|
'bottom' => ['bottom', '[position-area:bottom] [position-try-fallbacks:flip-block]'],
|
|
'left' => ['left', '[position-area:left] [position-try-fallbacks:flip-inline]'],
|
|
'right' => ['right', '[position-area:right] [position-try-fallbacks:flip-inline]'],
|
|
]);
|
|
|
|
it('escapes its text', function () {
|
|
$this->blade('<x-tooltip text="<b>bold</b>"><span>x</span></x-tooltip>')
|
|
->assertSee('<b>bold</b>', false);
|
|
});
|