@crossed/ui
Version:
A universal & performant styling library for React Native, Next.js & React
85 lines (84 loc) • 3.02 kB
JavaScript
var import_jsx_runtime = require("react/jsx-runtime");
var import_test = require("@crossed/test");
var import_Icon = require("../Icon");
var import_context = require("../context");
var import_globals = require("@jest/globals");
const X = jest.fn(() => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { "data-testid": "x" }));
describe("ButtonIcon", () => {
const renderWithContext = (children, contextValue) => {
return (0, import_test.render)(
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_context.buttonContext.Provider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Icon.ButtonIcon, { children }) })
);
};
(0, import_globals.afterEach)(() => {
X.mockReset();
});
it("renders correctly with default props", () => {
renderWithContext(null, { variant: "primary", state: {}, disabled: false });
expect(() => import_test.screen.getByTestId("x")).toThrow();
});
it("renders the child element and applies color styles", () => {
renderWithContext(/* @__PURE__ */ (0, import_jsx_runtime.jsx)(X, {}), {
variant: "primary",
state: { hover: false, active: false },
disabled: false
});
expect(X).toBeCalledWith(
{ "color": "var(--components--action-primary-default-text)" },
{}
);
});
it("applies hover styles when state.hover is true", () => {
renderWithContext(/* @__PURE__ */ (0, import_jsx_runtime.jsx)(X, {}), {
variant: "primary",
state: { hover: true, active: false },
disabled: false
});
expect(X).toBeCalledWith(
{ "color": "var(--components--action-primary-hover-text)" },
{}
);
});
it("applies active styles when state.active is true", () => {
renderWithContext(/* @__PURE__ */ (0, import_jsx_runtime.jsx)(X, {}), {
variant: "primary",
state: { hover: false, active: true },
disabled: false
});
expect(X).toBeCalledWith(
{ "color": "var(--components--action-primary-active-text)" },
{}
);
});
it("applies disabled styles when disabled is true", () => {
renderWithContext(/* @__PURE__ */ (0, import_jsx_runtime.jsx)(X, {}), {
variant: "primary",
state: {},
disabled: true
});
expect(X).toBeCalledWith(
{ "color": "var(--components--action-primary-default-text)" },
{}
);
});
it("renders secondary variant styles correctly", () => {
renderWithContext(/* @__PURE__ */ (0, import_jsx_runtime.jsx)(X, {}), {
variant: "secondary",
state: { hover: false, active: false },
disabled: false
});
expect(X).toBeCalledWith(
{ "color": "var(--components--action-secondary-default-text)" },
{}
);
});
it("returns raw children if not a valid React element", () => {
const { container } = renderWithContext("Raw Text", {
variant: "primary",
state: {},
disabled: false
});
expect(container.textContent).toBe("Raw Text");
});
});
//# sourceMappingURL=Icon.spec.js.map