apostrophe 3.9.0 → 3.10.0

package/CHANGELOG.md

@@ -1,5 +1,27 @@
 # Changelog
 
+## 3.10.0 - 2021-12-22
+
+### Fixes
+
+* `slug` type fields can now have an empty string or `null` as their `def` value without the string `'none'` populating automatically.
+* The `underline` feature works properly in tiptap toolbar configuration.
+* Required checkbox fields now properly prevent editor submission when empty.
+* Pins `vue-click-outside-element` to a version that does not attempt to use `eval` in its distribution build, which is incompatible with a strict Content Security Policy.
+
+### Adds
+
+* Adds a `last` option to fields. Setting `last: true` on a field puts that field at the end of the field's widget order. If more than one field has that option active the true last item will depend on general field registration order. If the field is ordered with the `fields.order` array or field group ordering, those specified orders will take precedence.
+
+### Changes
+
+* Adds deprecation notes to the widget class methods `getWidgetWrapperClasses` and `getWidgetClasses` from A2.
+* Adds a deprecation note to the `reorganize` query builder for the next major version.
+* Uses the runtime build of Vue. This has major performance and bundle size benefits, however it does require changes to Apostrophe admin UI apps that use a `template` property (components should require no changes, just apps require an update). These apps must now use a `render` function instead. Since custom admin UI apps are not yet a documented feature we do not regard this as a bc break.
+* Compatible with the `@apostrophecms/security-headers` module, which supports a strict `Content-Security-Policy`.
+* Adds a deprecation note to the `addLateCriteria` query builder.
+* Updates the `toCount` doc type query method to use Math.ceil rather than Math.floor plus an additional step.
+
 ## 3.9.0 - 2021-12-08
 
 ### Adds

package/lib/moog.js

@@ -179,17 +179,42 @@ module.exports = function(options) {
               ...properties.add
             };
           }
+
+          const lastFields = Object.entries(that[cascade])
+            .filter(([ field, val ]) => val.last === true)
+            .map(([ field, val ]) => field);
+
           if (properties.remove) {
             for (const field of properties.remove) {
               delete that[cascade][field];
             }
           }
           if (properties.order) {
+            // 1. Ordered fields
+            // 2. Other fields not marked as last
+            // 3. Fields marked as last
             that[cascade] = Object.fromEntries([
               ...properties.order.map(field => [ field, that[cascade][field] ]),
-              ...Object.keys(that[cascade]).filter(field => !properties.order.includes[field]).map(field => [ field, that[cascade][field] ])
+              ...Object.keys(that[cascade])
+                .filter(field => {
+                  return !properties.order.includes(field) &&
+                    !lastFields.includes(field);
+                })
+                .map(field => [ field, that[cascade][field] ]),
+              ...lastFields.filter(field => !properties.order.includes(field))
+                .map(field => [ field, that[cascade][field] ])
+            ]);
+          } else if (lastFields.length > 0) {
+            // 1. Fields not marked as last
+            // 2. Fields marked as last
+            that[cascade] = Object.fromEntries([
+              ...Object.keys(that[cascade])
+                .filter(field => !lastFields.includes(field))
+                .map(field => [ field, that[cascade][field] ]),
+              ...lastFields.map(field => [ field, that[cascade][field] ])
             ]);
           }
+
           if (properties.group) {
             const groups = klona(that[`${cascade}Groups`]);
             for (const value of Object.values(properties.group)) {

package/modules/@apostrophecms/admin-bar/ui/apos/apps/AposAdminBar.js

@@ -10,7 +10,13 @@ export default function() {
           return window.apos;
         }
       },
-      template: '<component :is="`TheAposAdminBar`" :items="apos.adminBar.items" />'
+      render: function (h) {
+        return h('TheAposAdminBar', {
+          props: {
+            items: apos.adminBar.items
+          }
+        });
+      }
     });
   }
 };

package/modules/@apostrophecms/any-page-type/index.js

@@ -287,6 +287,8 @@ module.exports = {
         // are suitable for display in the reorganize view.
         // The only pages excluded are those with a `reorganize`
         // property explicitly set to `false`.
+        // NOTE: This query builder is deprecated and will be removed in the
+        // next major version.
         reorganize: {
           def: null,
           finalize() {

package/modules/@apostrophecms/area/ui/apos/apps/AposAreas.js

@@ -111,7 +111,19 @@ export default function() {
             renderings
           };
         },
-        template: `<${component} :options="options" :items="items" :choices="choices" :id="$data.id" :docId="$data.docId" :fieldId="fieldId" :renderings="renderings" />`
+        render(h) {
+          return h(component, {
+            props: {
+              options: this.options,
+              items: this.items,
+              choices: this.choices,
+              id: this.id,
+              docId: this.docId,
+              fieldId: this.fieldId,
+              renderings: this.renderings
+            }
+          });
+        }
       });
     }
   }

package/modules/@apostrophecms/asset/index.js

@@ -752,8 +752,7 @@ module.exports = {
         if (!self.shouldRefreshOnRestart()) {
           return '';
         }
-        const script = fs.readFileSync(path.join(__dirname, '/lib/refresh-on-restart.js'), 'utf8');
-        return self.apos.template.safe(`<script data-apos-refresh-on-restart="${self.action}/restart-id">\n${script}</script>`);
+        return self.apos.template.safe(`<script data-apos-refresh-on-restart="${self.action}/restart-id" src="${self.action}/refresh-on-restart"></script>`);
       },
       url(path) {
         return `${self.getAssetBaseUrl()}${path}`;
@@ -765,6 +764,12 @@ module.exports = {
       return;
     }
     return {
+      get: {
+        refreshOnRestart(req) {
+          req.res.setHeader('content-type', 'text/javascript');
+          return fs.readFileSync(path.join(__dirname, '/lib/refresh-on-restart.js'), 'utf8');
+        }
+      },
       // Use a POST route so IE11 doesn't cache it
       post: {
         async restartId(req) {

package/modules/@apostrophecms/asset/lib/webpack/apos/webpack.config.js

@@ -28,7 +28,7 @@ module.exports = ({
     optimization: {
       minimize: process.env.NODE_ENV === 'production'
     },
-    devtool: 'eval-source-map',
+    devtool: 'source-map',
     output: {
       path: outputPath,
       filename: outputFilename
@@ -42,7 +42,7 @@ module.exports = ({
     resolve: {
       extensions: [ '*', '.js', '.vue', '.json' ],
       alias: {
-        vue$: 'vue/dist/vue.esm.js',
+        vue$: 'vue/dist/vue.runtime.esm.js',
         // resolve apostrophe modules
         Modules: path.resolve(modulesDir)
       },

package/modules/@apostrophecms/asset/lib/webpack/src/webpack.config.js

@@ -34,7 +34,7 @@ module.exports = ({
     optimization: {
       minimize: process.env.NODE_ENV === 'production'
     },
-    devtool: 'eval-source-map',
+    devtool: 'source-map',
     output: {
       path: outputPath,
       filename: outputFilename

package/modules/@apostrophecms/busy/ui/apos/apps/AposBusy.js

@@ -3,6 +3,8 @@ import Vue from 'Modules/@apostrophecms/ui/lib/vue';
 export default function() {
   return new Vue({
     el: '#apos-busy',
-    template: '<component :is="`TheAposBusy`" />'
+    render: function (h) {
+      return h('TheAposBusy');
+    }
   });
 };

package/modules/@apostrophecms/doc-type/index.js

@@ -1152,8 +1152,10 @@ module.exports = {
 
         // `.addLateCriteria({...})` provides an object to be merged directly into the final
         // criteria object that will go to MongoDB. This is to be used only
-        // in cases where MongoDB forbids the use of an operator inside
-        // `$and`, such as the `$near` operator.
+        // in cases where MongoDB forbids the use of an operator inside `$and`.
+        //
+        // TODO: Since `$near` can now be used in `$and` operators, this query
+        // builder is deprecated and should be removed in the 4.x major version.
         addLateCriteria: {
           set(c) {
             let lateCriteria = query.get('lateCriteria');
@@ -1420,7 +1422,7 @@ module.exports = {
           }
         },
 
-        // `.permission('admin')` would limit the returned docs to those for which the
+        // `.permission('edit')` would limit the returned docs to those for which the
         // user associated with the query's `req` has the named permission.
         // By default, `view` is checked for. You might want to specify
         // `edit`.
@@ -1658,7 +1660,11 @@ module.exports = {
             const _req = query.req.clone({
               mode: 'published'
             });
-            const publishedDocs = await self.find(_req)._ids(results.map(result => result._id.replace(':draft', ':published'))).project(query.get('project')).toArray();
+            const publishedDocs = await self.find(_req)
+              ._ids(results.map(result => {
+                return result._id.replace(':draft', ':published');
+              })).project(query.get('project')).toArray();
+
             for (const doc of results) {
               const publishedDoc = publishedDocs.find(publishedDoc => doc.aposDocId === publishedDoc.aposDocId);
               doc._publishedDoc = publishedDoc;
@@ -2148,10 +2154,8 @@ module.exports = {
           const count = await mongo.count();
           if (query.get('perPage')) {
             const perPage = query.get('perPage');
-            let totalPages = Math.floor(count / perPage);
-            if (count % perPage) {
-              totalPages++;
-            }
+            const totalPages = Math.ceil(count / perPage);
+
             query.set('totalPages', totalPages);
           }
           return count;

package/modules/@apostrophecms/login/ui/apos/apps/AposLogin.js

@@ -5,8 +5,9 @@ export default function() {
   if (el) {
     return new Vue({
       el,
-      // TODO check apos.login.browser.components.theAposLogin for alternate name
-      template: '<component :is="`TheAposLogin`" />'
+      render: function (h) {
+        return h('TheAposLogin');
+      }
     });
   }
   apos.bus.$on('admin-menu-click', async (item) => {

package/modules/@apostrophecms/modal/ui/apos/apps/AposModals.js

@@ -27,11 +27,14 @@ export default function() {
         return this.$refs.modals.execute(componentName, props);
       }
     },
-    template: `<component
-      ref="modals"
-      :is="apos.modal.components.the"
-      :modals="apos.modal.modals"
-    />`
+    render(h) {
+      return h(apos.modal.components.the, {
+        ref: 'modals',
+        props: {
+          modals: apos.modal.modals
+        }
+      });
+    }
   });
   apos.modal.execute = theAposModals.execute;
   apos.confirm = theAposModals.confirm;

package/modules/@apostrophecms/notification/ui/apos/apps/AposNotification.js

@@ -9,6 +9,8 @@ export default function() {
 
   return new Vue({
     el: '#apos-notification',
-    template: '<TheAposNotifications />'
+    render: function (h) {
+      return h('TheAposNotifications');
+    }
   });
 };

package/modules/@apostrophecms/rich-text-widget/index.js

@@ -250,7 +250,8 @@ module.exports = {
           codeBlock: [
             'pre',
             'code'
-          ]
+          ],
+          underline: [ 'u' ]
         };
         for (const item of options.toolbar || []) {
           if (simple[item]) {

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

@@ -44,6 +44,7 @@ import StarterKit from '@tiptap/starter-kit';
 import TextAlign from '@tiptap/extension-text-align';
 import Highlight from '@tiptap/extension-highlight';
 import TextStyle from '@tiptap/extension-text-style';
+import Underline from '@tiptap/extension-underline';
 export default {
   name: 'AposRichTextWidgetEditor',
   components: {
@@ -181,7 +182,8 @@ export default {
           types: [ 'heading', 'paragraph' ]
         }),
         Highlight,
-        TextStyle
+        TextStyle,
+        Underline
       ].concat(this.aposTiptapExtensions)
     });
   },

package/modules/@apostrophecms/schema/index.js

@@ -142,11 +142,14 @@ module.exports = {
       // leading slash required). Otherwise, expect a object-style slug
       // (no slashes at all)
       convert: function (req, field, data, destination) {
-        const options = {};
+        const options = {
+          def: field.def
+        };
         if (field.page) {
           options.allow = '/';
         }
         destination[field.name] = self.apos.util.slugify(self.apos.launder.string(data[field.name], field.def), options);
+
         if (field.page) {
           if (!(destination[field.name].charAt(0) === '/')) {
             destination[field.name] = '/' + destination[field.name];
@@ -1217,12 +1220,14 @@ module.exports = {
 
         // all fields in the schema will end up in this variable
         let newSchema = [];
+
         // loop over any groups and orders we want to respect
         _.each(groups, function (group) {
 
           _.each(group.fields, function (field) {
             // find the field we are ordering
             let f = _.find(schema, { name: field });
+
             if (!f) {
               // May have already been migrated due to subclasses re-grouping fields
               f = _.find(newSchema, { name: field });
@@ -1242,6 +1247,7 @@ module.exports = {
               if (fIndex !== -1) {
                 newSchema.splice(fIndex, 1);
               }
+
               newSchema.push(f);
 
               // remove the field from the old schema, if that is where we got it from

package/modules/@apostrophecms/schema/ui/apos/components/AposInputCheckboxes.vue

@@ -33,12 +33,12 @@ export default {
       return uid + value.replace(/\s/g, '');
     },
     validate(values) {
-      if (!Array.isArray(this.field.choices)) {
+      // The choices and values should always be arrays.
+      if (!Array.isArray(this.field.choices) || !Array.isArray(values)) {
         return 'malformed';
       }
 
-      if (this.field.required &&
-        !Array.isArray(values) && (!values || !values.length)) {
+      if (this.field.required && !values.length) {
         return 'required';
       }
 

package/modules/@apostrophecms/widget-type/index.js

@@ -112,6 +112,7 @@
 // you are debugging a change and need to test all of the different ways a widget has
 // been used, or are wondering if you can safely remove one.
 
+const { stripIndent } = require('common-tags');
 const _ = require('lodash');
 
 module.exports = {
@@ -310,12 +311,20 @@ module.exports = {
       },
 
       // override to add CSS classes to the outer wrapper div of the widget.
+      // TODO: Remove in the 4.x major version.
       getWidgetWrapperClasses(widget) {
+        self.apos.util.warnDev(stripIndent`
+          The getWidgetWrapperClasses method is deprecated and will be removed in the next
+          major version. The method in 3.x simply returns an empty array.`);
         return [];
       },
 
       // Override to add CSS classes to the div of the widget itself.
+      // TODO: Remove in the 4.x major version.
       getWidgetClasses(widget) {
+        self.apos.util.warnDev(stripIndent`
+          The getWidgetClasses method is deprecated and will be removed in the next major
+          version. The method in 3.x simply returns an empty array.`);
         return [];
       }
     };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "apostrophe",
-  "version": "3.9.0",
+  "version": "3.10.0",
   "description": "The Apostrophe Content Management System.",
   "main": "index.js",
   "scripts": {
@@ -34,7 +34,7 @@
     "@tiptap/extension-link": "^2.0.0-beta.17",
     "@tiptap/extension-text-align": "^2.0.0-beta.17",
     "@tiptap/extension-text-style": "^2.0.0-beta.13",
-    "@tiptap/extension-underline": "^2.0.0-beta.14",
+    "@tiptap/extension-underline": "^2.0.0-beta.22",
     "@tiptap/starter-kit": "^2.0.0-beta.75",
     "@tiptap/vue-2": "^2.0.0-beta.34",
     "autoprefixer": "^10.2.4",
@@ -110,7 +110,7 @@
     "uploadfs": "^1.17.1",
     "v-tooltip": "^2.0.3",
     "vue": "^2.6.14",
-    "vue-click-outside-element": "^1.0.13",
+    "vue-click-outside-element": "1.0.13",
     "vue-loader": "^15.9.6",
     "vue-material-design-icons": "~4.12.1",
     "vue-style-loader": "^4.1.2",

package/test/moog.js

@@ -284,6 +284,54 @@ describe('moog', function() {
       assert(myObject.fieldsGroups.basics.fields.includes('five'));
     });
 
+    it('should order fields with the last option unless the order array overrides', async function() {
+      const moog = require('../lib/moog.js')({});
+
+      moog.define('unorderedObject', {
+        cascades: [ 'fields' ],
+        fields: {
+          add: {
+            first: { type: 'string' },
+            last: {
+              type: 'string',
+              last: true
+            },
+            second: { type: 'string' },
+            third: { type: 'string' }
+          }
+        }
+      });
+
+      moog.define('orderedObject', {
+        cascades: [ 'fields' ],
+        fields: {
+          add: {
+            first: { type: 'string' },
+            last: {
+              type: 'string',
+              last: true
+            },
+            second: { type: 'string' },
+            third: { type: 'string' }
+          },
+          order: [ 'last', 'third', 'second', 'first' ]
+        }
+      });
+      const unordered = await moog.create('unorderedObject', {});
+      assert(unordered);
+      assert(Object.keys(unordered.fields)[0] === 'first');
+      assert(Object.keys(unordered.fields)[1] === 'second');
+      assert(Object.keys(unordered.fields)[2] === 'third');
+      assert(Object.keys(unordered.fields)[3] === 'last');
+
+      const ordered = await moog.create('orderedObject', {});
+      assert(ordered);
+      assert(Object.keys(ordered.fields)[0] === 'last');
+      assert(Object.keys(ordered.fields)[1] === 'third');
+      assert(Object.keys(ordered.fields)[2] === 'second');
+      assert(Object.keys(ordered.fields)[3] === 'first');
+    });
+
     // ==================================================
     // `redefine` AND `isDefined`
     // ==================================================