@plone/volto 19.0.0-alpha.3 → 19.0.0-alpha.30

package/src/express-middleware/images.test.js

@@ -0,0 +1,50 @@
+import imagesMiddleware from './images';
+import { getAPIResourceWithAuth } from '@plone/volto/helpers/Api/APIResourceWithAuth';
+
+vi.mock('@plone/volto/helpers/Api/APIResourceWithAuth', () => ({
+  getAPIResourceWithAuth: vi.fn(),
+}));
+
+describe('images middleware', () => {
+  it('handles requests containing @@images and forwards headers/body', async () => {
+    getAPIResourceWithAuth.mockResolvedValue({
+      headers: {
+        'content-type': 'image/png',
+        'cache-status': 'Souin; hit; ttl=664',
+      },
+      body: 'OK',
+    });
+
+    const mw = imagesMiddleware();
+    const layer = mw.stack.find(
+      (l) => l.regexp && l.regexp.source.includes('@@images'),
+    );
+    expect(layer).toBeTruthy();
+
+    const req = {
+      path: '/some/@@images/image',
+      method: 'GET',
+      app: { locals: {} },
+    };
+    const res = {
+      headers: {},
+      set(name, val) {
+        this.headers[name] = val;
+      },
+      send(body) {
+        this.body = body;
+      },
+    };
+
+    // invoke the middleware handler for that layer
+    layer.handle(req, res, (err) => {
+      if (err) throw err;
+    });
+
+    await new Promise(process.nextTick);
+
+    expect(res.body).toBe('OK');
+    expect(res.headers['content-type']).toBe('image/png');
+    expect(res.headers['cache-status']).toBe('Souin; hit; ttl=664');
+  });
+});

package/src/helpers/Api/APIResourceWithAuth.js

@@ -6,6 +6,7 @@
 import superagent from 'superagent';
 import config from '@plone/volto/registry';
 import { addHeadersFactory } from '@plone/volto/helpers/Proxy/Proxy';
+import { stripSubpathPrefix } from '@plone/volto/helpers/Url/Url';
 
 /**
  * Get a resource image/file with authenticated (if token exist) API headers
@@ -16,9 +17,9 @@ import { addHeadersFactory } from '@plone/volto/helpers/Proxy/Proxy';
 export const getAPIResourceWithAuth = (req) =>
   new Promise((resolve, reject) => {
     const { settings } = config;
-    const APISUFIX = settings.legacyTraverse ? '' : '/++api++';
-
+    const apiSuffix = settings.legacyTraverse ? '' : '/++api++';
     let apiPath = '';
+
     if (settings.internalApiPath && __SERVER__) {
       apiPath = settings.internalApiPath;
     } else if (__DEVELOPMENT__ && settings.devProxyToApiPath) {
@@ -26,8 +27,12 @@ export const getAPIResourceWithAuth = (req) =>
     } else {
       apiPath = settings.apiPath;
     }
+
+    //strip subpath if any
+    const contentPath = stripSubpathPrefix(req.path);
+
     const request = superagent
-      .get(`${apiPath}${__DEVELOPMENT__ ? '' : APISUFIX}${req.path}`)
+      .get(`${apiPath}${__DEVELOPMENT__ ? '' : apiSuffix}${contentPath}`)
       .maxResponseSize(settings.maxResponseSize)
       .responseType('blob');
     const authToken = req.universalCookies.get('auth_token');

package/src/helpers/Api/Api.js

@@ -7,7 +7,10 @@ import superagent from 'superagent';
 import Cookies from 'universal-cookie';
 import config from '@plone/volto/registry';
 import { addHeadersFactory } from '@plone/volto/helpers/Proxy/Proxy';
-import { stripQuerystring } from '@plone/volto/helpers/Url/Url';
+import {
+  stripQuerystring,
+  stripSubpathPrefix,
+} from '@plone/volto/helpers/Url/Url';
 
 const methods = ['get', 'post', 'put', 'patch', 'del'];
 
@@ -19,11 +22,10 @@ const methods = ['get', 'post', 'put', 'patch', 'del'];
  */
 export function formatUrl(path) {
   const { settings } = config;
-  const APISUFIX = settings.legacyTraverse ? '' : '/++api++';
+  const apiSuffix = settings.legacyTraverse ? '' : '/++api++';
 
   if (path.startsWith('http://') || path.startsWith('https://')) return path;
 
-  const adjustedPath = path[0] !== '/' ? `/${path}` : path;
   let apiPath = '';
   if (settings.internalApiPath && __SERVER__) {
     apiPath = settings.internalApiPath;
@@ -31,7 +33,8 @@ export function formatUrl(path) {
     apiPath = settings.apiPath;
   }
 
-  return `${apiPath}${APISUFIX}${adjustedPath}`;
+  const contentPath = stripSubpathPrefix(path[0] !== '/' ? `/${path}` : path);
+  return `${apiPath}${apiSuffix}${contentPath}`;
 }
 
 /**

package/src/helpers/AsyncConnect/ssr.js

@@ -1,6 +1,7 @@
 import { matchRoutes } from 'react-router-config';
 import { mapSeries, isPromise } from './utils';
 import { endGlobalLoad } from '@plone/volto/actions/asyncConnect/asyncConnect';
+import { stripSubpathPrefix } from '@plone/volto/helpers/Url/Url';
 
 export function filterComponents(branch) {
   return branch.reduce((result, { route, match }) => {
@@ -18,7 +19,9 @@ export function loadAsyncConnect({
   filter = () => true,
   ...rest
 }) {
-  const layered = filterComponents(matchRoutes(routes, location.pathname));
+  const layered = filterComponents(
+    matchRoutes(routes, stripSubpathPrefix(location.pathname)),
+  );
 
   if (layered.length === 0) {
     return Promise.resolve();

package/src/helpers/AuthToken/AuthToken.js

@@ -5,7 +5,6 @@
 
 import Cookies from 'universal-cookie';
 import jwtDecode from 'jwt-decode';
-
 import { loginRenew } from '@plone/volto/actions/userSession/userSession';
 import { getCookieOptions } from '@plone/volto/helpers/Cookies/cookies';
 import { push } from 'connected-react-router';
@@ -35,7 +34,6 @@ export function persistAuthToken(store, req) {
   } else {
     currentValue = cookies.get('auth_token');
   }
-
   /**
    * handleChange method.
    * @method handleChange
@@ -46,7 +44,6 @@ export function persistAuthToken(store, req) {
     const previousValue = currentValue;
     const state = store.getState();
     currentValue = state.userSession.token;
-
     if (
       module.hot &&
       module.hot.data &&
@@ -55,11 +52,11 @@ export function persistAuthToken(store, req) {
     ) {
       currentValue = previousValue;
     }
-
     if (previousValue !== currentValue || initial) {
       if (!currentValue) {
         if (previousValue) {
           cookies.remove('auth_token', { path: '/' });
+          cookies.remove('__ac', { path: '/' });
         }
       } else {
         if (previousValue !== currentValue) {
@@ -97,11 +94,9 @@ export function persistAuthToken(store, req) {
       }
     }
   }
-
   store.subscribe(handleChange);
   handleChange(true);
 }
-
 if (module?.hot) {
   module.hot.dispose((data) => {
     data.reloaded = true;

package/src/helpers/Blocks/Blocks.js

@@ -80,6 +80,14 @@ export function blockHasValue(data) {
   return check(data);
 }
 
+/**
+ * Block id is valid (not undefined/null or the string "undefined" from object[undefined])
+ * @param {*} id Block id
+ * @return {boolean}
+ */
+const isValidBlockId = (id) =>
+  id != null && id !== 'undefined' && (typeof id !== 'string' || id.length > 0);
+
 /**
  * Get block pairs of [id, block] from content properties
  * @function getBlocks
@@ -89,12 +97,26 @@ export function blockHasValue(data) {
 export const getBlocks = (properties) => {
   const blocksFieldName = getBlocksFieldname(properties);
   const blocksLayoutFieldname = getBlocksLayoutFieldname(properties);
-  return (
-    properties[blocksLayoutFieldname]?.items?.map((n) => [
-      n,
-      properties[blocksFieldName][n],
-    ]) || []
-  );
+  const blocks = properties?.[blocksFieldName];
+  const items = properties?.[blocksLayoutFieldname]?.items;
+  if (!items) return [];
+  return items
+    .filter((n) => isValidBlockId(n))
+    .map((n) => [n, blocks?.[n]])
+    .filter(([, block]) => block != null);
+};
+
+/**
+ * Get layout item IDs that are valid but have no block data (orphaned refs).
+ * @param {Object} properties Content form properties
+ * @return {string[]} IDs that should be removed from layout
+ */
+export const getInvalidBlockLayoutIds = (properties) => {
+  const blocksFieldName = getBlocksFieldname(properties);
+  const blocksLayoutFieldName = getBlocksLayoutFieldname(properties);
+  const blocks = properties?.[blocksFieldName] ?? {};
+  const layoutItems = properties?.[blocksLayoutFieldName]?.items ?? [];
+  return layoutItems.filter((id) => isValidBlockId(id) && blocks[id] == null);
 };
 
 /**
@@ -129,12 +151,28 @@ export function deleteBlock(formData, blockId, intl) {
 
   let newFormData = {
     ...formData,
-    [blocksLayoutFieldname]: {
-      items: without(formData[blocksLayoutFieldname].items, blockId),
-    },
-    [blocksFieldname]: omit(formData[blocksFieldname], [blockId]),
   };
 
+  let container = findParent(newFormData, {
+    blockId,
+  });
+
+  if (container) {
+    container[blocksLayoutFieldname].items = without(
+      container[blocksLayoutFieldname].items,
+      blockId,
+    );
+    container[blocksFieldname] = omit(container[blocksFieldname], [blockId]);
+  } else {
+    newFormData[blocksLayoutFieldname].items = without(
+      newFormData[blocksLayoutFieldname].items,
+      blockId,
+    );
+    newFormData[blocksFieldname] = omit(newFormData[blocksFieldname], [
+      blockId,
+    ]);
+  }
+
   if (newFormData[blocksLayoutFieldname].items.length === 0) {
     newFormData = addBlock(
       newFormData,
@@ -812,12 +850,14 @@ export function findBlocks(blocks = {}, types, result = []) {
 export const getBlocksHierarchy = (properties) => {
   const blocksFieldName = getBlocksFieldname(properties);
   const blocksLayoutFieldname = getBlocksLayoutFieldname(properties);
-  return properties[blocksLayoutFieldname]?.items?.map((n) => ({
+  return properties?.[blocksLayoutFieldname]?.items?.map((n) => ({
     id: n,
-    title: properties[blocksFieldName][n]?.['@type'],
-    data: properties[blocksFieldName][n],
-    children: isBlockContainer(properties[blocksFieldName][n])
-      ? getBlocksHierarchy(properties[blocksFieldName][n])
+    title: properties?.[blocksFieldName]?.[n]?.['@type'],
+    data: properties?.[blocksFieldName]?.[n],
+    children: isBlockContainer(properties?.[blocksFieldName]?.[n])
+      ? properties?.[blocksFieldName]?.[n]?.data
+        ? getBlocksHierarchy(properties?.[blocksFieldName]?.[n]?.data)
+        : getBlocksHierarchy(properties?.[blocksFieldName]?.[n])
       : [],
   }));
 };
@@ -911,8 +951,13 @@ export function moveBlockEnhanced(formData, { source, destination }) {
       const destinationContainer = findContainer(clonedFormData, {
         containerId: destination.parent,
       });
+      const sourceContainer = findContainer(clonedFormData, {
+        containerId: source.parent,
+      });
+
       destinationContainer[blocksFieldName][source.id] =
-        formData[blocksFieldName][source.parent][blocksFieldName][source.id];
+        sourceContainer[blocksFieldName]?.[source.id] ||
+        sourceContainer.data?.[blocksFieldName][source.id];
 
       destinationContainer[blocksLayoutFieldname].items = insertInArray(
         destinationContainer[blocksLayoutFieldname].items,
@@ -921,9 +966,6 @@ export function moveBlockEnhanced(formData, { source, destination }) {
       );
 
       // Remove the source block from the source parent
-      const sourceContainer = findContainer(clonedFormData, {
-        containerId: source.parent,
-      });
       delete sourceContainer[blocksFieldName][source.id];
       sourceContainer[blocksLayoutFieldname].items = removeFromArray(
         sourceContainer[blocksLayoutFieldname].items,
@@ -957,23 +999,25 @@ export function moveBlockEnhanced(formData, { source, destination }) {
  * @returns {object|undefined} - The container object if found, otherwise undefined.
  */
 export const findContainer = (formData, { containerId }) => {
+  const block =
+    formData.blocks[containerId]?.data || formData.blocks[containerId];
   if (
-    formData.blocks[containerId] &&
-    Object.keys(formData.blocks[containerId]).includes('blocks') &&
-    Object.keys(formData.blocks[containerId]).includes('blocks_layout')
+    block &&
+    Object.keys(block).includes('blocks') &&
+    Object.keys(block).includes('blocks_layout')
   ) {
-    return formData.blocks[containerId];
+    return block;
   }
 
   let container;
   Object.keys(formData.blocks).every((blockId) => {
-    const block = formData.blocks[blockId];
+    const subBlock = formData.blocks[blockId].data || formData.blocks[blockId];
     if (
-      formData.blocks[blockId] &&
-      Object.keys(formData.blocks[blockId]).includes('blocks') &&
-      Object.keys(formData.blocks[blockId]).includes('blocks_layout')
+      subBlock &&
+      Object.keys(subBlock).includes('blocks') &&
+      Object.keys(subBlock).includes('blocks_layout')
     ) {
-      container = findContainer(block, { containerId });
+      container = findContainer(subBlock, { containerId });
     }
     if (container) {
       return false;
@@ -985,6 +1029,47 @@ export const findContainer = (formData, { containerId }) => {
   return container;
 };
 
+/**
+ * Finds parent container of the specified blockId in the given formData.
+ *
+ * @param {object} formData - The form data object.
+ * @param {object} options - The options object.
+ * @param {string} options.blockId - The ID of the block to find.
+ * @returns {object|undefined} - The container object if found, otherwise undefined.
+ */
+export const findParent = (formData, { blockId }) => {
+  const block = formData.data || formData;
+
+  if (block && block.blocks && Object.keys(block.blocks).includes(blockId)) {
+    return block;
+  }
+
+  let found = false;
+
+  if (block && block.blocks) {
+    Object.keys(block.blocks).every((subBlockId) => {
+      const subBlock =
+        block.blocks[subBlockId].data || block.blocks[subBlockId];
+      if (subBlock && subBlock.blocks) {
+        if (Object.keys(subBlock.blocks).includes(blockId)) {
+          found = subBlock;
+        }
+        const parent = findParent(subBlock, { blockId });
+        if (parent) {
+          found = parent;
+        }
+      }
+      if (found) {
+        return false;
+      } else {
+        return true;
+      }
+    });
+  }
+
+  return found;
+};
+
 const _dummyIntl = {
   formatMessage() {},
 };

package/src/helpers/Blocks/Blocks.test.js

@@ -7,6 +7,7 @@ import {
   getBlocks,
   getBlocksFieldname,
   getBlocksLayoutFieldname,
+  getInvalidBlockLayoutIds,
   hasBlocksData,
   insertBlock,
   moveBlock,
@@ -482,6 +483,105 @@ describe('Blocks', () => {
         ['a', { value: 1 }],
       ]);
     });
+
+    it('filters out invalid block IDs (null, undefined, string "undefined")', () => {
+      const validBlock = { '@type': 'search', value: 'test' };
+      const result = getBlocks({
+        blocks: {
+          'valid-id-123': validBlock,
+          // These shouldn't exist but test edge case
+          [null]: { '@type': 'invalid' },
+          [undefined]: { '@type': 'invalid' },
+          undefined: { '@type': 'invalid' },
+        },
+        blocks_layout: {
+          items: [
+            'valid-id-123',
+            null, // Invalid: null ID
+            undefined, // Invalid: undefined ID
+            'undefined', // Invalid: string "undefined"
+            'missing-block', // Valid ID but block doesn't exist (filtered by block !== undefined)
+          ],
+        },
+      });
+
+      // Should only return the valid block, filtering out:
+      // - null ID
+      // - undefined ID
+      // - string "undefined" ID
+      // - missing block (block is undefined)
+      expect(result).toStrictEqual([['valid-id-123', validBlock]]);
+      expect(result.length).toBe(1);
+
+      // Verify no invalid IDs in the result
+      const ids = result.map(([id]) => id);
+      expect(ids).not.toContain(null);
+      expect(ids).not.toContain(undefined);
+      expect(ids).not.toContain('undefined');
+    });
+
+    it('filters out invalid block IDs even when blocks object has invalid keys', () => {
+      // Simulate edge case where blocks object has invalid keys
+      const blocks = {
+        'valid-id': { '@type': 'search' },
+      };
+      // JavaScript allows this, creating string keys
+      blocks[null] = { '@type': 'invalid' };
+      blocks[undefined] = { '@type': 'invalid' };
+
+      const result = getBlocks({
+        blocks,
+        blocks_layout: {
+          items: ['valid-id', null, undefined, 'undefined'],
+        },
+      });
+
+      // Should only return valid block
+      expect(result).toStrictEqual([['valid-id', { '@type': 'search' }]]);
+      expect(result.length).toBe(1);
+    });
+  });
+
+  describe('getInvalidBlockLayoutIds', () => {
+    it('returns layout IDs that are valid but have no block data', () => {
+      const result = getInvalidBlockLayoutIds({
+        blocks: {
+          a: { '@type': 'custom', text: 'a' },
+          b: { '@type': 'custom', text: 'b' },
+        },
+        blocks_layout: {
+          items: ['a', 'b', 'MISSING-1', 'MISSING-2'],
+        },
+      });
+      expect(result).toStrictEqual(['MISSING-1', 'MISSING-2']);
+    });
+
+    it('returns empty when all layout items have block data', () => {
+      const result = getInvalidBlockLayoutIds({
+        blocks: { a: { '@type': 'custom' }, b: { '@type': 'custom' } },
+        blocks_layout: { items: ['a', 'b'] },
+      });
+      expect(result).toStrictEqual([]);
+    });
+
+    it('filters out invalid IDs (null, undefined, "undefined")', () => {
+      const result = getInvalidBlockLayoutIds({
+        blocks: {},
+        blocks_layout: {
+          items: [null, undefined, 'undefined', 'valid-missing'],
+        },
+      });
+      expect(result).toStrictEqual(['valid-missing']);
+    });
+
+    it('returns empty when items is missing or empty', () => {
+      expect(
+        getInvalidBlockLayoutIds({ blocks: {}, blocks_layout: {} }),
+      ).toStrictEqual([]);
+      expect(
+        getInvalidBlockLayoutIds({ blocks: {}, blocks_layout: { items: [] } }),
+      ).toStrictEqual([]);
+    });
   });
 
   describe('addBlock', () => {

package/src/helpers/Content/Content.js

@@ -11,6 +11,7 @@ import keys from 'lodash/keys';
 import endsWith from 'lodash/endsWith';
 import find from 'lodash/find';
 import config from '@plone/volto/registry';
+import omit from 'lodash/omit';
 
 /**
  * Nest content.
@@ -85,3 +86,25 @@ export function getLanguageIndependentFields(schema) {
       properties[field]['multilingual_options']?.['language_independent'],
   );
 }
+
+/**
+ * Flattens static behaviors into the parent object with dot-notation keys.
+ * @function flattenStaticBehaviors
+ * @param {Object} result The result object containing static behaviors.
+ * @returns {Object} Result object with flattened static behaviors.
+ */
+export function flattenStaticBehaviors(result) {
+  if (!result['@static_behaviors']) {
+    return result;
+  }
+
+  let flattened = Object.assign({}, result);
+  map(result['@static_behaviors'], (behavior) => {
+    flattened = {
+      ...omit(flattened, behavior),
+      ...mapKeys(flattened[behavior], (value, key) => `${behavior}.${key}`),
+    };
+  });
+
+  return flattened;
+}

package/src/helpers/Content/Content.test.js

@@ -2,6 +2,7 @@ import {
   nestContent,
   getContentIcon,
   getLanguageIndependentFields,
+  flattenStaticBehaviors,
 } from './Content';
 import contentExistingSVG from '@plone/volto/icons/content-existing.svg';
 import linkSVG from '@plone/volto/icons/link.svg';
@@ -96,4 +97,42 @@ describe('Content', () => {
       expect(getLanguageIndependentFields(schema)).toStrictEqual(['lif']);
     });
   });
+
+  describe('flattenStaticBehaviors', () => {
+    it('returns object unchanged when no @static_behaviors', () => {
+      const input = {
+        title: 'Example',
+        creator: 'admin',
+      };
+      expect(flattenStaticBehaviors(input)).toEqual(input);
+    });
+
+    it('flattens static behaviors into dot-notation keys', () => {
+      const input = {
+        title: 'Example',
+        '@static_behaviors': [
+          'guillotina_cms.interfaces.blocks.IBlocks',
+          'guillotina_cms.interfaces.dublin_core.IDublinCore',
+        ],
+        'guillotina_cms.interfaces.blocks.IBlocks': {
+          blocks: 'blocks',
+          blocks_layout: 'blocks_layout',
+        },
+        'guillotina_cms.interfaces.dublin_core.IDublinCore': {
+          creator: 'creator',
+        },
+      };
+      expect(flattenStaticBehaviors(input)).toEqual({
+        title: 'Example',
+        '@static_behaviors': [
+          'guillotina_cms.interfaces.blocks.IBlocks',
+          'guillotina_cms.interfaces.dublin_core.IDublinCore',
+        ],
+        'guillotina_cms.interfaces.blocks.IBlocks.blocks': 'blocks',
+        'guillotina_cms.interfaces.blocks.IBlocks.blocks_layout':
+          'blocks_layout',
+        'guillotina_cms.interfaces.dublin_core.IDublinCore.creator': 'creator',
+      });
+    });
+  });
 });

package/src/helpers/Content/withClientSideContent.jsx

@@ -0,0 +1,35 @@
+/*
+This is a HOC for use with the volto Edit component.
+It makes sure that we fetch the content from the API on the client side
+when the Edit component is mounted, if there is an internalApiPath
+that is different from the public API path. Otherwise we might end up
+saving backend API paths back to the server.
+
+It's admittedly a bit of a workaround.
+Ideally the volto SSR should produce correct URLs
+so that we don't have to do this on the client side.
+But, that requires refactoring that won't happen quickly...
+*/
+
+import { useEffect } from 'react';
+import { useDispatch, useSelector } from 'react-redux';
+import hoistNonReactStatics from 'hoist-non-react-statics';
+import config from '@plone/volto/registry';
+import { getContent } from '@plone/volto/actions/content/content';
+
+export default function withClientSideContent(WrappedComponent) {
+  function WithClientSideContent(props) {
+    const { internalApiPath } = config.settings;
+    const dispatch = useDispatch();
+    const content = useSelector((state) => state.content);
+    const id = content.data?.['@id'];
+    useEffect(() => {
+      if (internalApiPath && id?.startsWith(internalApiPath)) {
+        dispatch(getContent(id.substring(internalApiPath.length)));
+      }
+    }, [internalApiPath, dispatch, id]);
+    return <WrappedComponent {...props} />;
+  }
+
+  return hoistNonReactStatics(WithClientSideContent, WrappedComponent);
+}

package/src/helpers/Extensions/withBlockSchemaEnhancer.jsx

@@ -305,8 +305,11 @@ export const EMPTY_STYLES_SCHEMA = {
 
 /**
  * Adds the `styles` field and 'styling' fieldset in a given schema
+ * @param {object} params Helper params
+ * @param {import('@plone/types').JSONSchema} params.schema Schema to enhance
+ * @param {import('react-intl').IntlShape} params.intl intl helper for translations
  */
-export const addStyling = ({ schema, formData, intl }) => {
+export const addStyling = ({ schema, intl }) => {
   if (isEmpty(find(schema.fieldsets, { id: 'styling' }))) {
     schema.fieldsets.push({
       id: 'styling',

package/src/helpers/FormValidation/FormValidation.test.js

@@ -8,6 +8,12 @@ const schema = {
     username: { title: 'Username', type: 'string', description: '' },
     email: { title: 'Email', type: 'string', widget: 'email', description: '' },
     url: { title: 'url', type: 'string', widget: 'url', description: '' },
+    file: {
+      title: 'file',
+      type: 'object',
+      description: '',
+      size: 5,
+    },
   },
   fieldsets: [
     { id: 'default', title: 'FIXME: User Data', fields: ['username'] },
@@ -181,6 +187,31 @@ describe('FormValidation', () => {
       ).toEqual({});
     });
 
+    it('file - validates invalid size', () => {
+      const validationErrorMessages = [messages.maxSize.defaultMessage];
+      validationErrorMessages.title = 'file';
+
+      expect(
+        FormValidation.validateFieldsPerFieldset({
+          schema,
+          formData: { ...formData, file: { size: 10 } },
+          formatMessage,
+        }),
+      ).toEqual({
+        file: validationErrorMessages,
+      });
+    });
+
+    it('file - validates size', () => {
+      expect(
+        FormValidation.validateFieldsPerFieldset({
+          schema,
+          formData: { ...formData, file: { size: 1 } },
+          formatMessage,
+        }),
+      ).toEqual({});
+    });
+
     it('widget - validator from block - Fails', () => {
       let newSchema = {
         properties: {