1 files changed, 53 insertions, 13 deletions
diff --git a/spec/frontend/members/store/mutations_spec.js b/spec/frontend/members/store/mutations_spec.js
index 488bfdf15fd..7ad7034eb6d 100644
--- a/spec/frontend/members/store/mutations_spec.js
+++ b/spec/frontend/members/store/mutations_spec.js
@@ -1,6 +1,6 @@
 import { members, group } from 'jest/members/mock_data';
-import mutations from '~/members/store/mutations';
 import * as types from '~/members/store/mutation_types';
+import mutations from '~/members/store/mutations';
 
 describe('Vuex members mutations', () => {
   describe('update member mutations', () => {
@@ -28,13 +28,33 @@ describe('Vuex members mutations', () => {
     });
 
     describe(types.RECEIVE_MEMBER_ROLE_ERROR, () => {
-      it('shows error message', () => {
-        mutations[types.RECEIVE_MEMBER_ROLE_ERROR](state);
+      describe('when error does not have a message', () => {
+        it('shows default error message', () => {
+          mutations[types.RECEIVE_MEMBER_ROLE_ERROR](state, {
+            error: new Error('Network Error'),
+          });
+
+          expect(state.showError).toBe(true);
+          expect(state.errorMessage).toBe(
+            "An error occurred while updating the member's role, please try again.",
+          );
+        });
+      });
+
+      describe('when error has a message', () => {
+        it('shows error message', () => {
+          const error = new Error('Request failed with status code 422');
+          const message =
+            'User email "john.smith@gmail.com" does not match the allowed domain of example.com';
+
+          error.response = {
+            data: { message },
+          };
+          mutations[types.RECEIVE_MEMBER_ROLE_ERROR](state, { error });
 
-        expect(state.showError).toBe(true);
-        expect(state.errorMessage).toBe(
-          "An error occurred while updating the member's role, please try again.",
-        );
+          expect(state.showError).toBe(true);
+          expect(state.errorMessage).toBe(message);
+        });
       });
     });
 
@@ -52,13 +72,33 @@ describe('Vuex members mutations', () => {
     });
 
     describe(types.RECEIVE_MEMBER_EXPIRATION_ERROR, () => {
-      it('shows error message', () => {
-        mutations[types.RECEIVE_MEMBER_EXPIRATION_ERROR](state);
+      describe('when error does not have a message', () => {
+        it('shows default error message', () => {
+          mutations[types.RECEIVE_MEMBER_EXPIRATION_ERROR](state, {
+            error: new Error('Network Error'),
+          });
+
+          expect(state.showError).toBe(true);
+          expect(state.errorMessage).toBe(
+            "An error occurred while updating the member's expiration date, please try again.",
+          );
+        });
+      });
 
-        expect(state.showError).toBe(true);
-        expect(state.errorMessage).toBe(
-          "An error occurred while updating the member's expiration date, please try again.",
-        );
+      describe('when error has a message', () => {
+        it('shows error message', () => {
+          const error = new Error('Request failed with status code 422');
+          const message =
+            'User email "john.smith@gmail.com" does not match the allowed domain of example.com';
+
+          error.response = {
+            data: { message },
+          };
+          mutations[types.RECEIVE_MEMBER_EXPIRATION_ERROR](state, { error });
+
+          expect(state.showError).toBe(true);
+          expect(state.errorMessage).toBe(message);
+        });
       });
     });
   });