xmlui 0.11.4 → 0.11.7

package/dist/scripts/src/components/Footer/Footer.spec.js

@@ -1,991 +0,0 @@
-"use strict";
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const component_test_helpers_1 = require("../../testing/component-test-helpers");
-const fixtures_1 = require("../../testing/fixtures");
-// =============================================================================
-// BASIC FUNCTIONALITY TESTS
-// =============================================================================
-(0, fixtures_1.test)("component renders with basic content", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-    yield initTestBed(`<App>
-        <Footer>
-          <Text testId="footer-text">© 2025 Company Name</Text>
-        </Footer>
-      </App>`);
-    yield (0, fixtures_1.expect)(page.getByTestId("footer-text")).toHaveText("© 2025 Company Name");
-}));
-(0, fixtures_1.test)("component renders multiple items correctly", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-    yield initTestBed(`
-    <App>
-      <Footer>
-        <Text testId="footer-1">© 2025 Company Name</Text>
-        <Text testId="footer-2">Terms of Service</Text>
-        <Text testId="footer-3">Privacy Policy</Text>
-      </Footer>
-    </App>
-  `);
-    yield (0, fixtures_1.expect)(page.getByTestId("footer-1")).toHaveText("© 2025 Company Name");
-    yield (0, fixtures_1.expect)(page.getByTestId("footer-2")).toHaveText("Terms of Service");
-    yield (0, fixtures_1.expect)(page.getByTestId("footer-3")).toHaveText("Privacy Policy");
-}));
-// =============================================================================
-// ACCESSIBILITY TESTS
-// =============================================================================
-(0, fixtures_1.test)("component has correct accessibility attributes", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-    // TODO: review these Copilot-created tests
-    yield initTestBed(`
-    <App>
-      <Footer testId="footer">
-        <Text>© 2025 Company Name</Text>
-      </Footer>
-    </App>
-  `, {});
-    // Check that the component has the correct role
-    yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveAttribute("role", "contentinfo");
-}));
-(0, fixtures_1.test)("component allows interactive elements within it to be focusable", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed, }) {
-    yield initTestBed(`
-    <App>
-      <Footer>
-        <Text>© 2025 Company Name</Text>
-        <Button testId="button">Contact Us</Button>
-      </Footer>
-    </App>
-  `, {});
-    // Button within Footer should be focusable
-    const button = page.getByTestId("button");
-    yield button.focus();
-    yield (0, fixtures_1.expect)(button).toBeFocused();
-    // Should be able to activate with keyboard
-    yield button.press("Enter");
-    yield (0, fixtures_1.expect)(button).toBeVisible(); // Button should still be visible after activation
-}));
-// =============================================================================
-// EDGE CASE TESTS
-// =============================================================================
-(0, fixtures_1.test)("component handles empty content gracefully", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-    yield initTestBed(`<App><Footer testId="footer"></Footer></App>`, {});
-    // Component should still render even without children
-    yield (0, fixtures_1.expect)(page.getByTestId("footer")).toBeVisible();
-}));
-(0, fixtures_1.test)("component handles long content correctly", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-    const LONG_TEXT = "This is a very long text content that might cause overflow issues if not handled correctly by the footer component. The component should handle this gracefully.";
-    yield initTestBed(`
-    <App>
-      <Footer>
-        <Text testId="footer-text">${LONG_TEXT}</Text>
-      </Footer>
-    </App>
-  `);
-    const textElement = page.getByTestId("footer-text");
-    yield (0, fixtures_1.expect)(textElement).toBeVisible();
-    yield (0, fixtures_1.expect)(textElement).toHaveText(LONG_TEXT);
-}));
-// =============================================================================
-// VISUAL STATE TESTS
-// =============================================================================
-fixtures_1.test.describe("Visual State", () => {
-    (0, fixtures_1.test)("component applies theme variables correctly", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        // TODO: review these Copilot-created tests
-        yield initTestBed(`
-      <App>
-        <Footer testId="footer">
-          <Text>© 2025 Company Name</Text>
-        </Footer>
-      </App>
-  `, {
-            testThemeVars: {
-                "backgroundColor-Footer": "rgb(80, 80, 80)",
-                "textColor-Footer": "rgb(255, 0, 0)",
-                "borderTop-Footer": "2px solid rgb(200, 200, 200)",
-            },
-        });
-        // Check that theme variables are applied
-        const footer = page.getByTestId("footer");
-        yield (0, fixtures_1.expect)(footer).toHaveCSS("background-color", "rgb(80, 80, 80)");
-        yield (0, fixtures_1.expect)(footer).toHaveCSS("border-top", "2px solid rgb(200, 200, 200)");
-        yield (0, fixtures_1.expect)(footer).toHaveCSS("color", "rgb(255, 0, 0)");
-    }));
-    const FOOTER_ID = "footer";
-    const FOOTER_CODE = `<Footer testId="${FOOTER_ID}">"This is a footer."</Footer>`;
-    (0, fixtures_1.test)(`height`, (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const expectedHeightPx = 100;
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "height-Footer": expectedHeightPx + "px",
-            },
-        });
-        const { height } = yield (0, component_test_helpers_1.getBounds)(page.getByTestId(FOOTER_ID));
-        (0, fixtures_1.expect)(height).toEqualWithTolerance(expectedHeightPx);
-    }));
-    (0, fixtures_1.test)(`padding`, (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const expectedPadding = "10px";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "padding-Footer": expectedPadding,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId(FOOTER_ID).locator("> div")).toHaveCSS("padding", expectedPadding);
-    }));
-    (0, fixtures_1.test)("paddingHorizontal", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const expectedPadding = "10px";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "paddingHorizontal-Footer": expectedPadding,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId(FOOTER_ID).locator("> div")).toHaveCSS("padding-left", expectedPadding);
-        yield (0, fixtures_1.expect)(page.getByTestId(FOOTER_ID).locator("> div")).toHaveCSS("padding-right", expectedPadding);
-    }));
-    (0, fixtures_1.test)("paddingVertical", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const expectedPadding = "10px";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "paddingVertical-Footer": expectedPadding,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId(FOOTER_ID).locator("> div")).toHaveCSS("padding-top", expectedPadding);
-        yield (0, fixtures_1.expect)(page.getByTestId(FOOTER_ID).locator("> div")).toHaveCSS("padding-bottom", expectedPadding);
-    }));
-    (0, fixtures_1.test)(`bg-color`, (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const expectedBackgroundColor = "rgb(255, 0, 0)";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "backgroundColor-Footer": expectedBackgroundColor,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId(FOOTER_ID)).toHaveCSS("background-color", expectedBackgroundColor);
-    }));
-    (0, fixtures_1.test)(`fontSize`, (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const expectedFontSizePx = "20px";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "fontSize-Footer": expectedFontSizePx,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId(FOOTER_ID).locator("> div")).toHaveCSS("font-size", expectedFontSizePx);
-    }));
-    (0, fixtures_1.test)(`vertical-alignment`, (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const expectedAlignment = "center";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "vertical-alignment-Footer": expectedAlignment,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId(FOOTER_ID).locator("> div")).toHaveCSS("align-items", expectedAlignment);
-    }));
-    (0, fixtures_1.test)("border", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(255, 0, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "border-Footer": `${EXPECTED_STYLE} ${EXPECTED_COLOR} ${EXPECTED_WIDTH}`,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-style", EXPECTED_STYLE);
-    }));
-    (0, fixtures_1.test)("borderLeft", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(255, 0, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderLeft-Footer": `${EXPECTED_STYLE} ${EXPECTED_COLOR} ${EXPECTED_WIDTH}`,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-top-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-top-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-top-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-right-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-right-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-right-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-bottom-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-bottom-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-bottom-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-style", EXPECTED_STYLE);
-    }));
-    (0, fixtures_1.test)("borderRight", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(255, 0, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderRight-Footer": `${EXPECTED_STYLE} ${EXPECTED_COLOR} ${EXPECTED_WIDTH}`,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-top-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-top-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-top-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-bottom-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-bottom-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-bottom-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-left-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-left-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-left-style", EXPECTED_STYLE);
-    }));
-    (0, fixtures_1.test)("borderHorizontal", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(255, 0, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderHorizontal-Footer": `${EXPECTED_STYLE} ${EXPECTED_COLOR} ${EXPECTED_WIDTH}`,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-top-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-top-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-top-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-bottom-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-bottom-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-bottom-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-style", EXPECTED_STYLE);
-    }));
-    (0, fixtures_1.test)("borderHorizontal and borderLeft", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(255, 0, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderHorizontal-Footer": `${EXPECTED_STYLE} ${EXPECTED_COLOR} ${EXPECTED_WIDTH}`,
-                "borderLeft-Footer": "8px double rgb(0, 128, 0)",
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-top-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-top-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-top-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-bottom-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-bottom-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-bottom-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-color", "rgb(0, 128, 0)");
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-width", "8px");
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-style", "double");
-    }));
-    (0, fixtures_1.test)("borderHorizontal and borderRight", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(255, 0, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderHorizontal-Footer": `${EXPECTED_STYLE} ${EXPECTED_COLOR} ${EXPECTED_WIDTH}`,
-                "borderRight-Footer": "8px double rgb(0, 128, 0)",
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-top-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-top-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-top-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-color", "rgb(0, 128, 0)");
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-width", "8px");
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-style", "double");
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-bottom-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-bottom-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-bottom-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-style", EXPECTED_STYLE);
-    }));
-    (0, fixtures_1.test)("borderTop", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(255, 0, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderTop-Footer": `${EXPECTED_STYLE} ${EXPECTED_COLOR} ${EXPECTED_WIDTH}`,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-right-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-right-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-right-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-bottom-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-bottom-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-bottom-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-left-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-left-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-left-style", EXPECTED_STYLE);
-    }));
-    (0, fixtures_1.test)("borderBottom", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(255, 0, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderBottom-Footer": `${EXPECTED_STYLE} ${EXPECTED_COLOR} ${EXPECTED_WIDTH}`,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-top-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-top-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-top-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-right-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-right-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-right-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-left-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-left-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-left-style", EXPECTED_STYLE);
-    }));
-    (0, fixtures_1.test)("borderVertical", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(255, 0, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderVertical-Footer": `${EXPECTED_STYLE} ${EXPECTED_COLOR} ${EXPECTED_WIDTH}`,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-right-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-right-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-right-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-left-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-left-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-left-style", EXPECTED_STYLE);
-    }));
-    (0, fixtures_1.test)("borderVertical and borderTop", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(255, 0, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderVertical-Footer": `${EXPECTED_STYLE} ${EXPECTED_COLOR} ${EXPECTED_WIDTH}`,
-                "borderTop-Footer": "8px double rgb(0, 128, 0)",
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-color", "rgb(0, 128, 0)");
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-width", "8px");
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-style", "double");
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-right-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-right-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-right-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-left-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-left-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-left-style", EXPECTED_STYLE);
-    }));
-    (0, fixtures_1.test)("borderVertical and borderBottom", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(255, 0, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderVertical-Footer": `${EXPECTED_STYLE} ${EXPECTED_COLOR} ${EXPECTED_WIDTH}`,
-                "borderBottom-Footer": "8px double rgb(0, 128, 0)",
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-right-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-right-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-right-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-color", "rgb(0, 128, 0)");
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-width", "8px");
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-style", "double");
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-left-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-left-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-left-style", EXPECTED_STYLE);
-    }));
-    (0, fixtures_1.test)("border-color", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(0, 128, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderColor-Footer": EXPECTED_COLOR,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-top-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-top-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-right-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-right-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-bottom-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-bottom-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-left-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-left-style", EXPECTED_STYLE);
-    }));
-    (0, fixtures_1.test)("border, border-color", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(255, 0, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        const UPDATED = "rgb(0, 128, 0)";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderColor-Footer": UPDATED,
-                "border-Footer": `${EXPECTED_STYLE} ${EXPECTED_COLOR} ${EXPECTED_WIDTH}`,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-color", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-color", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-color", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-color", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-style", EXPECTED_STYLE);
-    }));
-    (0, fixtures_1.test)("border, border-color-horizontal", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(255, 0, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        const UPDATED = "rgb(0, 128, 0)";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderHorizontalColor-Footer": UPDATED,
-                "border-Footer": `${EXPECTED_STYLE} ${EXPECTED_COLOR} ${EXPECTED_WIDTH}`,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-color", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-color", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-style", EXPECTED_STYLE);
-    }));
-    (0, fixtures_1.test)("border, border-color-left", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(255, 0, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        const UPDATED = "rgb(0, 128, 0)";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderLeftColor-Footer": UPDATED,
-                "border-Footer": `${EXPECTED_STYLE} ${EXPECTED_COLOR} ${EXPECTED_WIDTH}`,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-color", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-style", EXPECTED_STYLE);
-    }));
-    (0, fixtures_1.test)("border, border-color-right", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(255, 0, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        const UPDATED = "rgb(0, 128, 0)";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderRightColor-Footer": UPDATED,
-                "border-Footer": `${EXPECTED_STYLE} ${EXPECTED_COLOR} ${EXPECTED_WIDTH}`,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-color", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-style", EXPECTED_STYLE);
-    }));
-    (0, fixtures_1.test)("border, border-color-vertical", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(255, 0, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        const UPDATED = "rgb(0, 128, 0)";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderVerticalColor-Footer": UPDATED,
-                "border-Footer": `${EXPECTED_STYLE} ${EXPECTED_COLOR} ${EXPECTED_WIDTH}`,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-color", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-color", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-style", EXPECTED_STYLE);
-    }));
-    (0, fixtures_1.test)("border, border-color-top", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(255, 0, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        const UPDATED = "rgb(0, 128, 0)";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderTopColor-Footer": UPDATED,
-                "border-Footer": `${EXPECTED_STYLE} ${EXPECTED_COLOR} ${EXPECTED_WIDTH}`,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-color", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-style", EXPECTED_STYLE);
-    }));
-    (0, fixtures_1.test)("border, border-color-bottom", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(255, 0, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        const UPDATED = "rgb(0, 128, 0)";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderBottomColor-Footer": UPDATED,
-                "border-Footer": `${EXPECTED_STYLE} ${EXPECTED_COLOR} ${EXPECTED_WIDTH}`,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-color", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-style", EXPECTED_STYLE);
-    }));
-    (0, fixtures_1.test)("border-style", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(0, 128, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderStyle-Footer": EXPECTED_STYLE,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-top-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-top-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-right-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-right-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-bottom-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-bottom-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-left-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).not.toHaveCSS("border-left-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-style", EXPECTED_STYLE);
-    }));
-    (0, fixtures_1.test)("border, border-style", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(255, 0, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        const UPDATED = "double";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderStyle-Footer": UPDATED,
-                "border-Footer": `${EXPECTED_STYLE} ${EXPECTED_COLOR} ${EXPECTED_WIDTH}`,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-style", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-style", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-style", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-style", UPDATED);
-    }));
-    (0, fixtures_1.test)("border, border-style-horizontal", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(0, 128, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        const UPDATED = "double";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderHorizontalStyle-Footer": UPDATED,
-                "border-Footer": `${EXPECTED_STYLE} ${EXPECTED_COLOR} ${EXPECTED_WIDTH}`,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-style", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-style", UPDATED);
-    }));
-    (0, fixtures_1.test)("border, border-style-left", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(0, 128, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        const UPDATED = "double";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderLeftStyle-Footer": UPDATED,
-                "border-Footer": `${EXPECTED_STYLE} ${EXPECTED_COLOR} ${EXPECTED_WIDTH}`,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-style", UPDATED);
-    }));
-    (0, fixtures_1.test)("border, border-style-right", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(0, 128, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        const UPDATED = "double";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderRightStyle-Footer": UPDATED,
-                "border-Footer": `${EXPECTED_STYLE} ${EXPECTED_COLOR} ${EXPECTED_WIDTH}`,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-style", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-style", EXPECTED_STYLE);
-    }));
-    (0, fixtures_1.test)("border, border-style-vertical", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(0, 128, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        const UPDATED = "double";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderVerticalStyle-Footer": UPDATED,
-                "border-Footer": `${EXPECTED_STYLE} ${EXPECTED_COLOR} ${EXPECTED_WIDTH}`,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-style", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-style", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-style", EXPECTED_STYLE);
-    }));
-    (0, fixtures_1.test)("border, border-style-top", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(0, 128, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        const UPDATED = "double";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderTopStyle-Footer": UPDATED,
-                "border-Footer": `${EXPECTED_STYLE} ${EXPECTED_COLOR} ${EXPECTED_WIDTH}`,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-style", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-style", EXPECTED_STYLE);
-    }));
-    (0, fixtures_1.test)("border, border-style-bottom", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(0, 128, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        const UPDATED = "double";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderBottomStyle-Footer": UPDATED,
-                "border-Footer": `${EXPECTED_STYLE} ${EXPECTED_COLOR} ${EXPECTED_WIDTH}`,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-style", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-style", EXPECTED_STYLE);
-    }));
-    (0, fixtures_1.test)("border-thickness", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_WIDTH = "8px";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderWidth-Footer": EXPECTED_WIDTH,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-width", "0px");
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-width", "0px");
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-width", "0px");
-    }));
-    (0, fixtures_1.test)("border, border-thickness", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(255, 0, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        const UPDATED = "12px";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderWidth-Footer": UPDATED,
-                "border-Footer": `${EXPECTED_STYLE} ${EXPECTED_COLOR} ${EXPECTED_WIDTH}`,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-width", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-width", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-width", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-width", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-style", EXPECTED_STYLE);
-    }));
-    (0, fixtures_1.test)("border, border-thickness-horizontal", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(255, 0, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        const UPDATED = "12px";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderHorizontalWidth-Footer": UPDATED,
-                "border-Footer": `${EXPECTED_STYLE} ${EXPECTED_COLOR} ${EXPECTED_WIDTH}`,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-width", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-width", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-style", EXPECTED_STYLE);
-    }));
-    (0, fixtures_1.test)("border, border-thickness-left", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(255, 0, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        const UPDATED = "12px";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderLeftWidth-Footer": UPDATED,
-                "border-Footer": `${EXPECTED_STYLE} ${EXPECTED_COLOR} ${EXPECTED_WIDTH}`,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-width", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-style", EXPECTED_STYLE);
-    }));
-    (0, fixtures_1.test)("border, border-thickness-right", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(255, 0, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        const UPDATED = "12px";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderRightWidth-Footer": UPDATED,
-                "border-Footer": `${EXPECTED_STYLE} ${EXPECTED_COLOR} ${EXPECTED_WIDTH}`,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-width", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-style", EXPECTED_STYLE);
-    }));
-    (0, fixtures_1.test)("border, border-thickness-vertical", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(255, 0, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        const UPDATED = "12px";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderVerticalWidth-Footer": UPDATED,
-                "border-Footer": `${EXPECTED_STYLE} ${EXPECTED_COLOR} ${EXPECTED_WIDTH}`,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-width", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-width", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-style", EXPECTED_STYLE);
-    }));
-    (0, fixtures_1.test)("border, border-thickness-top", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(255, 0, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        const UPDATED = "12px";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderTopWidth-Footer": UPDATED,
-                "border-Footer": `${EXPECTED_STYLE} ${EXPECTED_COLOR} ${EXPECTED_WIDTH}`,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-width", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-style", EXPECTED_STYLE);
-    }));
-    (0, fixtures_1.test)("border, border-thickness-bottom", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed }) {
-        const EXPECTED_COLOR = "rgb(255, 0, 0)";
-        const EXPECTED_WIDTH = "5px";
-        const EXPECTED_STYLE = "dotted";
-        const UPDATED = "12px";
-        yield initTestBed(FOOTER_CODE, {
-            testThemeVars: {
-                "borderBottomWidth-Footer": UPDATED,
-                "border-Footer": `${EXPECTED_STYLE} ${EXPECTED_COLOR} ${EXPECTED_WIDTH}`,
-            },
-        });
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-top-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-right-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-width", UPDATED);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-bottom-style", EXPECTED_STYLE);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-color", EXPECTED_COLOR);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-width", EXPECTED_WIDTH);
-        yield (0, fixtures_1.expect)(page.getByTestId("footer")).toHaveCSS("border-left-style", EXPECTED_STYLE);
-    }));
-});