Fix security issues (#1253)

* Fix security issues
* Update dependencies
* Fix tests
* Downgrade sass-loader, it requires webpack 5, which vue 2.x doesn't care for.

Author: lfarrell

static/js/admin/vue-permissions-editor/package-lock.json

@@ -10,25 +10,25 @@
   },
   "dependencies": {
     "axios": "^0.21.1",
-    "core-js": "^3.6.5",
-    "date-fns": "^2.16.1",
+    "core-js": "^3.12.1",
+    "date-fns": "^2.21.3",
     "lodash.clonedeep": "^4.5.0",
     "lodash.findindex": "^4.6.0",
     "lodash.isempty": "^4.4.0",
     "vue": "^2.6.12",
-    "vue-router": "^3.4.6"
+    "vue-router": "^3.5.1"
   },
   "devDependencies": {
-    "@testing-library/jest-dom": "^5.11.4",
-    "@vue/cli-plugin-babel": "^4.5.7",
-    "@vue/cli-plugin-unit-jest": "^4.5.7",
-    "@vue/cli-service": "^4.5.7",
-    "@vue/test-utils": "1.1.0",
-    "babel-jest": "^26.5.2",
-    "caniuse-lite": "^1.0.30001208",
+    "@testing-library/jest-dom": "^5.12.0",
+    "@vue/cli-plugin-babel": "^4.5.13",
+    "@vue/cli-plugin-unit-jest": "^4.5.13",
+    "@vue/cli-service": "^4.5.13",
+    "@vue/test-utils": "1.2.0",
+    "babel-jest": "^26.6.3",
+    "caniuse-lite": "^1.0.30001228",
     "moxios": "^0.4.0",
-    "sass": "^1.27.0",
-    "sass-loader": "^10.0.2",
+    "sass": "^1.32.12",
+    "sass-loader": "^10.2.0",
     "vue-template-compiler": "^2.6.12"
   }
 }

static/js/admin/vue-permissions-editor/package.json

@@ -17,9 +17,8 @@ export default {
         containerRoles(container_type) {
             if (container_type === 'AdminUnit') {
                 return this.roles;
-            } else {
-                return this.roles.slice(0, 5);
             }
+            return [...this.roles.slice(0, 5)];
         },
 
         showDescriptions() {

static/js/admin/vue-permissions-editor/src/mixins/staffRoleList.js

@@ -17,23 +17,24 @@ let wrapper;
 
 describe('staffRoleList', () => {
     // Set wrapper using any component that uses staffRoleList mixin to avoid test warnings about missing template
-    beforeEach(() => {
+    it("displays all options for Admin Units", () => {
         wrapper = shallowMount(staffRolesSelect, {
             localVue,
             propsData: {
                 containerType: 'AdminUnit',
                 user: { principal: 'test_user', role: 'canAccess' }
             }
         });
-    });
-
-    it("displays all options for Admin Units", () => {
         expect(wrapper.vm.containerRoles(wrapper.vm.containerType)).toEqual(all_roles);
     });
 
     it("displays a subset of options for Collections", () => {
-        wrapper.setProps({
-            containerType: 'Collection',
+        wrapper = shallowMount(staffRolesSelect, {
+            localVue,
+            propsData: {
+                containerType: 'Collection',
+                user: { principal: 'test_user', role: 'canAccess' }
+            }
         });
         expect(wrapper.vm.containerRoles(wrapper.vm.containerType)).toEqual(collection_roles);
     });

static/js/admin/vue-permissions-editor/tests/unit/staffRoleList.spec.js

@@ -59,7 +59,7 @@ describe('staffRoles.vue', () => {
 
         wrapper.find('.info').trigger('click');
         await wrapper.vm.$nextTick();
-        expect(wrapper.find('#role-list').element).toBeVisible();
+        expect(wrapper.find('#role-list').isVisible()).toBe(true);
     });
 
     it("triggers a submission", async () => {
@@ -342,12 +342,12 @@ describe('staffRoles.vue', () => {
         wrapper.setProps({containerType: 'AdminUnit'});
         await wrapper.vm.$nextTick();
         let btn = wrapper.find('#is-submitting');
-        expect(btn.element).toBeVisible();
+        expect(btn.isVisible()).toBe(true);
 
         wrapper.setProps({containerType: 'Collection'});
 
         await wrapper.vm.$nextTick();
-        expect(btn.element).toBeVisible();
+        expect(btn.isVisible()).toBe(true);
     });
 
     it("emits an event to reset 'changesCheck' in parent component", async () => {