Merge branch 'main' into pro-8052-render-widget

* main:
  PRO-8130: default node parseHTML now detects whether an element has the relevant class, or lack of one, before classifying it as a default node (#5017)
  Add regression tests for duplicate relationships resolution in some edge cases (#5016)
  Resolved an issue affecting `withRelationships` with two or more steps. This issue could cause a document to appear to be related to the same document more than on (#5015)
  thanks! (#5014)
  Fix #4979: Replace connect-multiparty with multer to resolve security vulnerability (#5013)
  Hide rich text controls on interaction (#5008)

Author: haroun

CHANGELOG.md

@@ -9,13 +9,21 @@
 
 ### Changes
 
-- Changes handling of `order` and `groups` in the `admin-bar` module to respect, rather that reverse, the order of items
+* Changes handling of `order` and `groups` in the `admin-bar` module to respect, rather that reverse, the order of items
+* Interacting with the text inside a rich text widget will hide the widget controls to prevent awkawrd text selection.
 
 ### Fixes
 
 * Let the `@apostrophecms/page:unpark` task unpark all parked pages with the given slug, not just the first one.
 * Exclude unknown page types from the page manager.
 * Remove multiple calls to render-widget when switch to edit mode.
+* Resolved an issue affecting `withRelationships` with two or more steps. This issue could cause a document to appear to be related to the same document more than once.
+* Fixed a regression that prevented multiple variations of `p` with different classes from being recognized again when reopening the rich text editor, even if they are all on the style menu. This was caused by knock-on effects of upstream changes in tiptap and prosemirror and our previous efforts to mitigate these. Those upstream changes were correct, but they did have certain side effects in ApostropheCMS. By more fully specifying the desired behavior, we have now fully corrected the issue at the ApostropheCMS level.
+
+### Security
+
+* Clear an npm audit warning by replacing `connect-multiparty` with `multer`. Thanks to [Radhakrishnan Mohan](https://github.com/RadhaKrishnan) for this contribution.
+* To be clear, this was never an actual security vulnerability. The CVE in question is disputed, and for good reasons. However, since `connect-multiparty` is no longer maintained, it makes sense to move to `multer`.
 
 ## 4.19.0 (2025-07-09)
 
@@ -25,8 +33,8 @@
   Thanks to [sombitganguly](https://github.com/sombitganguly) for this contribution.
 * Adds keyboard shortcuts for manipulating widgets in areas. Includes Cut, Copy, Paste, Delete, and Duplicate.
 * Automatic translation now supports a disclaimer and an help text for the checkbox. You can now set the disclaimer by setting `automaticTranslationDisclaimer` `i18n` key and the help text by setting `automaticTranslationCheckboxHelp` `i18n` key.
-* Adds dynamic choices working with piece manager filters. 
-* Allow `import.imageTags` (array of image tag IDs) to be passed to the rich text widget when importing (see https://docs.apostrophecms.org/reference/api/rich-text.html#importing-inline-images).
+* Adds dynamic choices working with piece manager filters.
+* Allow `import.imageTags` (array of image tag IDs) to be passed to the rich text widget when importing (see <https://docs.apostrophecms.org/reference/api/rich-text.html#importing-inline-images>).
 * Adds a new way to make `GET` requests with a large query string. It can become a `POST` request containing the key `__aposGetWithQuery` in its body.
 A middleware checks for this key and converts the request back to a `GET` request with the right `req.query` property.
 * Adds a new batch operation to tag images.
@@ -46,7 +54,7 @@ A middleware checks for this key and converts the request back to a `GET` reques
 
 * Adds MongoDB-style support (comparison operators) for conditional fields and all systems that use conditions. Conditional fields now have access to the `following` values from the parent schema fields.
 * Add `followingIgnore` option to the `string` field schema. A boolean `true` results in all `following` values being ignored (not attempted to be used as a value for the field). When array of strings, the UI will ignore every item that matches a `following` field name.
-* Adds link configuration to the `@apostrophecms/image-widget` UI and a new option `linkWithType` to control what document types can be linked to. Opt-out of the widget inline styles (reset) by setting `inlineStyles: false` in the widget configuration or contextual options (area). 
+* Adds link configuration to the `@apostrophecms/image-widget` UI and a new option `linkWithType` to control what document types can be linked to. Opt-out of the widget inline styles (reset) by setting `inlineStyles: false` in the widget configuration or contextual options (area).
 * Use the link configuration of the Rich Text widget for image links too. It respects the existing `linkWithType` Rich Text option and uses the same schema (`linkFields`) used for text links. The fields from that schema can opt-in for specific tiptap extension now via a field property `extensions` (array) with possible array values `Link` and/or `Image`. You still need to specify the `htmlAttribute` property (the name of the attribute to be added to the link tag) in the schema when adding more fields. If the `extensions` property is not set, the field will be applied for both tiptap extensions.
 * Adds body style support for breakpoint preview mode. Created new `[data-apos-refreshable-body]` div inside the container during breapoint preview.
 Switch body attributes to this new div to keep supporting body styles in breakpoint preview mode.
@@ -2392,6 +2400,7 @@ myColorField: {
 ## 3.0.0-beta.3.1 - 2021-06-07
 
 ### Breaks
+
 * This backwards compatibility break actually occurred in 3.0.0-beta.3 and was not documented at that time, but it is important to know that the following Rich Text tool names have been updated to match Tiptap2's convention:
 -- `bullet_list` -> `bulletList`
 -- `ordered_list` -> `orderedList`
@@ -2478,6 +2487,7 @@ The `nlbr` and `nlp` Nunjucks filters marked their output as safe to preserve th
 * The rich text editor now supports specifying a `styles` array with no `p` tags properly. A newly added rich text widget initially contains an element with the first style, rather than always a paragraph. If no styles are configured, a `p` tag is assumed. Thanks to Stepan Jakl for reporting the issue.
 
 ### Changes
+
 * Editor modal's Save button (publish / save draft / submit) now updated to use the `AposSplitButton` component. Editors can choose from several follow-up actions that occur after save, including creating another piece of content of the same type, being taken to the in-context version of the document, or being returned to the manager. Editor's selection is saved in localstorage, creating a remembered preference per content type.
 
 ## 3.0.0-beta.1.1 - 2021-05-07

modules/@apostrophecms/area/ui/apos/components/AposAreaWidget.vue

@@ -25,7 +25,10 @@
         class="apos-area-widget-controls apos-area-widget__label"
         :class="labelsClasses"
       >
-        <ol class="apos-area-widget__breadcrumbs">
+        <ol
+          class="apos-area-widget__breadcrumbs"
+          @click="isSuppressingWidgetControls = false"
+        >
           <li
             class="
               apos-area-widget__breadcrumb
@@ -135,6 +138,7 @@
         :doc-id="docId"
         :focused="isFocused"
         @update="$emit('update', $event)"
+        @suppress-widget-controls="isSuppressingWidgetControls = true"
       />
       <component
         :is="widgetComponent(widget.type)"
@@ -285,12 +289,14 @@ export default {
       mounted: false, // hack around needing DOM to be rendered for computed classes
       isSuppressed: false,
       menuOpen: null,
+      isSuppressingWidgetControls: false,
       classes: {
         show: 'apos-is-visible',
         open: 'apos-is-open',
         focus: 'apos-is-focused',
         highlight: 'apos-is-highlighted',
-        adjust: 'apos-is-ui-adjusted'
+        adjust: 'apos-is-ui-adjusted',
+        suppressWidgetControls: 'apos-is-suppressing-widget-controls'
       },
       breadcrumbs: {
         $lastEl: null,
@@ -362,7 +368,8 @@ export default {
     },
     controlsClasses() {
       return {
-        [this.classes.show]: this.isFocused
+        [this.classes.show]: this.isFocused,
+        [this.classes.suppressWidgetControls]: this.isSuppressingWidgetControls
       };
     },
     containerClasses() {
@@ -398,6 +405,7 @@ export default {
       } else {
         this.menuOpen = null;
         this.$refs.wrapper.removeEventListener('keydown', this.handleKeyboardUnfocus);
+        this.isSuppressingWidgetControls = false;
       }
     }
   },
@@ -881,7 +889,7 @@ export default {
     }
   }
 
-  .apos-is-visible,
+  .apos-is-visible:not(.apos-is-suppressing-widget-controls),
   .apos-is-focused {
     opacity: 1;
     pointer-events: auto;

modules/@apostrophecms/attachment/index.js

@@ -159,12 +159,11 @@ module.exports = {
       post: {
         upload: [
           self.canUpload,
-          require('connect-multiparty')(),
+          require('multer')({ dest: require('os').tmpdir() }).single('file'),
           async function (req) {
             try {
-              // The name attribute could be anything because of how fileupload
-              // controls work; we don't really care.
-              const file = Object.values(req.files || {})[0];
+              // The file comes from multer middleware
+              const file = req.file;
 
               if (!file) {
                 throw self.apos.error('invalid');
@@ -175,11 +174,11 @@ module.exports = {
 
               return attachment;
             } finally {
-              for (const file of (Object.values(req.files || {}))) {
+              if (req.file) {
                 try {
-                  fs.unlinkSync(file.path);
+                  fs.unlinkSync(req.file.path);
                 } catch (e) {
-                  self.apos.util.warn(`Uploaded temporary file ${file.path} was already removed, this should have been the responsibility of the upload route`);
+                  self.apos.util.warn(`Uploaded temporary file ${req.file.path} was already removed, this should have been the responsibility of the upload route`);
                 }
               }
             }
@@ -393,7 +392,9 @@ module.exports = {
       // object, suitable for passing to the `url` API and for use as the value
       // of a `type: 'attachment'` schema field.
       async insert(req, file, options = {}) {
-        let extension = path.extname(file.name);
+        // Handle both multer (originalname) and connect-multiparty (name) formats
+        const fileName = file.originalname || file.name;
+        let extension = path.extname(fileName);
         if (extension && extension.length) {
           extension = extension.substr(1);
         }
@@ -420,9 +421,9 @@ module.exports = {
           _id: options.attachmentId ?? self.apos.util.generateId(),
           group: group.name,
           createdAt: new Date(),
-          name: self.apos.util.slugify(path.basename(file.name, path.extname(file.name))),
+          name: self.apos.util.slugify(path.basename(fileName, path.extname(fileName))),
           title: self.apos.util.sortify(
-            path.basename(file.name, path.extname(file.name))
+            path.basename(fileName, path.extname(fileName))
           ),
           extension,
           type: 'attachment',

modules/@apostrophecms/http/lib/big-upload-middleware.js

@@ -1,4 +1,4 @@
-const multiparty = require('connect-multiparty');
+const multer = require('multer');
 const util = require('util');
 const {
   readFile, open, unlink
@@ -17,10 +17,10 @@ module.exports = (self) => ({
 
   bigUploadMiddleware({ authorize } = {}) {
     return (req, res, next) => {
-      // Chain the multiparty middleware to handle normal uploads
+      // Chain the multer middleware to handle normal uploads
       // as chunks (more efficient than base64 etc)
-      const multipartyFn = multiparty();
-      return multipartyFn(req, res, () => {
+      const multerFn = multer({ dest: require('os').tmpdir() }).any();
+      return multerFn(req, res, () => {
         return body(req, res, next);
       });
     };
@@ -56,10 +56,10 @@ module.exports = (self) => ({
           });
         }
       } finally {
-        // Clean up multiparty temporary files
-        for (const { path } of Object.values(origFiles || {})) {
+        // Clean up multer temporary files
+        for (const file of (origFiles || [])) {
           try {
-            await unlink(path);
+            await unlink(file.path);
           } catch (e) {
             // OK if it is already gone
           }
@@ -136,7 +136,7 @@ module.exports = (self) => ({
       if ((chunk < 0) || (chunk >= info.chunks)) {
         throw self.apos.error('invalid', 'chunk out of range');
       }
-      const file = req.files.chunk;
+      const file = req.files.find(f => f.fieldname === 'chunk') || req.files[0];
       const ufs = self.getBigUploadFs();
       const ufsPath = `/big-uploads/${id}-${n}-${chunk}`;
       await ufs.copyIn(file.path, ufsPath);

modules/@apostrophecms/rich-text-widget/lib/apiRoutes.js

@@ -1,5 +1,5 @@
 const fs = require('node:fs');
-const connectMultiparty = require('connect-multiparty');
+const multer = require('multer');
 const { pipeline } = require('stream/promises');
 const { parse: csvParse } = require('csv-parse');
 const { Transform } = require('stream');
@@ -9,14 +9,14 @@ module.exports = self => {
   return {
     post: {
       generateCsvTable: [
-        connectMultiparty(),
+        multer({ dest: require('os').tmpdir() }).single('file'),
         async (req) => {
-          const { file } = req.files || {};
+          const file = req.file;
           if (!file) {
             throw self.apos.error('invalid', 'A file is required');
           }
 
-          const extension = file.name.split('.').pop();
+          const extension = file.originalname.split('.').pop();
           if (extension !== 'csv') {
             throw self.apos.error('invalid', 'Only csv files are supported');
           }

modules/@apostrophecms/rich-text-widget/ui/apos/components/AposRichTextWidgetEditor.vue

@@ -193,7 +193,7 @@ export default {
       default: false
     }
   },
-  emits: [ 'update' ],
+  emits: [ 'update', 'suppressWidgetControls' ],
   data() {
     return {
       editor: null,
@@ -209,6 +209,8 @@ export default {
       showPlaceholder: null,
       activeInsertMenuComponent: false,
       suppressInsertMenu: false,
+      suppressWidgetControls: false,
+      hasSelection: false,
       insertMenuKey: null,
       openedPopover: false
     };
@@ -377,8 +379,14 @@ export default {
     }
   },
   watch: {
+    suppressWidgetControls(newVal) {
+      if (newVal) {
+        this.$emit('suppressWidgetControls');
+      }
+    },
     isFocused(newVal) {
       if (!newVal) {
+        this.suppressWidgetControls = false;
         if (this.pending) {
           this.emitWidgetUpdate();
         }
@@ -463,6 +471,13 @@ export default {
         this.$nextTick(() => {
           this.showPlaceholder = true;
         });
+      },
+      onSelectionUpdate: ({ editor }) => {
+        this.$nextTick(() => {
+          if (!editor.view.state.selection.empty) {
+            this.suppressWidgetControls = true;
+          }
+        });
       }
     });
     apos.bus.$on('apos-refreshing', this.onAposRefreshing);
@@ -501,6 +516,7 @@ export default {
       } else {
         this.suppressInsertMenu = false;
       }
+      this.suppressWidgetControls = true;
     },
     doSuppressInsertMenu() {
       this.suppressInsertMenu = true;

modules/@apostrophecms/rich-text-widget/ui/apos/tiptap-extensions/Default.js

@@ -44,6 +44,27 @@ export default (options) => {
           HTMLAttributes: attrs,
           levels: def.options.level ? [ def.options.level ] : null
         };
+      },
+      parseHTML() {
+        return [
+          {
+            tag: 'p',
+            getAttrs: el => {
+              // We must make sure the DefaultNode is only
+              // returned for the subset of elements that actually
+              // match its class, or lack of one. Otherwise it will
+              // hoover up all elements sharing its element name,
+              // breaking the ability to have alternates with classes
+              // listed in "styles" in the toolbar "stick" when you
+              // open the editor again -Tom
+              if (def.options.class) {
+                return el.getAttribute('class') === def.options.class;
+              } else {
+                return !el.hasAttribute('class');
+              }
+            }
+          }
+        ];
       }
     });
   }

modules/@apostrophecms/schema/lib/joinr.js

@@ -68,6 +68,14 @@ const joinr = module.exports = {
     getter,
     idMapper
   ) {
+    // This method never alters the items array itself, it alters
+    // the objects within it. So it is safe to reduce that array to
+    // its unique elements, and this simplifies calling code which does
+    // not have to guard against this situation.
+    // Note that we mean literal uniqueness (e.g. by reference), as this
+    // is the only time we need to avoid appending the same joined objects
+    // more than once.
+    items = [ ...new Set(items) ];
     let otherIds = [];
     const othersById = {};
     for (const item of items) {
@@ -167,6 +175,14 @@ const joinr = module.exports = {
     getter,
     idMapper
   ) {
+    // This method never alters the items array itself, it alters
+    // the objects within it. So it is safe to reduce that array to
+    // its unique elements, and this simplifies calling code which does
+    // not have to guard against this situation.
+    // Note that we mean literal uniqueness (e.g. by reference), as this
+    // is the only time we need to avoid appending the same joined objects
+    // more than once.
+    items = [ ...new Set(items) ];
     const itemIds = items.map(item => idMapper(item._id));
     for (const item of items) {
       if (!item[objectsField]) {

package.json

@@ -65,7 +65,6 @@
     "chokidar": "^3.5.2",
     "common-tags": "^1.8.0",
     "connect-mongo": "^5.1.0",
-    "connect-multiparty": "^2.1.1",
     "cookie-parser": "^1.4.5",
     "cors": "^2.8.5",
     "css-loader": "^5.2.4",
@@ -76,7 +75,6 @@
     "express-bearer-token": "^3.0.0",
     "express-cache-on-demand": "^1.0.3",
     "express-session": "^1.18.2",
-    "form-data": "^4.0.0",
     "fs-extra": "^7.0.1",
     "glob": "^10.4.5",
     "he": "^1.2.0",
@@ -92,6 +90,7 @@
     "mini-css-extract-plugin": "^1.6.0",
     "minimatch": "^3.0.4",
     "mkdirp": "^0.5.5",
+    "multer": "^2.0.2",
     "node-fetch": "^2.6.1",
     "nodemailer": "^6.6.1",
     "nunjucks": "^3.2.1",
@@ -134,6 +133,7 @@
   },
   "devDependencies": {
     "eslint-config-apostrophe": "^5.0.0",
+    "form-data": "^4.0.4",
     "mocha": "^10.7.3",
     "nyc": "^15.1.0",
     "replace-in-file": "^6.1.0",