apostrophe 2.225.0 → 2.227.0

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # Changelog
 
+## 2.227.0 (2023-03-16)
+
+### Adds
+
+* Add a read-only overlay to prevent users from interacting with areas set as read-only, as it was done for checkboxes and color field types.
+
+## 2.226.0 (2023-03-06)
+
+### Adds
+
+* Add `readOnlyFields` option. Exactly like `showFields`, a boolean/select/checkboxes field in the document can control whether other fields are read-only or not (as opposed to visible or not).
+
+### Security
+
+* Upgrades passport to the latest version in order to ensure session regeneration when logging in or out. This adds additional security to logins by mitigating any risks due to XSS attacks. Apostrophe is already robust against XSS attacks. For passport methods that are internally used by Apostrophe everything is still working. For projects that are accessing the passport instance directly through `self.apos.login.passport`, some verifications may be necessary to avoid any compatibility issue. The internally used methods are `authenticate`, `use`, `serializeUser`, `deserializeUser`, `initialize`, `session`.
+
 ## 2.225.0 (2023-02-17)
 
 ### Adds

package/lib/modules/apostrophe-schemas/index.js

@@ -485,7 +485,7 @@ module.exports = {
       }
       var errors = {};
       return async.eachSeries(schema, function(field, callback) {
-        if (field.readOnly) {
+        if (field.readOnly || self.isReadOnly(schema, object, field.name)) {
           return setImmediate(callback);
         }
         // Fields that are contextual are edited in the context of a
@@ -545,41 +545,66 @@ module.exports = {
     // based on showFields options of all fields
 
     self.isVisible = function(schema, object, name) {
-      var hidden = {};
-      _.each(schema, function(field) {
-        if (!_.find(field.choices || [], function(choice) {
-          return choice.showFields;
-        })) {
+      const transform = value => !value;
+      const buildWarningMessage = name => `⚠️ showFields misconfigured, attempts to show/hide ${name} which does not exist`;
+
+      return self.doesMatchConditionalChoices(schema, object, name, 'showFields', transform, buildWarningMessage);
+    };
+
+    // Determine whether the given field is read-only
+    // based on readOnlyFields options of all fields
+
+    self.isReadOnly = function(schema, object, name) {
+      const transform = value => value;
+      const buildWarningMessage = name => `⚠️ readOnlyFields misconfigured, attempts to set ${name} which does not exist as read only`;
+
+      return self.doesMatchConditionalChoices(schema, object, name, 'readOnlyFields', transform, buildWarningMessage);
+    };
+
+    self.doesMatchConditionalChoices = function(schema, object, name, actionName, transform, buildWarningMessage) {
+      var memo = {};
+
+      _.each(schema, field => {
+        if (!_.find(field.choices || [], choice => choice[actionName])) {
           return;
         }
-        _.each(field.choices, function(choice) {
-          if (choice.showFields) {
-            if (field.type === 'checkboxes') {
-              if (!object[field.name].includes(choice.value)) {
-                _.each(choice.showFields, hide);
-              }
-            } else if (object[field.name] !== choice.value) {
-              _.each(choice.showFields, hide);
+
+        _.each(field.choices, choice => {
+          if (!choice[actionName]) {
+            return;
+          }
+
+          if (field.type === 'checkboxes') {
+            if (object[field.name] && transform(object[field.name].includes(choice.value))) {
+              _.each(choice[actionName], action);
             }
+
+            return;
+          }
+
+          if (transform(object[field.name] === choice.value)) {
+            _.each(choice[actionName], action);
           }
         });
       });
-      return !hidden[name];
 
-      function hide(name) {
-        hidden[name] = true;
-        // Cope with nested showFields
-        var field = _.find(schema, { name: name });
+      return transform(memo[name]);
+
+      function action(name) {
+        memo[name] = true;
+
+        var field = _.find(schema, { name });
         if (!field) {
           // Do not crash. The linter at startup also catches this,
           // but is a nonfatal warning for bc, so we should also catch it
-          self.apos.utils.warnDev('⚠️ showFields misconfigured, attempts to show/hide ' + name + ' which does not exist');
+          self.apos.utils.warnDev(buildWarningMessage(name));
+
           return;
         }
-        _.each(field.choices || [], function(choice) {
-          _.each(choice.showFields || [], function(name) {
-            hide(name);
-          });
+
+        _.each(field.choices || [], choice => {
+          // Cope with nested showFields/readOnlyFields
+          _.each(choice[actionName] || [], action);
         });
       }
     };

package/lib/modules/apostrophe-schemas/public/js/user.js

@@ -670,94 +670,138 @@ apos.define('apostrophe-schemas', {
     };
 
     self.enableShowFields = function(data, name, $field, $el, field) {
+      self.enableConditionalFields(data, name, $field, $el, field, 'showFields', function ($fieldset, match) {
+        $fieldset.toggleClass('apos-hidden', !match);
+      });
+    };
+
+    self.enableReadOnlyFields = function(data, name, $field, $el, field) {
+      self.enableConditionalFields(data, name, $field, $el, field, 'readOnlyFields', function ($fieldset, match) {
+        // Disable inputs, and color picker via the spectrum API
+        $fieldset
+          .find('input')
+          .attr('disabled', match)
+          .filter('[data-apos-color]')
+          .spectrum(match ? 'disable' : 'enable');
+
+        // Disable select element
+        $fieldset
+          .find('select')
+          .attr('disabled', match);
+
+        // Add a visual overlay to show that the field is read-only
+        $fieldset
+          .find('.apos-field-readonly-overlay')
+          .toggleClass('apos-field-readonly-overlay--active', match);
+
+        // Hide area's controls
+        if ($fieldset.hasClass('apos-field-area')) {
+          waitForEl($fieldset, '[data-apos-widget-controls]', 10, function($el) {
+            $el.toggleClass('apos-area-widget-controls--disabled', match);
+          });
+          waitForEl($fieldset, '.apos-ui', 10, function($el) {
+            $el.css('display', match ? 'none' : 'block');
+          });
+        }
+
+        function waitForEl($scope, selector, maxRetries, callback) {
+          if (this.retries > maxRetries) {
+            return;
+          }
+
+          var $el = $scope.find(selector);
+          if ($el.length) {
+            callback($el);
+            return;
+          }
+
+          setTimeout(function() {
+            waitForEl($scope, selector, maxRetries, callback);
+          }, 100);
+
+          this.retries = this.retries || {};
+          this.retries[selector] = this.retries[selector] ? ++this.retries[selector] : 1;
+        };
+      });
+    };
 
+    self.enableConditionalFields = function(data, name, $field, $el, field, actionName, callback) {
+      var eventName = 'apos' + apos.utils.capitalizeFirst(actionName);
       var $fieldset = self.findFieldset($el, name);
 
-      // afterChange shows and hides other fieldsets based on
-      // the current value of this field and its visibility.
+      // afterChange shows and hides or disables other fieldsets based on
+      // the current value of this field..
       // We do this in three situations: at startup, when the
-      // user changes the value, and when the visibility of this
+      // user changes the value, and when the visibility/disability of this
       // field has been affected by another field with the
-      // showFields option. This allows nested showFields to
-      // work properly. -Tom
+      // showFields/readOnlyFields option.
+      // This allows nested showFields/readOnlyFields to work properly. -Tom
 
       afterChange();
 
       $field.on('change', afterChange);
-      $fieldset.on('aposShowFields', afterChange);
-      function afterChange() {
-        // Implement showFields
+      $fieldset.on(eventName, afterChange);
 
+      function afterChange() {
         if (!_.find(field.choices || [], function(choice) {
-          return choice.showFields;
+          return choice[actionName];
         })) {
-          // showFields is not in use for this select
           return;
         }
 
-        var val;
-        if (field.checkbox) {
-          val = $field.is(':checked');
-        } else {
-          val = $field.val();
-        }
+        var val = field.checkbox
+          ? $field.is(':checked')
+          : $field.val();
 
-        // Recall if another choice currently active already chose to show each field.
-        // That way, if two choices show the same field, the fact that the second one
-        // is not currently selected does not hide the field the first one just showed
-        var shown = {};
+        // Recall if another choice currently active already chose to show/disable each field.
+        // That way, if two choices show/disable the same field, the fact that the second one
+        // is not currently selected does not hide/enable the field the first one just showed/disabled
+        var memo = {};
 
         _.each(field.choices || [], function(choice) {
+          var match;
 
-          // Show the fields for this value if it is the current value
+          // Show/disable the fields for this value if it is the current value
           // *and* the select field itself is currently visible
-
-          var show;
-
           if ($fieldset.hasClass('apos-hidden')) {
-            show = false;
+            match = false;
           } else if (field.type === 'boolean') {
             // Comparing boolean values is hard because
             // the string '0' must be considered falsy in
             // order to permit use of select elements. -Tom
             if (val === choice.value) {
-              show = true;
+              match = true;
             } else if (!choice.value) {
               if ((!val) || (val === '0')) {
-                show = true;
+                match = true;
               }
             } else {
               if (val && (val !== '0')) {
-                show = true;
+                match = true;
               }
             }
           } else if (field.type === 'checkboxes') {
             _.each($field || [], function(checkbox) {
-              if (checkbox.checked && checkbox.value === choice.value && choice.showFields) {
-                show = true;
+              if (checkbox.checked && checkbox.value === choice.value && choice[actionName]) {
+                match = true;
               }
             });
           } else {
             // type select
             if (val === choice.value.toString()) {
-              show = true;
+              match = true;
             }
           }
 
-          _.each(choice.showFields || [], function(fieldName) {
-            if (show || shown[fieldName]) {
-              shown[fieldName] = true;
-            } else {
-              shown[fieldName] = false;
-            }
+          _.each(choice[actionName] || [], function(fieldName) {
+            memo[fieldName] = match || !!memo[fieldName];
+
             var $fieldset = self.findFieldset($el, fieldName);
 
-            $fieldset.toggleClass('apos-hidden', !shown[fieldName]);
-            $fieldset.trigger('aposShowFields');
+            callback($fieldset, memo[fieldName]);
+            $fieldset.trigger(eventName);
           });
-
         });
-
       }
     };
 
@@ -1277,6 +1321,7 @@ apos.define('apostrophe-schemas', {
           $field.val('0');
         }
         self.enableShowFields(data, name, $field, $el, field);
+        self.enableReadOnlyFields(data, name, $field, $el, field);
         return setImmediate(callback);
       },
       convert: function(data, name, $field, $el, field, callback) {
@@ -1340,6 +1385,7 @@ apos.define('apostrophe-schemas', {
             self.findSafe($fieldset, 'input[name="' + name + '"][value="' + data[name][c] + '"]', '.apos-field').prop('checked', true);
           }
           self.enableShowFields(data, name, $field, $el, field);
+          self.enableReadOnlyFields(data, name, $field, $el, field);
           return setImmediate(callback);
         }
       },
@@ -1448,6 +1494,7 @@ apos.define('apostrophe-schemas', {
           }
           $field.val(value);
           self.enableShowFields(data, name, $field, $el, field);
+          self.enableReadOnlyFields(data, name, $field, $el, field);
           return setImmediate(callback);
         }
       },

package/lib/modules/apostrophe-schemas/views/macros.html

@@ -137,6 +137,7 @@
 {%- endmacro -%}
 
 {%- macro checkboxesBody(field) -%}
+  <div class="apos-field-readonly-overlay"></div>
   {%- for choice in field.choices -%}
     <div class="apos-form-checkbox">
       <label class="apos-form-checkbox-label apos-text-small">
@@ -204,6 +205,7 @@
 {%- endmacro -%}
 
 {%- macro singletonBody(field) -%}
+  <div class="apos-field-readonly-overlay"></div>
   {# js adds this singleton to the dialog #}
   <div data-{{ field.name }}-edit-view></div>
 {%- endmacro -%}

package/lib/modules/apostrophe-ui/public/css/components/fields.less

@@ -6,6 +6,7 @@
 
 .apos-field
 {
+  position: relative;
   margin-bottom: @apos-margin-4;
   width: 100%;
   max-width: 540px;
@@ -300,6 +301,22 @@
   display: inline-block;
 }
 
+// Field readonly overlay  ===================================
+.apos-field-readonly-overlay {
+  display: none;
+  position: absolute;
+  z-index: @apos-z-index-max;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-color: rgba(255, 255, 255, 0.75);
+}
+
+.apos-field-readonly-overlay--active {
+  display: block;
+}
+
 // Browse and autocomplete combo
 .apos-browse-and-autocomplete {
   display: flex;

package/lib/modules/apostrophe-ui/views/components/fields.html

@@ -30,6 +30,7 @@
 
 {% macro color(name, placeholder, value, readOnly, options) -%}
   <label>
+    <div class="apos-field-readonly-overlay"></div>
     <div class="apos-field-input-color-preview" data-apos-color-preview></div>
     <input id="{{ options.id }}" name="{{ name }}" data-apos-color-empty-label="{{ __ns('apostrophe', "None selected") }}" class="apos-field-input apos-field-input-color{% if options.fieldClasses %} {{ options.fieldClasses }}{% endif %}" data-apos-color type="text" value="{{__ns('apostrophe', value | d(''))}}"{% if readOnly %} disabled{% endif %}{% if options.fieldAttributes %} {{ options.fieldAttributes }}{% endif %}>
     <span class="apos-field-input-colorpicker-value" data-apos-color-value></span>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "apostrophe",
-  "version": "2.225.0",
+  "version": "2.227.0",
   "description": "The Apostrophe Content Management System.",
   "main": "index.js",
   "scripts": {
@@ -60,7 +60,7 @@
     "moog-require": "^1.1.0",
     "nodemailer": "^6.6.2",
     "oembetter": "^1.0.1",
-    "passport": "^0.3.2",
+    "passport": "^0.6.0",
     "passport-local": "^1.0.0",
     "passport-totp": "0.0.2",
     "path-to-regexp": "^1.7.0",

package/test/schemas.js

@@ -2129,4 +2129,110 @@ describe('Schemas', function() {
     });
   });
 
+  it('should disregard read-only fields set by a boolean field', function(done) {
+    var req = apos.tasks.getReq();
+    var schema = apos.schemas.compose({
+      addFields: [
+        {
+          name: 'age',
+          type: 'integer'
+        },
+        {
+          name: 'canEditAge',
+          type: 'boolean',
+          choices: [
+            {
+              value: true
+            },
+            {
+              value: false,
+              readOnlyFields: [ 'age' ]
+            }
+          ]
+        }
+      ]
+    });
+    var object = {
+      age: 20,
+      canEditAge: false
+    };
+    apos.schemas.convert(req, schema, 'form', { age: '30' }, object, function(err) {
+      assert(!err);
+      assert(object.age === 20);
+      done();
+    });
+  });
+
+  it('should disregard read-only fields set by a select field', function(done) {
+    var req = apos.tasks.getReq();
+    var schema = apos.schemas.compose({
+      addFields: [
+        {
+          name: 'age',
+          type: 'integer'
+        },
+        {
+          name: 'edit',
+          type: 'select',
+          choices: [
+            {
+              label: 'Can edit anything',
+              value: 'canEditAnything'
+            },
+            {
+              label: 'Cannot edit age',
+              value: 'cannotEditAge',
+              readOnlyFields: [ 'age' ]
+            }
+          ]
+        }
+      ]
+    });
+    var object = {
+      age: 20,
+      edit: 'cannotEditAge'
+    };
+    apos.schemas.convert(req, schema, 'form', { age: '30' }, object, function(err) {
+      assert(!err);
+      assert(object.age === 20);
+      done();
+    });
+  });
+
+  it('should disregard read-only fields set by a checkboxes field', function(done) {
+    var req = apos.tasks.getReq();
+    var schema = apos.schemas.compose({
+      addFields: [
+        {
+          name: 'age',
+          type: 'integer'
+        },
+        {
+          name: 'edit',
+          type: 'checkboxes',
+          choices: [
+            {
+              label: 'Can edit anything',
+              value: 'canEditAnything'
+            },
+            {
+              label: 'Cannot edit age',
+              value: 'cannotEditAge',
+              readOnlyFields: [ 'age' ]
+            }
+          ]
+        }
+      ]
+    });
+    var object = {
+      age: 20,
+      edit: 'cannotEditAge'
+    };
+    apos.schemas.convert(req, schema, 'form', { age: '30' }, object, function(err) {
+      assert(!err);
+      assert(object.age === 20);
+      done();
+    });
+  });
+
 });

package/test/package.json

@@ -1,73 +0,0 @@
-{
-  "//": "Automatically generated to satisfy moog-require, do not edit",
-  "dependencies": {
-    "@apostrophecms/nunjucks": "^2.5.4",
-    "@sailshq/lodash": "^3.10.4",
-    "async": "^1.5.2",
-    "bless": "^3.0.3",
-    "bluebird": "^3.7.1",
-    "body-parser": "^1.19.0",
-    "cheerio": "^1.0.0-rc.10",
-    "chokidar": "^3.5.1",
-    "connect-flash": "^0.1.1",
-    "connect-multiparty": "^2.2.0",
-    "cookie-parser": "^1.4.5",
-    "credentials": "^3.0.2",
-    "cuid": "^1.3.8",
-    "diff": "^4.0.1",
-    "emulate-mongo-2-driver": "^1.2.3",
-    "express": "^4.17.1",
-    "express-session": "^1.17.0",
-    "glob": "^5.0.15",
-    "he": "^0.5.0",
-    "heic-to-jpeg-middleware": "^2.0.0",
-    "html-to-plaintext": "^0.1.1",
-    "html-to-text": "^5.1.1",
-    "i18n": "^0.8.6",
-    "is-wsl": "^2.2.0",
-    "joinr": "^1.0.2",
-    "jpeg-exif": "^1.1.4",
-    "launder": "^1.5.0",
-    "less": "^3.13.1",
-    "less-middleware": "^3.1.0",
-    "minimatch": "^3.0.4",
-    "mkdirp": "^1.0.3",
-    "moment": "^2.29.1",
-    "moog-require": "^1.1.0",
-    "nodemailer": "^6.6.2",
-    "oembetter": "^1.0.1",
-    "passport": "^0.3.2",
-    "passport-local": "^1.0.0",
-    "passport-totp": "0.0.2",
-    "path-to-regexp": "^1.7.0",
-    "performance-now": "^2.1.0",
-    "qs": "^6.9.6",
-    "regexp-quote": "0.0.0",
-    "request": "^2.88.2",
-    "request-promise": "^4.2.4",
-    "resolve": "^1.20.0",
-    "rimraf": "^2.7.1",
-    "sanitize-html": "^2.7.1",
-    "server-destroy": "^1.0.1",
-    "sluggo": "^0.2.0",
-    "syntax-error": "^1.3.0",
-    "thirty-two": "^1.0.2",
-    "tinycolor2": "^1.4.1",
-    "uglify-js": "^2.8.29",
-    "underscore.string": "^3.3.5",
-    "uploadfs": "^1.18.4",
-    "xregexp": "^2.0.0",
-    "yargs": "^3.32.0",
-    "apostrophe": "^2.0.0"
-  },
-  "devDependencies": {
-    "eslint": "^6.5.1",
-    "eslint-config-apostrophe": "^2.0.2",
-    "eslint-config-standard": "^11.0.0",
-    "eslint-plugin-import": "^2.18.2",
-    "eslint-plugin-node": "^6.0.1",
-    "eslint-plugin-promise": "^3.8.0",
-    "eslint-plugin-standard": "^3.1.0",
-    "mocha": "^7.0.0"
-  }
-}