@wordpress/dataviews 9.1.1-next.f56bd8138.0 → 10.0.1-next.47f435fc9.0

package/src/test/normalize-form-fields.ts

@@ -1,7 +1,7 @@
 /**
  * Internal dependencies
  */
-import normalizeFormFields from '../normalize-form-fields';
+import normalizeFormFields from '../dataform-layouts/normalize-form-fields';
 import type { Form } from '../types';
 
 describe( 'normalizeFormFields', () => {
@@ -104,6 +104,7 @@ describe( 'normalizeFormFields', () => {
 						type: 'panel',
 						labelPosition: 'side',
 						openAs: 'dropdown',
+						summary: [],
 					},
 				},
 			] );
@@ -122,6 +123,7 @@ describe( 'normalizeFormFields', () => {
 						type: 'panel',
 						labelPosition: 'top',
 						openAs: 'dropdown',
+						summary: [],
 					},
 				},
 			] );
@@ -140,15 +142,22 @@ describe( 'normalizeFormFields', () => {
 						type: 'card',
 						withHeader: true,
 						isOpened: true,
+						summary: [],
 					},
 				},
 			] );
 		} );
 
-		it( 'card: enforces isOpened=true when withHeader=false', () => {
+		it( 'card: enforces isOpened=true and summary=[] when withHeader=false', () => {
 			const form: Form = {
 				// @ts-ignore - Test intentionally uses invalid type to verify runtime behavior.
-				layout: { type: 'card', withHeader: false, isOpened: false },
+				layout: {
+					type: 'card',
+					withHeader: false,
+					// @ts-ignore - Test intentionally uses invalid type to verify runtime behavior.
+					isOpened: false,
+					summary: [ { id: 'field1', visibility: 'always' } ],
+				},
 				fields: [ 'field1' ],
 			};
 			const result = normalizeFormFields( form );
@@ -159,14 +168,47 @@ describe( 'normalizeFormFields', () => {
 						type: 'card',
 						withHeader: false,
 						isOpened: true,
+						summary: [],
 					},
 				},
 			] );
 		} );
 
-		it( 'card: respects isOpened when withHeader=true', () => {
+		it( 'card: respects isOpened and summary when withHeader=true', () => {
 			const form: Form = {
-				layout: { type: 'card', withHeader: true, isOpened: false },
+				layout: {
+					type: 'card',
+					withHeader: true,
+					isOpened: false,
+					summary: [ { id: 'field1', visibility: 'always' } ],
+				},
+				fields: [ 'field1' ],
+			};
+			const result = normalizeFormFields( form );
+			expect( result ).toEqual( [
+				{
+					id: 'field1',
+					layout: {
+						type: 'card',
+						withHeader: true,
+						isOpened: false,
+						summary: [ { id: 'field1', visibility: 'always' } ],
+					},
+				},
+			] );
+		} );
+
+		it( 'card: normalizes summary to array of objects when it is a string', () => {
+			const form: Form = {
+				layout: {
+					type: 'card',
+					withHeader: true,
+					isOpened: false,
+					summary: [
+						'field2',
+						{ id: 'field1', visibility: 'always' },
+					],
+				},
 				fields: [ 'field1' ],
 			};
 			const result = normalizeFormFields( form );
@@ -177,6 +219,10 @@ describe( 'normalizeFormFields', () => {
 						type: 'card',
 						withHeader: true,
 						isOpened: false,
+						summary: [
+							{ id: 'field2', visibility: 'when-collapsed' },
+							{ id: 'field1', visibility: 'always' },
+						],
 					},
 				},
 			] );
@@ -207,6 +253,7 @@ describe( 'normalizeFormFields', () => {
 						type: 'panel',
 						labelPosition: 'side',
 						openAs: 'dropdown',
+						summary: [],
 					},
 				},
 			] );
@@ -231,6 +278,7 @@ describe( 'normalizeFormFields', () => {
 						type: 'card',
 						withHeader: false,
 						isOpened: true,
+						summary: [],
 					},
 				},
 				{
@@ -239,6 +287,7 @@ describe( 'normalizeFormFields', () => {
 						type: 'card',
 						withHeader: true,
 						isOpened: false,
+						summary: [],
 					},
 				},
 			] );

package/src/test/validation.ts

@@ -1,11 +1,11 @@
 /**
  * Internal dependencies
  */
-import { isItemValid } from '../validation';
+import isItemValid from '../utils/is-item-valid';
 import type { Field } from '../types';
 
 describe( 'validation', () => {
-	it( 'fields not visible in form are not validated', () => {
+	it( 'operates on form fields', () => {
 		const item = { id: 1, valid_order: 2, invalid_order: 'd' };
 		const fields: Field< {} >[] = [
 			{
@@ -22,83 +22,7 @@ describe( 'validation', () => {
 		expect( result ).toBe( true );
 	} );
 
-	it( 'integer field is valid if value is integer', () => {
-		const item = { id: 1, order: 2, title: 'hi' };
-		const fields: Field< {} >[] = [
-			{
-				type: 'integer',
-				id: 'order',
-			},
-		];
-		const form = { fields: [ 'order' ] };
-		const result = isItemValid( item, fields, form );
-		expect( result ).toBe( true );
-	} );
-
-	it( 'integer field is invalid if value is not integer when not empty', () => {
-		const item = { id: 1, order: 'd' };
-		const fields: Field< {} >[] = [
-			{
-				id: 'order',
-				type: 'integer',
-			},
-		];
-		const form = { fields: [ 'order' ] };
-		const result = isItemValid( item, fields, form );
-		expect( result ).toBe( false );
-	} );
-
-	it( 'integer field is invalid if value is not one of the elements', () => {
-		const item = { id: 1, author: 3 };
-		const fields: Field< {} >[] = [
-			{
-				id: 'author',
-				type: 'integer',
-				elements: [
-					{ value: 1, label: 'Jane' },
-					{ value: 2, label: 'John' },
-				],
-			},
-		];
-		const form = { fields: [ 'author' ] };
-		const result = isItemValid( item, fields, form );
-		expect( result ).toBe( false );
-	} );
-
-	it( 'text field is invalid if value is not one of the elements', () => {
-		const item = { id: 1, author: 'not-in-elements' };
-		const fields: Field< {} >[] = [
-			{
-				id: 'author',
-				type: 'text',
-				elements: [
-					{ value: 'jane', label: 'Jane' },
-					{ value: 'john', label: 'John' },
-				],
-			},
-		];
-		const form = { fields: [ 'author' ] };
-		const result = isItemValid( item, fields, form );
-		expect( result ).toBe( false );
-	} );
-
-	it( 'untyped field is invalid if value is not one of the elements', () => {
-		const item = { id: 1, author: 'not-in-elements' };
-		const fields: Field< {} >[] = [
-			{
-				id: 'author',
-				elements: [
-					{ value: 'jane', label: 'Jane' },
-					{ value: 'john', label: 'John' },
-				],
-			},
-		];
-		const form = { fields: [ 'author' ] };
-		const result = isItemValid( item, fields, form );
-		expect( result ).toBe( false );
-	} );
-
-	it( 'fields can provide its own isValid function', () => {
+	it( 'fields can override the defaults', () => {
 		const item = { id: 1, order: 'd' };
 		const fields: Field< {} >[] = [
 			{
@@ -109,6 +33,7 @@ describe( 'validation', () => {
 					{ value: 'b', label: 'B' },
 				],
 				isValid: {
+					elements: false,
 					custom: () => null, // Overrides the validation provided for integer types.
 				},
 			},
@@ -118,194 +43,279 @@ describe( 'validation', () => {
 		expect( result ).toBe( true );
 	} );
 
-	it( 'array field is invalid when required but empty', () => {
-		const item = { id: 1, tags: [] };
-		const fields: Field< {} >[] = [
-			{
-				id: 'tags',
-				type: 'array',
-				isValid: {
-					required: true,
+	describe( 'isValid.required', () => {
+		it( 'array is invalid when required but empty', () => {
+			const item = { id: 1, tags: [] };
+			const fields: Field< {} >[] = [
+				{
+					id: 'tags',
+					type: 'array',
+					isValid: {
+						required: true,
+					},
 				},
-			},
-		];
-		const form = { fields: [ 'tags' ] };
-		const result = isItemValid( item, fields, form );
-		expect( result ).toBe( false );
-	} );
+			];
+			const form = { fields: [ 'tags' ] };
+			const result = isItemValid( item, fields, form );
+			expect( result ).toBe( false );
+		} );
 
-	it( 'array field is invalid when required but not an array', () => {
-		const item = { id: 1, tags: null };
-		const fields: Field< {} >[] = [
-			{
-				id: 'tags',
-				type: 'array',
-				isValid: {
-					required: true,
+		it( 'array is invalid when required but not an array', () => {
+			const item = { id: 1, tags: null };
+			const fields: Field< {} >[] = [
+				{
+					id: 'tags',
+					type: 'array',
+					isValid: {
+						required: true,
+					},
 				},
-			},
-		];
-		const form = { fields: [ 'tags' ] };
-		const result = isItemValid( item, fields, form );
-		expect( result ).toBe( false );
-	} );
+			];
+			const form = { fields: [ 'tags' ] };
+			const result = isItemValid( item, fields, form );
+			expect( result ).toBe( false );
+		} );
 
-	it( 'array field is valid when required and has values', () => {
-		const item = { id: 1, tags: [ 'tag1', 'tag2' ] };
-		const fields: Field< {} >[] = [
-			{
-				id: 'tags',
-				type: 'array',
-				isValid: {
-					required: true,
+		it( 'array is valid when required and has values', () => {
+			const item = { id: 1, tags: [ 'tag1', 'tag2' ] };
+			const fields: Field< {} >[] = [
+				{
+					id: 'tags',
+					type: 'array',
+					isValid: {
+						required: true,
+					},
 				},
-			},
-		];
-		const form = { fields: [ 'tags' ] };
-		const result = isItemValid( item, fields, form );
-		expect( result ).toBe( true );
+			];
+			const form = { fields: [ 'tags' ] };
+			const result = isItemValid( item, fields, form );
+			expect( result ).toBe( true );
+		} );
 	} );
 
-	it( 'text field with isValid.elements validates against elements', () => {
-		const item = { id: 1, status: 'published' };
-		const fields: Field< {} >[] = [
-			{
-				id: 'status',
-				type: 'text',
-				elements: [
-					{ value: 'draft', label: 'Draft' },
-					{ value: 'published', label: 'Published' },
-				],
-				isValid: {
-					elements: true,
+	describe( 'isValid.elements', () => {
+		it( 'untyped is invalid if value is not one of the elements', () => {
+			const item = { id: 1, author: 'not-in-elements' };
+			const fields: Field< {} >[] = [
+				{
+					id: 'author',
+					elements: [
+						{ value: 'jane', label: 'Jane' },
+						{ value: 'john', label: 'John' },
+					],
 				},
-			},
-		];
-		const form = { fields: [ 'status' ] };
-		const result = isItemValid( item, fields, form );
-		expect( result ).toBe( true );
-	} );
+			];
+			const form = { fields: [ 'author' ] };
+			const result = isItemValid( item, fields, form );
+			expect( result ).toBe( false );
+		} );
 
-	it( 'text field with isValid.elements rejects invalid values', () => {
-		const item = { id: 1, status: 'invalid-status' };
-		const fields: Field< {} >[] = [
-			{
-				id: 'status',
-				type: 'text',
-				elements: [
-					{ value: 'draft', label: 'Draft' },
-					{ value: 'published', label: 'Published' },
-				],
-				isValid: {
-					elements: true,
+		it( 'text is valid when value is one of the elements', () => {
+			const item = { id: 1, status: 'published' };
+			const fields: Field< {} >[] = [
+				{
+					id: 'status',
+					type: 'text',
+					elements: [
+						{ value: 'draft', label: 'Draft' },
+						{ value: 'published', label: 'Published' },
+					],
+					isValid: {
+						elements: true,
+					},
 				},
-			},
-		];
-		const form = { fields: [ 'status' ] };
-		const result = isItemValid( item, fields, form );
-		expect( result ).toBe( false );
+			];
+			const form = { fields: [ 'status' ] };
+			const result = isItemValid( item, fields, form );
+			expect( result ).toBe( true );
+		} );
+
+		it( 'text is invalid when value is not one of the elements', () => {
+			const item = { id: 1, status: 'invalid-status' };
+			const fields: Field< {} >[] = [
+				{
+					id: 'status',
+					type: 'text',
+					elements: [
+						{ value: 'draft', label: 'Draft' },
+						{ value: 'published', label: 'Published' },
+					],
+					isValid: {
+						elements: true,
+					},
+				},
+			];
+			const form = { fields: [ 'status' ] };
+			const result = isItemValid( item, fields, form );
+			expect( result ).toBe( false );
+		} );
+
+		it( 'integer is valid when value is one of the elements', () => {
+			const item = { id: 1, priority: 2 };
+			const fields: Field< {} >[] = [
+				{
+					id: 'priority',
+					type: 'integer',
+					elements: [
+						{ value: 1, label: 'Low' },
+						{ value: 2, label: 'Medium' },
+						{ value: 3, label: 'High' },
+					],
+					isValid: {
+						elements: true,
+					},
+				},
+			];
+			const form = { fields: [ 'priority' ] };
+			const result = isItemValid( item, fields, form );
+			expect( result ).toBe( true );
+		} );
+
+		it( 'integer is invalid when value is not one of the elements', () => {
+			const item = { id: 1, priority: 5 };
+			const fields: Field< {} >[] = [
+				{
+					id: 'priority',
+					type: 'integer',
+					elements: [
+						{ value: 1, label: 'Low' },
+						{ value: 2, label: 'Medium' },
+						{ value: 3, label: 'High' },
+					],
+					isValid: {
+						elements: true,
+					},
+				},
+			];
+			const form = { fields: [ 'priority' ] };
+			const result = isItemValid( item, fields, form );
+			expect( result ).toBe( false );
+		} );
+
+		it( 'number is invalid if value is not one of the elements', () => {
+			const item = { id: 1, price: 4.5 };
+			const fields: Field< {} >[] = [
+				{
+					id: 'price',
+					type: 'number',
+					elements: [
+						{ value: 1.5, label: 'Bronze' },
+						{ value: 2.5, label: 'Silver' },
+					],
+				},
+			];
+			const form = { fields: [ 'price' ] };
+			const result = isItemValid( item, fields, form );
+			expect( result ).toBe( false );
+		} );
+
+		it( 'array is valid if all items are part of the elements', () => {
+			const item = { id: 1, tags: [ 'red', 'blue' ] };
+			const fields: Field< {} >[] = [
+				{
+					id: 'tags',
+					type: 'array',
+					elements: [
+						{ value: 'red', label: 'Red' },
+						{ value: 'blue', label: 'Blue' },
+						{ value: 'green', label: 'Green' },
+					],
+				},
+			];
+			const form = { fields: [ 'tags' ] };
+			const result = isItemValid( item, fields, form );
+			expect( result ).toBe( true );
+		} );
+
+		it( 'array is invalid when not all items are part of the elements', () => {
+			const item = { id: 1, tags: [ 'red', 'yellow' ] };
+			const fields: Field< {} >[] = [
+				{
+					id: 'tags',
+					type: 'array',
+					elements: [
+						{ value: 'red', label: 'Red' },
+						{ value: 'blue', label: 'Blue' },
+						{ value: 'green', label: 'Green' },
+					],
+				},
+			];
+			const form = { fields: [ 'tags' ] };
+			const result = isItemValid( item, fields, form );
+			expect( result ).toBe( false );
+		} );
+
+		it( 'array is invalid when value is not an array', () => {
+			const item = { id: 1, tags: 'not-an-array' };
+			const fields: Field< {} >[] = [
+				{
+					id: 'tags',
+					type: 'array',
+					elements: [
+						{ value: 'red', label: 'Red' },
+						{ value: 'blue', label: 'Blue' },
+					],
+					isValid: {
+						custom: () => null, // Disable to make sure the only validation triggered is elements
+					},
+				},
+			];
+			const form = { fields: [ 'tags' ] };
+			const result = isItemValid( item, fields, form );
+			expect( result ).toBe( false );
+		} );
 	} );
+} );
 
-	it( 'integer field with isValid.elements validates against elements', () => {
-		const item = { id: 1, priority: 2 };
+describe( 'isValid.custom', () => {
+	it( 'integer is valid if value is integer', () => {
+		const item = { id: 1, order: 2, title: 'hi' };
 		const fields: Field< {} >[] = [
 			{
-				id: 'priority',
 				type: 'integer',
-				elements: [
-					{ value: 1, label: 'Low' },
-					{ value: 2, label: 'Medium' },
-					{ value: 3, label: 'High' },
-				],
-				isValid: {
-					elements: true,
-				},
+				id: 'order',
 			},
 		];
-		const form = { fields: [ 'priority' ] };
+		const form = { fields: [ 'order' ] };
 		const result = isItemValid( item, fields, form );
 		expect( result ).toBe( true );
 	} );
 
-	it( 'integer field with isValid.elements rejects invalid values', () => {
-		const item = { id: 1, priority: 5 };
+	it( 'integer is invalid if value is not integer when not empty', () => {
+		const item = { id: 1, order: 'd' };
 		const fields: Field< {} >[] = [
 			{
-				id: 'priority',
+				id: 'order',
 				type: 'integer',
-				elements: [
-					{ value: 1, label: 'Low' },
-					{ value: 2, label: 'Medium' },
-					{ value: 3, label: 'High' },
-				],
-				isValid: {
-					elements: true,
-				},
 			},
 		];
-		const form = { fields: [ 'priority' ] };
+		const form = { fields: [ 'order' ] };
 		const result = isItemValid( item, fields, form );
 		expect( result ).toBe( false );
 	} );
 
-	it( 'array field with isValid.elements validates all items against elements', () => {
-		const item = { id: 1, tags: [ 'red', 'blue' ] };
+	it( 'number is valid if value is finite', () => {
+		const item = { id: 1, price: 2.5 };
 		const fields: Field< {} >[] = [
 			{
-				id: 'tags',
-				type: 'array',
-				elements: [
-					{ value: 'red', label: 'Red' },
-					{ value: 'blue', label: 'Blue' },
-					{ value: 'green', label: 'Green' },
-				],
-				isValid: {
-					elements: true,
-				},
+				id: 'price',
+				type: 'number',
 			},
 		];
-		const form = { fields: [ 'tags' ] };
+		const form = { fields: [ 'price' ] };
 		const result = isItemValid( item, fields, form );
 		expect( result ).toBe( true );
 	} );
 
-	it( 'array field with isValid.elements rejects arrays with invalid items', () => {
-		const item = { id: 1, tags: [ 'red', 'yellow' ] };
-		const fields: Field< {} >[] = [
-			{
-				id: 'tags',
-				type: 'array',
-				elements: [
-					{ value: 'red', label: 'Red' },
-					{ value: 'blue', label: 'Blue' },
-					{ value: 'green', label: 'Green' },
-				],
-				isValid: {
-					elements: true,
-				},
-			},
-		];
-		const form = { fields: [ 'tags' ] };
-		const result = isItemValid( item, fields, form );
-		expect( result ).toBe( false );
-	} );
-
-	it( 'array field with isValid.elements handles non-array values', () => {
-		const item = { id: 1, tags: 'not-an-array' };
+	it( 'number is invalid if value is not finite when not empty', () => {
+		const item = { id: 1, price: Number.NaN };
 		const fields: Field< {} >[] = [
 			{
-				id: 'tags',
-				type: 'array',
-				elements: [
-					{ value: 'red', label: 'Red' },
-					{ value: 'blue', label: 'Blue' },
-				],
-				isValid: {
-					elements: true,
-				},
+				id: 'price',
+				type: 'number',
 			},
 		];
-		const form = { fields: [ 'tags' ] };
+		const form = { fields: [ 'price' ] };
 		const result = isItemValid( item, fields, form );
 		expect( result ).toBe( false );
 	} );