From 3be0f8971b1e276abc6bf456a77fd1847f36a108 Mon Sep 17 00:00:00 2001
From: JC Franco <jfranco@esri.com>
Date: Fri, 14 Jun 2024 18:37:20 -0700
Subject: [PATCH] test(label): add component token E2E tests

---
 .../calcite-components/src/components.d.ts    | 18 +++++++++++++
 .../src/components/label/label.e2e.ts         | 27 ++++++++++++++++++-
 2 files changed, 44 insertions(+), 1 deletion(-)

diff --git a/packages/calcite-components/src/components.d.ts b/packages/calcite-components/src/components.d.ts
index af91005d058..4c163bdf1c3 100644
--- a/packages/calcite-components/src/components.d.ts
+++ b/packages/calcite-components/src/components.d.ts
@@ -4562,6 +4562,10 @@ export namespace Components {
           * Accessible name for the dropdown menu.
          */
         "dropdownLabel": string;
+        /**
+          * Defines the available placements that can be used when a flip occurs.
+         */
+        "flipPlacements": FlipPlacement[];
         /**
           * Specifies the kind of the component, which will apply to border and background, if applicable.
          */
@@ -4574,6 +4578,11 @@ export namespace Components {
           * Determines the type of positioning to use for the overlaid content.  Using `"absolute"` will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout.  `"fixed"` should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is `"fixed"`.
          */
         "overlayPositioning": OverlayPositioning;
+        /**
+          * Determines where the component will be positioned relative to the container element.
+          * @default "bottom-end"
+         */
+        "placement": MenuPlacement;
         /**
           * Specifies an icon to display at the end of the primary button.
          */
@@ -12509,6 +12518,10 @@ declare namespace LocalJSX {
           * Accessible name for the dropdown menu.
          */
         "dropdownLabel"?: string;
+        /**
+          * Defines the available placements that can be used when a flip occurs.
+         */
+        "flipPlacements"?: FlipPlacement[];
         /**
           * Specifies the kind of the component, which will apply to border and background, if applicable.
          */
@@ -12529,6 +12542,11 @@ declare namespace LocalJSX {
           * Determines the type of positioning to use for the overlaid content.  Using `"absolute"` will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout.  `"fixed"` should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is `"fixed"`.
          */
         "overlayPositioning"?: OverlayPositioning;
+        /**
+          * Determines where the component will be positioned relative to the container element.
+          * @default "bottom-end"
+         */
+        "placement"?: MenuPlacement;
         /**
           * Specifies an icon to display at the end of the primary button.
          */
diff --git a/packages/calcite-components/src/components/label/label.e2e.ts b/packages/calcite-components/src/components/label/label.e2e.ts
index 44d5e02483b..b4fe471aebb 100644
--- a/packages/calcite-components/src/components/label/label.e2e.ts
+++ b/packages/calcite-components/src/components/label/label.e2e.ts
@@ -1,5 +1,6 @@
 import { newE2EPage } from "@stencil/core/testing";
-import { renders, hidden } from "../../tests/commonTests";
+import { renders, hidden, themed } from "../../tests/commonTests";
+import { CSS } from "./resources";
 
 describe("calcite-label", () => {
   describe("renders", () => {
@@ -179,4 +180,28 @@ describe("calcite-label", () => {
 
     expect(eventDetail).toBeTruthy();
   });
+
+  describe("theme", () => {
+    describe("default", () => {
+      themed("calcite-label", {
+        "--calcite-label-space-y-end": {
+          shadowSelector: `.${CSS.container}`,
+          targetProp: "marginBlockEnd",
+        },
+        "--calcite-label-text-color": {
+          shadowSelector: `.${CSS.container}`,
+          targetProp: "color",
+        },
+      });
+    });
+
+    describe("deprecated", () => {
+      themed("calcite-label", {
+        "--calcite-label-margin-bottom": {
+          shadowSelector: `.${CSS.container}`,
+          targetProp: "marginBlockEnd",
+        },
+      });
+    });
+  });
 });