fix(header): Fixed unauthorization and unit tests

Author: fragsalat

src/ws-header/authorization.js

@@ -98,7 +98,7 @@ export class Authorization {
    * @returns {void}
    */
   unauthorize() {
-    this.storage.remove('access_key');
+    this.storage.remove('access_token');
     this.storage.remove('expires_at');
     this.changeAccessToken(null);
   }

src/ws-header/ws-header.js

@@ -4,8 +4,6 @@ import {LocalStorage} from './storage/local-storage';
 import {Authorization} from './authorization';
 import {WSDropdown} from '../ws-dropdown/ws-dropdown';
 
-let authorization;
-
 /**
  * This component renders a generic header which provides authentication and language management
  *
@@ -15,6 +13,11 @@ let authorization;
  */
 export class WSHeader extends Component {
 
+  /**
+   * @type {Authorization}
+   */
+  static authorization = undefined;
+
   /**
    * Default storage instance
    * @type {AbstractStorage}
@@ -64,11 +67,20 @@ export class WSHeader extends Component {
    * @returns {string|null}
    */
   static getAccessToken(queryString = location.hash.substr(1)) {
-    authorization = authorization || new Authorization(this.storage);
-    if (!authorization.accessToken) {
-      authorization.tryFetchToken(queryString);
+    this.authorization = this.authorization || new Authorization(this.storage);
+    if (!this.authorization.accessToken) {
+      this.authorization.tryFetchToken(queryString);
     }
-    return authorization.accessToken;
+    return this.authorization.accessToken;
+  }
+
+  /**
+   * Unauthorize will remove the access token from storage
+   * @returns {void}
+   */
+  static removeAccessToken() {
+    this.authorization = this.authorization || new Authorization(this.storage);
+    this.authorization.unauthorize();
   }
 
   /**
@@ -141,9 +153,9 @@ export class WSHeader extends Component {
    */
   initAuthorization(props) {
     // Initialize authorization with implicit flow
-    authorization = authorization || new Authorization(WSHeader.storage);
+    this.constructor.authorization = this.constructor.authorization || new Authorization(WSHeader.storage);
     // Listen to authorization changes
-    authorization.onAccessTokenChange(accessToken => {
+    this.constructor.authorization.onAccessTokenChange(accessToken => {
       if (this.mounted) {
         this.setState({isLoggedIn: !!accessToken});
       } else {
@@ -153,14 +165,14 @@ export class WSHeader extends Component {
       this.dispatchEvent('ws-auth-changed', accessToken);
     });
     // Check if we was redirected from the auth page and an access token is available
-    authorization.tryFetchToken(location.hash.substr(1));
+    this.constructor.authorization.tryFetchToken(location.hash.substr(1));
     // Listen for authentication requests
     window.addEventListener('ws-authorize', () => {
-      authorization.authorize(props.loginUrl, props.clientId, props.businessPartnerId);
+      this.constructor.authorization.authorize(props.loginUrl, props.clientId, props.businessPartnerId);
     });
     // Listen for authentication removal requests
     window.addEventListener('ws-unauthorize', () => {
-      authorization.unauthorize();
+      this.constructor.authorization.unauthorize();
     });
   }
 

tests/ws-header/ws-header.spec.js

@@ -4,13 +4,12 @@ import {WSHeader} from '../../src/ws-header/ws-header';
 import {CookieStorage} from '../../src/ws-header/storage/cookie-storage';
 import {LocalStorage} from '../../src/ws-header/storage/local-storage';
 
-function clearStorage() {
-  WSHeader.storage.remove('access_token');
-  WSHeader.storage.remove('expires_at');
-}
-
 describe('A WSHeader', () => {
 
+  afterEach(() => {
+    WSHeader.removeAccessToken();
+  });
+
   it('set\'s the storage type', () => {
     WSHeader.storage = null;
 
@@ -25,26 +24,17 @@ describe('A WSHeader', () => {
     expect(WSHeader.storage.name).toBe('asd-');
   });
 
-  it('get\'s the access token', done => {
+  it('get\'s the access token', () => {
     const tokenName = 'asd';
     // Only test the basic function, the general authorization ist tested elsewhere
     WSHeader.storage.set('access_token', tokenName);
-    WSHeader.getAccessToken()
-      .then(accessToken => {
-        expect(accessToken).toBe(tokenName);
-        WSHeader.storage.remove('access_token');
-        done();
-      });
+    expect(WSHeader.getAccessToken()).toBe(tokenName);
   });
 
-  it('doesn\'t get an access token', done => {
+  it('doesn\'t get an access token', () => {
     const tokenName = 'asd';
     // Only test the basic function, the general authorization ist tested elsewhere
-    WSHeader.getAccessToken(`test&no_token=${tokenName}&tests`)
-      .then(accessToken => {
-        expect(accessToken).toBeFalsy();
-        done();
-      });
+    expect(WSHeader.getAccessToken(`test&no_token=${tokenName}&tests`)).toBeFalsy();
   });
 
   it('initializes correctly', () => {
@@ -55,10 +45,12 @@ describe('A WSHeader', () => {
       clientId: 444
     });
 
-    expect(header.authorization).toBeTruthy();
-    expect(header.authorization.loginUrl).toBe('1111');
-    expect(header.authorization.businessPartnerId).toBe('333');
-    expect(header.authorization.clientId).toBe(444);
+    spyOn(WSHeader.authorization, 'authorize');
+
+    expect(WSHeader.authorization).toBeTruthy();
+    window.dispatchEvent(new CustomEvent('ws-authorize'));
+
+    expect(WSHeader.authorization.authorize).toHaveBeenCalledWith('1111', 444, '333');
     expect(header.state.locale).toBe('de');
   });