From 8e913467c8fd116c29b4d55223173b6c559d3fe8 Mon Sep 17 00:00:00 2001 From: Joshua Avery Date: Thu, 30 Jul 2020 12:47:22 -0700 Subject: [PATCH] fixed bugs, fixed tests, test for listcatalogs --- public/index.html | 2 - src/main.js | 65 +++++++++--- src/routes.js | 6 ++ src/store/modules/login.js | 15 ++- src/views/404.vue | 7 ++ src/views/500.vue | 5 + src/views/Login.vue | 100 ++++++++---------- tests/unit/App.spec.js | 3 + tests/unit/components/SearchBar.spec.js | 2 +- .../unit/components/runs/ListCatalogs.spec.js | 65 ++++++++++++ tests/unit/components/runs/responses.js | 10 ++ tests/unit/store/store-login.spec.js | 1 + tests/unit/views/Login.spec.js | 93 ++-------------- 13 files changed, 216 insertions(+), 158 deletions(-) create mode 100644 src/views/404.vue create mode 100644 src/views/500.vue create mode 100644 tests/unit/components/runs/ListCatalogs.spec.js create mode 100644 tests/unit/components/runs/responses.js diff --git a/public/index.html b/public/index.html index 24f5849..79535e4 100644 --- a/public/index.html +++ b/public/index.html @@ -5,8 +5,6 @@ - - Splash diff --git a/src/main.js b/src/main.js index 66b02ba..d0fb6ef 100644 --- a/src/main.js +++ b/src/main.js @@ -4,19 +4,13 @@ import BootstrapVue from 'bootstrap-vue'; import 'bootstrap/dist/css/bootstrap.css'; import 'bootstrap-vue/dist/bootstrap-vue.css'; import axios from 'axios'; -import GAuth from 'vue-google-oauth2'; // import { Plotly } from "vue-plotly" import App from './App.vue'; +import FiveHundred from './views/500.vue'; import router from './router'; import store from './store'; import './assets/css/main.css'; -const gauthOption = { - clientId: process.env.VUE_APP_CLIENT_ID.concat('.apps.googleusercontent.com'), - scope: 'profile email', - prompt: 'select_account', -}; -Vue.use(GAuth, gauthOption); Vue.use(BootstrapVue); Vue.use(Router); // Vue.component('plotly', Plotly); @@ -50,8 +44,55 @@ Vue.use({ }, }); -new Vue({ - router, - store, - render: (h) => h(App), -}).$mount('#app'); + +function onGoogleError() { + new Vue({ + router, + store, + render: (h) => h(FiveHundred), + }).$mount('#app'); +} + +async function onGoogleLoad() { + // This function is called when the google auth library has loaded into + // the page + + // asyncified the load method inspired by: + // https://stackoverflow.com/a/51939030/8903570 + // This loads the auth2 part of the google auth library, + // Necessary for functionality like programatically logging the user out + // of the app: https://developers.google.com/identity/sign-in/web/reference + await new Promise((resolve) => window.gapi.load('auth2', resolve)); + try { + // Initializes it with the correct client ID + await window.gapi.auth2.init({ + client_id: process.env.VUE_APP_CLIENT_ID.concat( + '.apps.googleusercontent.com', + ), + }); + } catch (e) { + console.log(e); + onGoogleError(); + return; + } + // only AFTER this has all been loaded + // do we mount the app. The google functionality is + // _essential_ to our app, we want to ensure that the + // google library is loaded before anything else. + new Vue({ + router, + store, + render: (h) => h(App), + }).$mount('#app'); +} + + +// Construct src element for google sign in script +const script = document.createElement('script'); +script.src = 'https://apis.google.com/js/platform.js'; +script.async = true; +script.defer = true; + +script.onload = onGoogleLoad; // When the script loads we call this function +script.onerror = onGoogleError; // When there's an error, call this function +document.head.appendChild(script); // Inject the script diff --git a/src/routes.js b/src/routes.js index 2587c3f..1555853 100644 --- a/src/routes.js +++ b/src/routes.js @@ -10,6 +10,7 @@ import RunDataCJS from './views/RunDataCJS.vue'; import RunDataD3 from './views/RunDataD3.vue'; import ListCatalogs from './views/runs/ListCatalogs.vue'; import ListRuns from './views/runs/ListRuns.vue'; +import NotFound from './views/404.vue'; export default [ { @@ -94,5 +95,10 @@ export default [ }, // component: RunData, }, + { + path: '*', + name: '404', + component: NotFound, + }, ]; diff --git a/src/store/modules/login.js b/src/store/modules/login.js index 867c571..403faeb 100644 --- a/src/store/modules/login.js +++ b/src/store/modules/login.js @@ -7,33 +7,39 @@ import { const state = () => ({ status: '', - user: {}, + user: JSON.parse(localStorage.getItem('user')) || {}, api_access_token: localStorage.getItem('api_access_token') || '', }); const mutations = { [AUTH_SUCCESS](state, payload) { + localStorage.setItem('api_access_token', payload.access_token); + localStorage.setItem('user', JSON.stringify(payload.user)); state.status = 'success'; state.user = payload.user; state.api_access_token = payload.api_access_token; }, [AUTH_ERROR](state) { state.status = 'error'; + localStorage.removeItem('api_access_token'); + localStorage.removeItem('user'); }, [LOGOUT](state) { state.status = ''; state.user = {}; state.api_access_token = ''; localStorage.removeItem('api_access_token'); + localStorage.removeItem('user'); }, }; const actions = { logout({ commit }) { + console.log('hello'); commit(LOGOUT); - const auth2 = Vue.prototype.$gAuth; - auth2.signOut() + const auth2 = window.gapi.auth2.getAuthInstance(); + return auth2.signOut() .then(() => console.log('User signed out of google')) .catch((error) => console.error(error)); }, @@ -47,7 +53,7 @@ const actions = { try { const response = await Vue.prototype.$api.post(Vue.prototype.$login_url, bodyParameters, config); - localStorage.setItem('api_access_token', response.data.access_token); // TODO store the refresh-token provided + // TODO store the refresh-token provided commit(AUTH_SUCCESS, { user: response.data.user, api_access_token: response.data.access_token, @@ -55,7 +61,6 @@ const actions = { } catch (error) { console.error('Failure!'); commit(AUTH_ERROR, error); - localStorage.removeItem('api_access_token'); } }, diff --git a/src/views/404.vue b/src/views/404.vue new file mode 100644 index 0000000..f757cd3 --- /dev/null +++ b/src/views/404.vue @@ -0,0 +1,7 @@ + diff --git a/src/views/500.vue b/src/views/500.vue new file mode 100644 index 0000000..bfe862d --- /dev/null +++ b/src/views/500.vue @@ -0,0 +1,5 @@ + diff --git a/src/views/Login.vue b/src/views/Login.vue index 3dd899c..13730c4 100644 --- a/src/views/Login.vue +++ b/src/views/Login.vue @@ -1,74 +1,63 @@