@octopusdeploy/design-system-components
Version:
The design systems component library.
43 lines (42 loc) • 2.04 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
const jsx_runtime_1 = require("react/jsx-runtime");
const testing_library_1 = require("@octopusdeploy/testing-library");
const react_1 = require("@testing-library/react");
const vitest_1 = require("vitest");
const TestDesignSystemProvider_1 = require("../../../TestDesignSystemProvider");
const Legend_1 = require("../Legend");
(0, vitest_1.describe)("Legend", () => {
(0, vitest_1.it)("renders the label", () => {
const legend = renderLegend({ label: "Duration" });
legend.assertHasLabel("Duration");
});
(0, vitest_1.describe)("marginSize", () => {
(0, vitest_1.it)("applies the default 16px bottom margin when marginSize is omitted", () => {
const legend = renderLegend({ label: "Duration" });
legend.assertBottomMargin("1rem");
});
(0, vitest_1.it)("applies the default 16px bottom margin when marginSize is 'default'", () => {
const legend = renderLegend({ label: "Duration", marginSize: "default" });
legend.assertBottomMargin("1rem");
});
(0, vitest_1.it)("applies an 8px bottom margin when marginSize is 'small'", () => {
const legend = renderLegend({ label: "Duration", marginSize: "small" });
legend.assertBottomMargin("0.5rem");
});
});
});
function renderLegend(props) {
(0, react_1.render)((0, jsx_runtime_1.jsx)(TestDesignSystemProvider_1.TestDesignSystemProvider, { children: (0, jsx_runtime_1.jsx)("fieldset", { children: (0, jsx_runtime_1.jsx)(Legend_1.Legend, { ...props }) }) }));
return getLegendInteractions(props.label ?? "");
}
function getLegendInteractions(label) {
return {
assertHasLabel: (text) => {
testing_library_1.domQueries.getText(text).assertIsInTheDocument();
},
assertBottomMargin: (expected) => {
(0, vitest_1.expect)(react_1.screen.getByText(label)).toHaveStyle({ marginBottom: expected });
},
};
}