PromucFlow_constructor/app/client/src/widgets/TableWidgetV2/widget/propertyUtils.test.ts
Keyur Paralkar d57ba074a9
fix: add null check for select options in table widget (#24902)
## Description
This PR passes a `[]` to the select component when some values in the
select options that are passed to the select cell component are `null`.

This fixes issue where the table widget breaks when select options for
the select column type contains `{{null}}` or `{{[null, null]}}`

#### PR fixes following issue(s)
Fixes #24857

#### Type of change

- Bug fix (non-breaking change which fixes an issue)

## Testing
#### How Has This Been Tested?

- [x] Manual
- To test that table widget does not break when `{{[null]}}`, `{{[null,
null]}}`, `{{null}}` is passed to select options or new row select
options.
- To test that table widget does not break when select options or new
row select options contains API binding that does not have any data
- [ ] Jest
- [x] Cypress
- should test that select column dropdown has no results found string
when select option is {{null}}
- should test that select column dropdown has no results found string
when select option is {{[null, null]}}

#### Test Plan
> Add Testsmith test cases links that relate to this PR
>
>
#### Issues raised during DP testing
> Link issues raised during DP testing for better visiblity and tracking
(copy link from comments dropped on this PR)
>
>
>
## Checklist:
#### Dev activity
- [x] My code follows the style guidelines of this project
- [x] I have performed a self-review of my own code
- [x] I have commented my code, particularly in hard-to-understand areas
- [ ] I have made corresponding changes to the documentation
- [x] My changes generate no new warnings
- [x] I have added tests that prove my fix is effective or that my
feature works
- [ ] New and existing unit tests pass locally with my changes
- [ ] PR is being merged under a feature flag


#### QA activity:
- [ ] [Speedbreak
features](https://github.com/appsmithorg/TestSmith/wiki/Guidelines-for-test-plans#speedbreakers-)
have been covered
- [ ] Test plan covers all impacted features and [areas of
interest](https://github.com/appsmithorg/TestSmith/wiki/Guidelines-for-test-plans#areas-of-interest-)
- [ ] Test plan has been peer reviewed by project stakeholders and other
QA members
- [ ] Manually tested functionality on DP
- [ ] We had an implementation alignment call with stakeholders post QA
Round 2
- [ ] Cypress test cases have been added and approved by SDET/manual QA
- [ ] Added `Test Plan Approved` label after Cypress tests were reviewed
- [ ] Added `Test Plan Approved` label after JUnit tests were reviewed
2023-06-29 12:37:41 +05:30

1019 lines
24 KiB
TypeScript

import {
totalRecordsCountValidation,
uniqueColumnNameValidation,
updateColumnStyles,
updateColumnOrderHook,
getBasePropertyPath,
hideByColumnType,
uniqueColumnAliasValidation,
updateCustomColumnAliasOnLabelChange,
selectColumnOptionsValidation,
allowedFirstDayOfWeekRange,
} from "./propertyUtils";
import _ from "lodash";
import type { ColumnTypes, TableWidgetProps } from "../constants";
import { StickyType } from "../component/Constants";
describe("PropertyUtils - ", () => {
it("totalRecordsCountValidation - should test with all possible values", () => {
const ERROR_MESSAGE = [
{ name: "ValidationError", message: "This value must be a number" },
];
const values = [
[
undefined,
{
isValid: true,
parsed: 0,
messages: [],
},
],
[
null,
{
isValid: true,
parsed: 0,
messages: [],
},
],
[
"",
{
isValid: true,
parsed: 0,
messages: [],
},
],
[
{},
{
isValid: false,
parsed: 0,
messages: ERROR_MESSAGE,
},
],
[
[],
{
isValid: false,
parsed: 0,
messages: ERROR_MESSAGE,
},
],
[
"test",
{
isValid: false,
parsed: 0,
messages: ERROR_MESSAGE,
},
],
[
"1",
{
isValid: true,
parsed: 1,
messages: [],
},
],
[
1,
{
isValid: true,
parsed: 1,
messages: [],
},
],
];
values.forEach(([input, expected]) => {
expect(
totalRecordsCountValidation(input, {} as TableWidgetProps, _),
).toEqual(expected);
});
});
it("uniqueColumnNameValidation - should test with all possible values", () => {
let value = [
{
label: "column1",
},
{
label: "column2",
},
{
label: "column3",
},
];
expect(
uniqueColumnNameValidation(value, {} as TableWidgetProps, _),
).toEqual({
isValid: true,
parsed: value,
messages: [""],
});
value = [
{
label: "column1",
},
{
label: "column2",
},
{
label: "column1",
},
];
expect(
uniqueColumnNameValidation(value, {} as TableWidgetProps, _),
).toEqual({
isValid: false,
parsed: value,
messages: ["Column names should be unique."],
});
});
it("updateColumnStyles - should test with all possible values", () => {
let props: any = {
primaryColumns: {
1: {
id: 1,
style: "someRandomStyleValue",
},
2: {
id: 2,
style: "someRandomStyleValue",
},
3: {
id: 3,
style: "someRandomStyleValue",
},
},
};
expect(
updateColumnStyles(
props as any as TableWidgetProps,
"style",
"someOtherRandomStyleValue",
),
).toEqual([
{
propertyPath: "primaryColumns.1.style",
propertyValue: "someOtherRandomStyleValue",
},
{
propertyPath: "primaryColumns.2.style",
propertyValue: "someOtherRandomStyleValue",
},
{
propertyPath: "primaryColumns.3.style",
propertyValue: "someOtherRandomStyleValue",
},
]);
props = {
dynamicBindingPathList: [
{
key: "primaryColumns.3.style",
},
],
primaryColumns: {
1: {
id: 1,
style: "someRandomStyleValue",
},
2: {
id: 2,
style: "someRandomStyleValue",
},
3: {
id: 3,
style: "someRandomStyleValue",
},
},
};
expect(
updateColumnStyles(
props as any as TableWidgetProps,
"style",
"someOtherRandomStyleValue",
),
).toEqual([
{
propertyPath: "primaryColumns.1.style",
propertyValue: "someOtherRandomStyleValue",
},
{
propertyPath: "primaryColumns.2.style",
propertyValue: "someOtherRandomStyleValue",
},
]);
expect(
updateColumnStyles(
props as any as TableWidgetProps,
"",
"someOtherRandomStyleValue",
),
).toEqual(undefined);
expect(
updateColumnStyles(
{} as any as TableWidgetProps,
"style",
"someOtherRandomStyleValue",
),
).toEqual(undefined);
expect(
updateColumnStyles(
{} as any as TableWidgetProps,
"",
"someOtherRandomStyleValue",
),
).toEqual(undefined);
});
it("updateColumnOrderHook - should test with all possible values", () => {
const defaultStickyValuesForPrimaryCols = {
column1: {
sticky: StickyType.NONE,
},
column2: {
sticky: StickyType.NONE,
},
column3: {
sticky: StickyType.NONE,
},
};
expect(
updateColumnOrderHook(
{
columnOrder: ["column1", "column2"],
primaryColumns: defaultStickyValuesForPrimaryCols,
} as any as TableWidgetProps,
"primaryColumns.column3",
{
id: "column3",
},
),
).toEqual([
{
propertyPath: "columnOrder",
propertyValue: ["column1", "column2", "column3"],
},
{
propertyPath: "primaryColumns.column3",
propertyValue: {
id: "column3",
labelColor: "#FFFFFF",
},
},
]);
expect(
updateColumnOrderHook(
{
columnOrder: ["column1", "column2"],
} as any as TableWidgetProps,
"",
{
id: "column3",
},
),
).toEqual(undefined);
expect(
updateColumnOrderHook({} as any as TableWidgetProps, "", {
id: "column3",
}),
).toEqual(undefined);
expect(
updateColumnOrderHook(
{
columnOrder: ["column1", "column2"],
} as any as TableWidgetProps,
"primaryColumns.column3.iconAlignment",
{
id: "column3",
},
),
).toEqual(undefined);
});
it("getBasePropertyPath - should test with all possible values", () => {
expect(getBasePropertyPath("primaryColumns.test")).toBe("primaryColumns");
expect(getBasePropertyPath("primaryColumns.test.style")).toBe(
"primaryColumns.test",
);
expect(getBasePropertyPath("")).toBe(undefined);
expect(getBasePropertyPath("primaryColumns")).toBe(undefined);
});
describe("hideByColumnType - ", () => {
it("should test with column type that should not be hidden", () => {
const prop = {
primaryColumns: {
column: {
columnType: "text",
},
},
};
expect(
hideByColumnType(
prop as any as TableWidgetProps,
"primaryColumns.column",
["text"] as ColumnTypes[],
true,
),
).toBe(false);
});
it("should test with column type that should be hidden", () => {
const prop = {
primaryColumns: {
column: {
columnType: "select",
},
},
};
expect(
hideByColumnType(
prop as any as TableWidgetProps,
"primaryColumns.column",
["text"] as ColumnTypes[],
true,
),
).toBe(true);
});
it("should test column that should be hidden, with full propertyPath", () => {
const prop = {
primaryColumns: {
column: {
columnType: "select",
},
},
};
expect(
hideByColumnType(
prop as any as TableWidgetProps,
"primaryColumns.column.buttonColor",
["Button"] as any as ColumnTypes[],
),
).toBe(true);
});
it("should test column that should not be hidden, with full propertyPath", () => {
const prop = {
primaryColumns: {
column: {
columnType: "Button",
},
},
};
expect(
hideByColumnType(
prop as any as TableWidgetProps,
"primaryColumns.column.buttonColor",
["Button"] as any as ColumnTypes[],
),
).toBe(false);
});
});
});
describe("uniqueColumnAliasValidation", () => {
it("should validate that duplicate value is not allowed", () => {
expect(
uniqueColumnAliasValidation(
"column",
{
primaryColumns: {
column: {
alias: "column",
},
column1: {
alias: "column",
},
column2: {
alias: "column2",
},
},
} as unknown as TableWidgetProps,
_,
),
).toEqual({
isValid: false,
parsed: "column",
messages: ["Property names should be unique."],
});
});
it("should validate that empty value is not allowed", () => {
expect(
uniqueColumnAliasValidation(
"",
{
primaryColumns: {
column: {
alias: "column",
},
column1: {
alias: "column1",
},
column2: {
alias: "column2",
},
},
} as unknown as TableWidgetProps,
_,
),
).toEqual({
isValid: false,
parsed: "",
messages: ["Property name should not be empty."],
});
});
it("should validate that unique value is allowed", () => {
expect(
uniqueColumnAliasValidation(
"column1",
{
primaryColumns: {
column: {
alias: "column",
},
column1: {
alias: "column1",
},
column2: {
alias: "column2",
},
},
} as unknown as TableWidgetProps,
_,
),
).toEqual({
isValid: true,
parsed: "column1",
messages: [""],
});
});
});
describe("selectColumnOptionsValidation", () => {
describe("- Array of label, values", () => {
it("should check that for empty values are allowed", () => {
["", undefined, null].forEach((value) => {
expect(
selectColumnOptionsValidation(value, {} as TableWidgetProps, _),
).toEqual({
isValid: true,
parsed: [],
messages: [""],
});
});
});
it("should check that value should be an array", () => {
expect(
selectColumnOptionsValidation("test", {} as TableWidgetProps, _),
).toEqual({
isValid: false,
parsed: [],
messages: [
`This value does not evaluate to type Array<{ "label": string | number, "value": string | number | boolean }>`,
],
});
expect(
selectColumnOptionsValidation(1, {} as TableWidgetProps, _),
).toEqual({
isValid: false,
parsed: [],
messages: [
`This value does not evaluate to type Array<{ "label": string | number, "value": string | number | boolean }>`,
],
});
expect(
selectColumnOptionsValidation([], {} as TableWidgetProps, _),
).toEqual({
isValid: true,
parsed: [],
messages: [""],
});
});
it("should check that there are no null or undefined values", () => {
expect(
selectColumnOptionsValidation(
[null, { label: "2", value: "1" }],
{} as TableWidgetProps,
_,
),
).toEqual({
isValid: false,
parsed: [],
messages: [
`Invalid entry at index: 0. This value does not evaluate to type: { "label": string | number, "value": string | number | boolean }`,
],
});
});
it("should check that value should be an array of objects", () => {
expect(
selectColumnOptionsValidation([1, 2], {} as TableWidgetProps, _),
).toEqual({
isValid: false,
parsed: [1, 2],
messages: [
`Invalid entry at index: 0. This value does not evaluate to type: { "label": string | number, "value": string | number | boolean }`,
],
});
});
it("should check that each value should have label key", () => {
expect(
selectColumnOptionsValidation(
[{ value: "1" }, { value: "2" }],
{} as TableWidgetProps,
_,
),
).toEqual({
isValid: false,
parsed: [{ value: "1" }, { value: "2" }],
messages: [`Invalid entry at index: 0. Missing required key: label`],
});
});
it("should check that each value should have value key", () => {
expect(
selectColumnOptionsValidation(
[{ label: "1" }, { label: "2" }],
{} as TableWidgetProps,
_,
),
).toEqual({
isValid: false,
parsed: [{ label: "1" }, { label: "2" }],
messages: [`Invalid entry at index: 0. Missing required key: value`],
});
});
it("should check that each value should have unique value", () => {
expect(
selectColumnOptionsValidation(
[
{ label: "1", value: "1" },
{ label: "2", value: "1" },
],
{} as TableWidgetProps,
_,
),
).toEqual({
isValid: false,
parsed: [
{ label: "1", value: "1" },
{ label: "2", value: "1" },
],
messages: [
"Duplicate values found for the following properties, in the array entries, that must be unique -- value.",
],
});
});
it("should check that array of label, value witn invalid values", () => {
expect(
selectColumnOptionsValidation(
[{ label: "1", value: [] }],
{} as TableWidgetProps,
_,
),
).toEqual({
isValid: false,
parsed: [{ label: "1", value: [] }],
messages: [
"Invalid entry at index: 0. value does not evaluate to type string | number | boolean",
],
});
expect(
selectColumnOptionsValidation(
[{ label: true, value: "1" }],
{} as TableWidgetProps,
_,
),
).toEqual({
isValid: false,
parsed: [{ label: true, value: "1" }],
messages: [
"Invalid entry at index: 0. label does not evaluate to type string | number",
],
});
});
it("should check that array of label, value is valid", () => {
expect(
selectColumnOptionsValidation(
[
{ label: "1", value: "1" },
{ label: "2", value: "2" },
],
{} as TableWidgetProps,
_,
),
).toEqual({
isValid: true,
parsed: [
{ label: "1", value: "1" },
{ label: "2", value: "2" },
],
messages: [""],
});
expect(
selectColumnOptionsValidation(
[
{ label: "1", value: 1 },
{ label: "2", value: "2" },
],
{} as TableWidgetProps,
_,
),
).toEqual({
isValid: true,
parsed: [
{ label: "1", value: 1 },
{ label: "2", value: "2" },
],
messages: [""],
});
expect(
selectColumnOptionsValidation(
[
{ label: "1", value: true },
{ label: "2", value: "2" },
],
{} as TableWidgetProps,
_,
),
).toEqual({
isValid: true,
parsed: [
{ label: "1", value: true },
{ label: "2", value: "2" },
],
messages: [""],
});
expect(
selectColumnOptionsValidation(
[
{ label: 1, value: true },
{ label: "2", value: "2" },
],
{} as TableWidgetProps,
_,
),
).toEqual({
isValid: true,
parsed: [
{ label: 1, value: true },
{ label: "2", value: "2" },
],
messages: [""],
});
});
});
describe("- Array of Array of label, values", () => {
it("should check that value should be an array of arrays", () => {
expect(
selectColumnOptionsValidation([[1, 2], 1], {} as TableWidgetProps, _),
).toEqual({
isValid: false,
parsed: [],
messages: [
`This value does not evaluate to type Array<{ "label": string | number, "value": string | number | boolean }>`,
],
});
});
it("should check that value should be an array of arrays of object", () => {
expect(
selectColumnOptionsValidation([[1, 2]], {} as TableWidgetProps, _),
).toEqual({
isValid: false,
parsed: [[1, 2]],
messages: [
`Invalid entry at Row: 0 index: 0. This value does not evaluate to type: { "label": string | number, "value": string | number | boolean }`,
],
});
});
it("should check that each value should have label key", () => {
expect(
selectColumnOptionsValidation(
[[{ value: "1" }, { value: "2" }]],
{} as TableWidgetProps,
_,
),
).toEqual({
isValid: false,
parsed: [[{ value: "1" }, { value: "2" }]],
messages: [
`Invalid entry at Row: 0 index: 0. Missing required key: label`,
],
});
expect(
selectColumnOptionsValidation(
[
[
{ label: "1", value: "1" },
{ label: "2", value: "2" },
],
[{ value: "1" }, { value: "2" }],
],
{} as TableWidgetProps,
_,
),
).toEqual({
isValid: false,
parsed: [
[
{ label: "1", value: "1" },
{ label: "2", value: "2" },
],
[{ value: "1" }, { value: "2" }],
],
messages: [
`Invalid entry at Row: 1 index: 0. Missing required key: label`,
],
});
});
it("should check that each value should have value key", () => {
expect(
selectColumnOptionsValidation(
[[{ label: "1" }, { label: "2" }]],
{} as TableWidgetProps,
_,
),
).toEqual({
isValid: false,
parsed: [[{ label: "1" }, { label: "2" }]],
messages: [
`Invalid entry at Row: 0 index: 0. Missing required key: value`,
],
});
expect(
selectColumnOptionsValidation(
[
[
{ label: "1", value: "1" },
{ label: "2", value: "2" },
],
[{ label: "1" }, { label: "2" }],
],
{} as TableWidgetProps,
_,
),
).toEqual({
isValid: false,
parsed: [
[
{ label: "1", value: "1" },
{ label: "2", value: "2" },
],
[{ label: "1" }, { label: "2" }],
],
messages: [
`Invalid entry at Row: 1 index: 0. Missing required key: value`,
],
});
});
it("should check that each value should have unique value", () => {
expect(
selectColumnOptionsValidation(
[
[
{ label: "1", value: "1" },
{ label: "2", value: "1" },
],
],
{} as TableWidgetProps,
_,
),
).toEqual({
isValid: false,
parsed: [
[
{ label: "1", value: "1" },
{ label: "2", value: "1" },
],
],
messages: [
"Duplicate values found for the following properties, in the array entries, that must be unique -- value.",
],
});
expect(
selectColumnOptionsValidation(
[
[
{ label: "1", value: "1" },
{ label: "2", value: "2" },
],
[
{ label: "1", value: "1" },
{ label: "2", value: "2" },
],
],
{} as TableWidgetProps,
_,
),
).toEqual({
isValid: true,
parsed: [
[
{ label: "1", value: "1" },
{ label: "2", value: "2" },
],
[
{ label: "1", value: "1" },
{ label: "2", value: "2" },
],
],
messages: [""],
});
});
it("should check that array of arrays of label, value is valid", () => {
expect(
selectColumnOptionsValidation(
[
[
{ label: "1", value: "1" },
{ label: "2", value: "2" },
],
[
{ label: "1", value: "1" },
{ label: "2", value: "2" },
],
],
{} as TableWidgetProps,
_,
),
).toEqual({
isValid: true,
parsed: [
[
{ label: "1", value: "1" },
{ label: "2", value: "2" },
],
[
{ label: "1", value: "1" },
{ label: "2", value: "2" },
],
],
messages: [""],
});
});
it("should check that array of JSON is valid", () => {
expect(
selectColumnOptionsValidation(
[
JSON.stringify([
{ label: "1", value: "1" },
{ label: "2", value: "2" },
]),
JSON.stringify([
{ label: "1", value: "1" },
{ label: "2", value: "2" },
]),
],
{} as TableWidgetProps,
_,
),
).toEqual({
isValid: true,
parsed: [
[
{ label: "1", value: "1" },
{ label: "2", value: "2" },
],
[
{ label: "1", value: "1" },
{ label: "2", value: "2" },
],
],
messages: [""],
});
});
});
});
describe("updateCustomColumnAliasOnLabelChange", () => {
it("should return the propertyToUpdate array to update alias for the given custom column", () => {
expect(
updateCustomColumnAliasOnLabelChange(
{} as TableWidgetProps,
"primaryColumns.customColumn1.label",
"customColumn12",
),
).toEqual([
{
propertyPath: "primaryColumns.customColumn1.alias",
propertyValue: "customColumn12",
},
]);
});
it("should not return propertyToUpdate array to update alias for the given column", () => {
expect(
updateCustomColumnAliasOnLabelChange(
{} as TableWidgetProps,
"primaryColumns.resume_url.label",
"customColumn12",
),
).toEqual(undefined);
});
it("should not return the propertyToUpdate array to update alias when any property other than label property of the custom column gets changed", () => {
expect(
updateCustomColumnAliasOnLabelChange(
{} as TableWidgetProps,
"primaryColumns.customColumn1.notlabel",
"customColumn12",
),
).toEqual(undefined);
});
it("should return the propertyToUpdate array to update alias for any given custom column", () => {
expect(
updateCustomColumnAliasOnLabelChange(
{} as TableWidgetProps,
"primaryColumns.customColumn12345.label",
"customColumn12",
),
).toEqual([
{
propertyPath: "primaryColumns.customColumn12345.alias",
propertyValue: "customColumn12",
},
]);
});
});
describe("allowedFirstDayOfWeekRange", () => {
it("should return valid object value is within 0 to 6", () => {
expect(allowedFirstDayOfWeekRange(4)).toEqual({
isValid: true,
parsed: 4,
messages: [],
});
});
it("should return valid object value is within 0 to 6", () => {
expect(allowedFirstDayOfWeekRange(0)).toEqual({
isValid: true,
parsed: 0,
messages: [],
});
});
it("should return invalid object when value is not within 0 to 6", () => {
expect(allowedFirstDayOfWeekRange(8)).toEqual({
isValid: false,
parsed: 0,
messages: ["Number should be between 0-6."],
});
});
it("should return invalid object when value is not within 0 to 6", () => {
expect(allowedFirstDayOfWeekRange(-2)).toEqual({
isValid: false,
parsed: 0,
messages: ["Number should be between 0-6."],
});
});
});