diff --git a/app/client/cypress/e2e/Regression/ClientSide/Widgets/Switch/SwitchGroup1_spec.ts b/app/client/cypress/e2e/Regression/ClientSide/Widgets/Switch/SwitchGroup1_spec.ts
index 8905e7ed4d..2e965258b0 100644
--- a/app/client/cypress/e2e/Regression/ClientSide/Widgets/Switch/SwitchGroup1_spec.ts
+++ b/app/client/cypress/e2e/Regression/ClientSide/Widgets/Switch/SwitchGroup1_spec.ts
@@ -217,7 +217,7 @@ describe(
agHelper.TypeText(widgetsLoc.RadioInput, "{{BLUE}}", 1);
propPane.ToggleJSMode("Options", true);
agHelper.AssertElementAbsence(locators._toastMsg);
- agHelper.GetNAssertElementText(widgets.textWidget, "RED");
+ agHelper.GetNAssertElementText(widgets.textWidget, "");
});
it("4. Set Label, Tooltip, Inline and check switch group", () => {
@@ -278,7 +278,7 @@ describe(
0,
true,
);
- agHelper.AssertElementVisibility(locators._visibleTextSpan("RED"));
+ agHelper.AssertElementVisibility(locators._visibleTextSpan("BLUE"));
});
},
);
diff --git a/app/client/src/widgets/CheckboxGroupWidget/widget/index.test.tsx b/app/client/src/widgets/CheckboxGroupWidget/widget/index.test.tsx
index add2c666c8..0fe974b07c 100644
--- a/app/client/src/widgets/CheckboxGroupWidget/widget/index.test.tsx
+++ b/app/client/src/widgets/CheckboxGroupWidget/widget/index.test.tsx
@@ -61,4 +61,21 @@ describe("", () => {
expect(result).toStrictEqual({ isValid: true, parsed: ["blue"] });
});
+
+ test("should return empty array when default value is not in options", async () => {
+ const result = defaultSelectedValuesValidation(`["blue"]`, {
+ options: [
+ {
+ label: "Apple",
+ value: "1",
+ },
+ {
+ label: "Orange",
+ value: "2",
+ },
+ ],
+ });
+
+ expect(result).toStrictEqual({ isValid: true, parsed: [] });
+ });
});
diff --git a/app/client/src/widgets/CheckboxGroupWidget/widget/index.tsx b/app/client/src/widgets/CheckboxGroupWidget/widget/index.tsx
index 7a882633f4..fe4090a208 100644
--- a/app/client/src/widgets/CheckboxGroupWidget/widget/index.tsx
+++ b/app/client/src/widgets/CheckboxGroupWidget/widget/index.tsx
@@ -35,12 +35,18 @@ import { FlexVerticalAlignment } from "layoutSystems/common/utils/constants";
export function defaultSelectedValuesValidation(
value: unknown,
+ props: any,
): ValidationResponse {
let values: string[] = [];
+ const options: OptionProps[] = props.options || [];
if (typeof value === "string") {
try {
values = JSON.parse(value);
+ values = values.filter((value: string) =>
+ options.some((option: OptionProps) => option.value === value),
+ );
+
if (!Array.isArray(values)) {
throw new Error();
}
@@ -154,6 +160,12 @@ class CheckboxGroupWidget extends BaseWidget<
};
}
+ static getDependencyMap(): Record {
+ return {
+ defaultSelectedValues: ["options"],
+ };
+ }
+
static getAutocompleteDefinitions(): AutocompletionDefinitions {
return {
"!doc":
@@ -614,6 +626,17 @@ class CheckboxGroupWidget extends BaseWidget<
}
componentDidUpdate(prevProps: CheckboxGroupWidgetProps) {
+ const validSelectedValues = prevProps.selectedValues.filter(
+ (value: string) =>
+ prevProps.options.some((option) => option.value === value),
+ );
+ if (validSelectedValues.length !== prevProps.selectedValues.length) {
+ this.props.updateWidgetMetaProperty(
+ "selectedValues",
+ validSelectedValues,
+ );
+ }
+
// Reset isDirty to false whenever defaultSelectedValues changes
if (
xor(this.props.defaultSelectedValues, prevProps.defaultSelectedValues)