feat(combobox): single-persist mode ignores clearDisabled

packages/calcite-components/src/components/combobox/combobox.e2e.ts

@@ -1421,6 +1421,16 @@ describe("calcite-combobox", () => {
             </calcite-combobox>
           `,
         },
+        {
+          selectionMode: "single-persist",
+          html: html`
+            <calcite-combobox selection-mode="single-persist">
+              <calcite-combobox-item selected id="one" value="one" text-label="one"></calcite-combobox-item>
+              <calcite-combobox-item id="two" value="two" text-label="two"></calcite-combobox-item>
+              <calcite-combobox-item id="three" value="three" text-label="three"></calcite-combobox-item>
+            </calcite-combobox>
+          `,
+        },
         {
           selectionMode: "multiple",
           html: html`
@@ -1446,15 +1456,25 @@ describe("calcite-combobox", () => {
 
       describe("via mouse", () => {
         testCases.forEach((testCase) => {
-          it(`clears the value in ${testCase.selectionMode}-selection mode`, () =>
-            assertValueClearing(testCase.html, "mouse", "clear"));
+          if (testCase.selectionMode === "single-persist") {
+            it(`does not clear the value in ${testCase.selectionMode}-selection mode`, () =>
+              assertValueClearing(testCase.html, "mouse", "no-clear"));
+          } else {
+            it(`clears the value in ${testCase.selectionMode}-selection mode`, () =>
+              assertValueClearing(testCase.html, "mouse", "clear"));
+          }
         });
       });
 
       describe("via keyboard", () => {
         testCases.forEach((testCase) => {
-          it(`clears the value in ${testCase.selectionMode}-selection mode`, () =>
-            assertValueClearing(testCase.html, "keyboard", "clear"));
+          if (testCase.selectionMode === "single-persist") {
+            it(`does not clear the value in ${testCase.selectionMode}-selection mode`, () =>
+              assertValueClearing(testCase.html, "mouse", "no-clear"));
+          } else {
+            it(`clears the value in ${testCase.selectionMode}-selection mode`, () =>
+              assertValueClearing(testCase.html, "keyboard", "clear"));
+          }
         });
       });
     });
@@ -1471,6 +1491,16 @@ describe("calcite-combobox", () => {
             </calcite-combobox>
           `,
         },
+        {
+          selectionMode: "single-persist",
+          html: html`
+            <calcite-combobox clear-disabled selection-mode="single-persist">
+              <calcite-combobox-item selected id="one" value="one" text-label="one"></calcite-combobox-item>
+              <calcite-combobox-item id="two" value="two" text-label="two"></calcite-combobox-item>
+              <calcite-combobox-item id="three" value="three" text-label="three"></calcite-combobox-item>
+            </calcite-combobox>
+          `,
+        },
         {
           selectionMode: "multiple",
           html: html`
@@ -1496,14 +1526,14 @@ describe("calcite-combobox", () => {
 
       describe("via mouse", () => {
         testCases.forEach((testCase) => {
-          it(`clears the value in ${testCase.selectionMode}-selection mode`, () =>
+          it(`does not clears the value in ${testCase.selectionMode}-selection mode`, () =>
             assertValueClearing(testCase.html, "mouse", "no-clear"));
         });
       });
 
       describe("via keyboard", () => {
         testCases.forEach((testCase) => {
-          it(`clears the value in ${testCase.selectionMode}-selection mode`, () =>
+          it(`does not clears the value in ${testCase.selectionMode}-selection mode`, () =>
             assertValueClearing(testCase.html, "keyboard", "no-clear"));
         });
       });

packages/calcite-components/src/components/combobox/combobox.tsx

@@ -650,6 +650,10 @@ export class Combobox
     this.refreshSelectionDisplay();
   }
 
+  async load(): Promise<void> {
+    this.handleSelectionModeWarning();
+  }
+
   loaded(): void {
     afterConnectDefaultValueSet(this, this.getValue());
     connectFloatingUI(this);
@@ -1546,6 +1550,12 @@ export class Combobox
     );
   }
 
+  private handleSelectionModeWarning(): void {
+    if (this.selectionMode === "single-persist" && this.clearDisabled) {
+      console.warn(`clearDisabled is ignored when selection-mode is set to "single-persist"`);
+    }
+  }
+
   //#endregion
 
   //#region Rendering
@@ -1901,7 +1911,8 @@ export class Combobox
     const allSelectionDisplay = selectionDisplay === "all";
     const singleSelectionDisplay = selectionDisplay === "single";
     const fitSelectionDisplay = !singleSelectionMode && selectionDisplay === "fit";
-    const isClearable = !this.clearDisabled && this.value?.length > 0;
+    const isClearable =
+      !this.clearDisabled && this.selectionMode !== "single-persist" && !!this.value?.length;
 
     return (
       <InteractiveContainer disabled={this.disabled}>

packages/calcite-components/src/components/input-time-zone/input-time-zone.e2e.ts

@@ -29,6 +29,8 @@ import { getCity, toUserFriendlyName } from "./utils";
  */
 
 describe("calcite-input-time-zone", () => {
+  mockConsole();
+
   type TestTimeZoneItem = {
     name: string;
     offset: number;
@@ -129,8 +131,6 @@ describe("calcite-input-time-zone", () => {
   });
 
   describe("translation support", () => {
-    mockConsole();
-
     t9n(simpleTestProvider);
   });