@plone/volto 18.15.1 → 18.16.0

package/CHANGELOG.md

@@ -17,6 +17,17 @@ myst:
 
 <!-- towncrier release notes start -->
 
+## 18.16.0 (2025-05-01)
+
+### Feature
+
+- Rename `vitest.config.ts` to `vitest.config.mjs` for allowing it to be loaded from add-ons. @sneridagh [#7035](https://github.com/plone/volto/issues/7035)
+
+### Bugfix
+
+- Added missing dependency for `sgvo`. Fixed `svgo` library loading in `./vite-plugins/svg.js`. @sneridagh [#7035](https://github.com/plone/volto/issues/7035)
+- Rename `./vite-plugins/svg.js` to proper extension `vite-plugins/svg.mjs`. @sneridagh [#7035](https://github.com/plone/volto/issues/7035)
+
 ## 18.15.1 (2025-04-30)
 
 ### Internal

package/package.json

@@ -9,7 +9,7 @@
     }
   ],
   "license": "MIT",
-  "version": "18.15.1",
+  "version": "18.16.0",
   "repository": {
     "type": "git",
     "url": "git@github.com:plone/volto.git"
@@ -349,6 +349,7 @@
     "stylelint-config-idiomatic-order": "10.0.0",
     "stylelint-prettier": "5.0.0",
     "svg-loader": "0.0.2",
+    "svgo": "^3.0.0",
     "svgo-loader": "3.0.3",
     "terser-webpack-plugin": "5.3.6",
     "tmp": "0.2.1",

package/vite-plugins/{svg.js → svg.mjs}

@@ -52,7 +52,7 @@ export function svgLoader(options = {}) {
 
       const match = content.match(/<svg([^>]+)+>([\s\S]+)<\/svg>/i);
       let attrs = {};
-      // console.log(content);
+
       if (match) {
         attrs = match[1];
         if (attrs) {

package/{vitest.config.ts → vitest.config.mjs}

@@ -1,7 +1,16 @@
 import { defineConfig } from 'vitest/config';
 import react from '@vitejs/plugin-react';
 import path from 'path';
-import { svgLoader } from './vite-plugins/svg.js';
+import { svgLoader } from './vite-plugins/svg.mjs';
+import { fileURLToPath } from 'url';
+import { createRequire } from 'module';
+
+const require = createRequire(import.meta.url);
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+
+const projectRoot = path.resolve(__dirname);
 
 export default defineConfig({
   plugins: [
@@ -10,12 +19,19 @@ export default defineConfig({
       svgoConfig: {
         plugins: [
           {
-            name: 'removeViewBox',
-            active: false,
+            name: 'preset-default',
+            params: {
+              overrides: {
+                convertPathData: false,
+                removeViewBox: false,
+              },
+            },
           },
+          'removeTitle',
+          'removeUselessStrokeAndFill',
         ],
       },
-    }) as any,
+    }),
   ],
   resolve: {
     alias: {
@@ -36,12 +52,12 @@ export default defineConfig({
     globals: true,
     environment: 'jsdom',
     setupFiles: [
-      './test-setup-globals-vitest.js',
-      './test-setup-config.jsx',
-      './jest-setup-afterenv.js',
-      './jest-addons-loader.js',
+      `${projectRoot}/test-setup-globals-vitest.js`,
+      `${projectRoot}/test-setup-config.jsx`,
+      `${projectRoot}/jest-setup-afterenv.js`,
+      `${projectRoot}/jest-addons-loader.js`,
     ],
-    globalSetup: './global-test-setup.js',
+    globalSetup: `${projectRoot}/global-test-setup.js`,
     coverage: {
       provider: 'v8',
       reporter: ['text', 'json', 'html'],

package/src/components/manage/Widgets/FileWidget.test.jsx

@@ -1,123 +0,0 @@
-import React from 'react';
-import { Provider } from 'react-intl-redux';
-import { render, waitFor } from '@testing-library/react';
-import configureStore from 'redux-mock-store';
-import FileWidget from './FileWidget';
-
-vi.spyOn(global.Date, 'now').mockImplementation(() => 1234567890);
-
-const mockStore = configureStore();
-
-const createStore = () =>
-  mockStore({
-    intl: {
-      locale: 'en',
-      messages: {},
-    },
-  });
-
-describe('FileWidget', () => {
-  beforeEach(() => {
-    vi.clearAllTimers();
-    Object.defineProperty(global.Image.prototype, 'complete', {
-      get() {
-        return true;
-      },
-    });
-  });
-
-  afterEach(() => {
-    vi.clearAllMocks();
-  });
-
-  test('renders an empty file widget component', async () => {
-    const store = createStore();
-
-    const { container } = render(
-      <Provider store={store}>
-        <FileWidget
-          id="my-field"
-          title="My field"
-          fieldSet="default"
-          onChange={() => {}}
-        />
-      </Provider>,
-    );
-
-    await waitFor(
-      () => {
-        expect(container.querySelector('.file-widget-dropzone')).toBeTruthy();
-      },
-      { timeout: 1000 },
-    );
-
-    expect(container).toMatchSnapshot();
-  });
-
-  test('renders a file widget component with value', async () => {
-    const store = createStore();
-
-    const { container } = render(
-      <Provider store={store}>
-        <FileWidget
-          id="my-field"
-          title="My field"
-          fieldSet="default"
-          onChange={() => {}}
-          value={{
-            download: 'http://myfile',
-            'content-type': 'image/png',
-            filename: 'myfile',
-            encoding: '',
-          }}
-        />
-      </Provider>,
-    );
-
-    await waitFor(
-      () => {
-        const dropzone = container.querySelector('.file-widget-dropzone');
-        const preview = container.querySelector('.image-preview');
-        const filename = container.querySelector('.field-file-name');
-
-        return dropzone && preview && filename;
-      },
-      { timeout: 1000 },
-    );
-
-    expect(container).toMatchSnapshot();
-  });
-
-  test('renders a file widget component with value in raw data', async () => {
-    const store = createStore();
-
-    const { container } = render(
-      <Provider store={store}>
-        <FileWidget
-          id="my-field"
-          title="My field"
-          fieldSet="default"
-          onChange={() => {}}
-          value={{
-            data: 'oiweurtksdgfjaslfqw9523563456',
-            'content-type': 'image/png',
-            filename: 'myfile',
-            encoding: 'base64',
-          }}
-        />
-      </Provider>,
-    );
-
-    await waitFor(
-      () => {
-        const dropzone = container.querySelector('.file-widget-dropzone');
-        const filename = container.querySelector('.field-file-name');
-
-        return dropzone && filename;
-      },
-      { timeout: 1000 },
-    );
-
-    expect(container).toMatchSnapshot();
-  });
-});