refactor: Update comments and tests for error message

ui/core/app/components/error/message.hbs

@@ -1,4 +1,6 @@
 <Rose::Message @title={{t this.title}} @subtitle={{t this.subtitle}} @icon={{this.icon}} as |message|>
   <message.description>{{t this.description}}</message.description>
-  <message.link @route={{this.helpRoute}}>{{t "actions.help"}}</message.link>
+  {{#if this.helpRoute}}
+    <message.link @route={{this.helpRoute}}>{{t "actions.help"}}</message.link>
+  {{/if}}
 </Rose::Message>

ui/core/app/components/error/message.js

@@ -1,50 +1,50 @@
 import Message from 'rose/components/rose/message';
 
 /*
-  * Helpful error booleans are attached based on the error status code:
-  *
-  *   - 401 - `error.isUnauthenticated`:  the session isn't authenticated
-  *   - 403 - `error.isForbidden`:  the session is authenticated but does not have
-  *                         permission to perform the requested action
-  *   - 404 - `error.isNotFound`:  the requested resource could not be found
-  *   - 500 - `error.isServer`:  an internal server error occurred
-  *
-  * For an unknown error state, i.e error state not matching to the above defined list:
-  *   - unknown - `error.isUnknown`:  an error occurred, but we don't know which or
-  *                   we don't distinguish it yet
-*/
+ * Helpful error booleans are attached based on the error status code:
+ *
+ *   - 401 - `error.isUnauthenticated`:  the session isn't authenticated
+ *   - 403 - `error.isForbidden`:  the session is authenticated but does not have
+ *            permission to perform the requested action
+ *   - 404 - `error.isNotFound`:  the requested resource could not be found
+ *   - 500 - `error.isServer`:  an internal server error occurred
+ *
+ * For an unknown error state, i.e error state not matching to the above defined list:
+ *   - unknown - `error.isUnknown`:  an error occurred, but we don't know which or
+ *            we don't distinguish it yet
+ */
 
 const status_messages = {
-  '401' : {
+  '401': {
     icon: 'disabled',
     title: 'errors.titles.unauthenticated-error',
     subtitle: 'errors.subtitles.unauthenticated-error',
     description: 'errors.descriptions.unauthenticated-error',
   },
-  '403' : {
+  '403': {
     icon: 'disabled',
     title: 'errors.titles.forbidden-error',
     subtitle: 'errors.subtitles.forbidden-error',
     description: 'errors.descriptions.forbidden-error',
   },
-  '404' : {
+  '404': {
     icon: 'help-circle-outline',
     title: 'errors.titles.notfound-error',
     subtitle: 'errors.subtitles.notfound-error',
     description: 'errors.descriptions.notfound-error',
   },
-  '500' : {
+  '500': {
     icon: 'alert-circle-outline',
     title: 'errors.titles.server-error',
     subtitle: 'errors.subtitles.server-error',
     description: 'errors.descriptions.server-error',
   },
-  'unknown' : {
+  unknown: {
     icon: 'alert-circle-outline',
     title: 'errors.titles.unknown-error',
     subtitle: 'errors.subtitles.unknown-error',
     description: 'errors.descriptions.unknown-error',
-  }
+  },
 };
 
 export default class ErrorMessageComponent extends Message {
@@ -82,23 +82,26 @@ export default class ErrorMessageComponent extends Message {
     return this.statusMessage.description;
   }
 
+  // Disable until help documentation can be linked in.
   /**
    * Returns an route string for help text in message.
    * @return {string}
    */
-  get helpRoute() {
-    return 'index'
-  }
+  // get helpRoute() {
+  //   return 'index'
+  // }
 
   /**
    * Returns an object with message details based on error status.
-   * Return message for `unkown` error when error status isn't part of
+   * Return message for `unknown` error when error status isn't part of
    * predefined message set.
    * @return {object}
    */
   get statusMessage() {
     let status = this.status;
-    if(!status_messages[status]) { status = 'unknown'; }
+    if (!status_messages[status]) {
+      status = 'unknown';
+    }
     return status_messages[status];
   }
-}
+}

ui/core/app/routes/scopes/scope.js

@@ -33,5 +33,4 @@ export default class ScopesScopeRoute extends Route {
       );
     });
   }
-
 }

ui/core/mirage/config.js

@@ -1,6 +1,7 @@
 import config from '../config/environment';
 import { authHandler, deauthHandler } from './route-handlers/auth';
-import { Response } from 'miragejs';
+// Uncomment to use in simulating error responses
+// import { Response } from 'miragejs';
 
 export default function() {
 

ui/core/tests/integration/components/error/message-test.js

@@ -1,26 +1,41 @@
 import { module, test } from 'qunit';
 import { setupRenderingTest } from 'ember-qunit';
-import { render } from '@ember/test-helpers';
+import { render, find } from '@ember/test-helpers';
 import { hbs } from 'ember-cli-htmlbars';
 
-module('Integration | Component | error/message', function(hooks) {
+module('Integration | Component | error/message', function (hooks) {
   setupRenderingTest(hooks);
 
-  test('it renders', async function(assert) {
-    // Set any properties with this.set('myProperty', 'value');
-    // Handle any actions with this.set('myAction', function(val) { ... });
+  test('it renders predefined message for known error status', async function (assert) {
+    this.set('status', '401');
 
-    await render(hbs`<Error::Message />`);
+    await render(hbs`<Error::Message @status={{this.status}} />`);
+    assert.equal(
+      find('.rose-message-title').textContent.trim(),
+      'You are not signed in'
+    );
+    assert.equal(
+      find('.rose-message-subtitle').textContent.trim(),
+      'Error 401'
+    );
+    assert.equal(
+      find('.rose-message-description').textContent.trim(),
+      'You are not authenticated. Please authenticate and try again later.'
+    );
+  });
 
-    assert.equal(this.element.textContent.trim(), '');
+  test('it renders default error for undefined error status', async function (assert) {
+    this.set('status', '510');
 
-    // Template block usage:
-    await render(hbs`
-      <Error::Message>
-        template block text
-      </Error::Message>
-    `);
-
-    assert.equal(this.element.textContent.trim(), 'template block text');
+    await render(hbs`<Error::Message @status={{this.status}} />`);
+    assert.equal(
+      find('.rose-message-title').textContent.trim(),
+      'Something went wrong'
+    );
+    assert.equal(find('.rose-message-subtitle').textContent.trim(), 'Error');
+    assert.equal(
+      find('.rose-message-description').textContent.trim(),
+      'Please contact your administrator or try again later.'
+    );
   });
 });