feat(webui): add central icon button
This commit is contained in:
40
webui/tests/icon-button.test.tsx
Normal file
40
webui/tests/icon-button.test.tsx
Normal file
@@ -0,0 +1,40 @@
|
||||
function assert(condition: unknown, message = "assertion failed"): void {
|
||||
if (!condition) throw new Error(message);
|
||||
}
|
||||
|
||||
import { renderToStaticMarkup } from "react-dom/server";
|
||||
import AdminIconButton from "../src/components/admin/AdminIconButton";
|
||||
import IconButton from "../src/components/IconButton";
|
||||
import { PlatformLanguageProvider } from "../src/i18n/LanguageContext";
|
||||
|
||||
function noop() {}
|
||||
|
||||
const iconButtonMarkup = renderToStaticMarkup(
|
||||
<PlatformLanguageProvider>
|
||||
<IconButton
|
||||
label="i18n:govoplan-core.remove.e963907d"
|
||||
icon={<svg><path /></svg>}
|
||||
variant="danger"
|
||||
className="context-action"
|
||||
onClick={noop}
|
||||
/>
|
||||
</PlatformLanguageProvider>
|
||||
);
|
||||
assert(iconButtonMarkup.includes('type="button"'), "icon buttons default to a non-submitting button");
|
||||
assert(iconButtonMarkup.includes('class="btn btn-danger icon-button context-action"'), "central variants and caller classes are preserved");
|
||||
assert(iconButtonMarkup.includes('aria-label="Remove"'), "the accessible label is translated");
|
||||
assert(iconButtonMarkup.includes('title="Remove"'), "the native title is translated");
|
||||
assert(iconButtonMarkup.includes('class="icon-button-icon" aria-hidden="true"'), "the visible icon is decorative");
|
||||
|
||||
const reasonedMarkup = renderToStaticMarkup(
|
||||
<IconButton label="Clear" icon={<span>X</span>} disabledReason="Permission denied" />
|
||||
);
|
||||
assert(reasonedMarkup.includes("disabled=\"\""), "a disabled reason disables the icon button");
|
||||
assert(reasonedMarkup.includes("disabled-action-tooltip"), "a disabled reason remains discoverable");
|
||||
assert(!reasonedMarkup.includes("disabledReason"), "central-only props are not passed to the DOM");
|
||||
|
||||
const legacyMarkup = renderToStaticMarkup(
|
||||
<AdminIconButton label="Add" icon={<span>+</span>} disabled />
|
||||
);
|
||||
assert(legacyMarkup.includes("icon-button admin-icon-button"), "the legacy wrapper delegates to the neutral component and preserves its class hook");
|
||||
assert(legacyMarkup.includes("disabled=\"\""), "the legacy disabled contract is preserved");
|
||||
Reference in New Issue
Block a user