I’d like to implement tests in the existing app and don’t know how and where to start from The app is using ember-simple-auth with Implicit Grant authentication:
- it hits a corporate authentication gate to enter username and password:
https://company-gateway/authorization.oauth2?client_id=xxxx&redirect_uri=http://localhost:4200/callback&response_type=token&scope=profile%20openid
- If all is correct, it’s redirect to the client callback with an API Management token:
HTTP 302 Redirect
Location https://myapp/callback#access_token=2YotnFZFEjr1zCsicMWpAA&type=Bearer&expire_in=3600&state=myAppRandomState
- it hits the back-end
users/me
end-point withAuthorization: Bearer <token>
in the header to grab user data.
All the routes on Ember side are protected and there is no login page.
The index
route looks like that:
#routes/index.js
import Route from '@ember/routing/route';
import { inject as service } from '@ember/service';
import config from '../config/environment';
import isFastBoot from 'ember-simple-auth/utils/is-fastboot';
import UnauthenticatedRouteMixin from 'ember-simple-auth/mixins/unauthenticated-route-mixin';
export default Route.extend(UnauthenticatedRouteMixin, {
session: service('session'),
_isFastBoot: isFastBoot(),
beforeModel: function() {
if (this.get('session.isAuthenticated')) {
this.transitionTo('dashboard');
} else {
if (!this.get('_isFastBoot')) {
let oauthUrl = config.oauthUrl;
let clientId = config.clientID;
let redirectURI = `${window.location.origin}/callback`;
let responseType = `token`;
let scope = `profile%20openid`;
window.location.replace(oauthUrl
+ `?client_id=${clientId}`
+ `&redirect_uri=${redirectURI}`
+ `&response_type=${responseType}`
+ `&scope=${scope}`
);
}
}
}
});
And the application
route is defined as follows:
#routes/application.js
import { inject as service } from '@ember/service';
import Route from '@ember/routing/route';
import ApplicationRouteMixin from 'ember-simple-auth/mixins/application-route-mixin';
import moment from 'moment';
export default Route.extend(ApplicationRouteMixin, {
currentUser: service(),
intl: service(),
constants: service(),
beforeModel() {
let locale = this.figureOutLocale();
this.intl.setLocale(locale);
moment.locale(locale);
return this._loadCurrentUser();
},
sessionAuthenticated() {
this._super(...arguments);
this._loadCurrentUser();
},
_loadCurrentUser() {
return this.get('currentUser').loadCurrentUser().catch(() => this.get('session').invalidate());
},
...
And, finally, current-user
service looks liek that:
#services/current-user.js
import RSVP from 'rsvp';
import Service, { inject as service } from '@ember/service';
export default Service.extend({
session: service(),
store: service(),
flashMessages: service(),
intl: service(),
currentShop: service(),
shopService: service(),
async loadCurrentUser() {
this.get('flashMessages').clearMessages();
if (this.get('session.isAuthenticated')) {
let user = await this.get('store').queryRecord('user', { me: true });
if (user) {
this.get('flashMessages').success(this.get('intl').t('flash.signed_in'));
this.get('currentShop').setShop(user.get('shop'));
this.set('user', user);
this.get('shopService').loadShops();
return user;
} else {
this._respondWithError();
}
} else {
this.get('flashMessages').info(this.get('intl').t('flash.signed_off'));
return RSVP.resolve();
}
},
_respondWithError() {
this.get('flashMessages').danger(this.get('intl').t('flash.authentication.error'));
return RSVP.reject();
}
});
I’m stuck with Mirage
and have no idea how to proceed in such a case.
Any ideas to put me on the right way ?
Thanks a lot !