Merge branch 'feature/login-improvements' into 'master'

Get instance from window.location if it is not provided in the username field

Closes #27

See merge request pleroma/admin-fe!39

src/api/__mocks__/login.js

@@ -1,10 +1,11 @@
 const users = [
-  { username: 'bob', password: '123456' }
+  { username: 'bob', password: '123456', authHost: 'pleroma' }
 ]
 
-export async function loginByUsername(username, password) {
+export async function loginByUsername(username, password, authHost) {
   const user = users.find(user => user.username === username)
   const verifyPassword = user.password === password
+  const verifyHost = user.authHost === authHost
   const data = {
     'token_type': 'Bearer',
     'scope': 'read write follow',
@@ -14,7 +15,7 @@ export async function loginByUsername(username, password) {
     'access_token': 'bar123'
   }
 
-  return verifyPassword
+  return verifyPassword && verifyHost
     ? Promise.resolve({ data })
     : Promise.reject({ message: 'Invalid credentials' })
 }

src/views/login/index.vue

@@ -45,9 +45,7 @@
 </template>
 
 <script>
-import { Message } from 'element-ui'
 import SvgIcon from '@/components/SvgIcon'
-import i18n from '@/lang'
 
 export default {
   name: 'Login',
@@ -82,33 +80,20 @@ export default {
     },
     handleLogin() {
       this.loading = true
-      if (this.checkUsername()) {
+      const loginData = this.getLoginData()
-        const loginData = this.getLoginData()
+      this.$store.dispatch('LoginByUsername', loginData).then(() => {
-        this.$store.dispatch('LoginByUsername', loginData).then(() => {
-          this.loading = false
-          this.$router.push({ path: this.redirect || '/users/index' })
-        }).catch(() => {
-          this.loading = false
-        })
-      } else {
-        Message({
-          message: i18n.t('login.errorMessage'),
-          type: 'error',
-          duration: 7000
-        })
-        this.$store.dispatch('addErrorLog', { message: i18n.t('login.errorMessage') })
         this.loading = false
-      }
+        this.$router.push({ path: this.redirect || '/users/index' })
-    },
+      }).catch(() => {
-    checkUsername() {
+        this.loading = false
-      return this.loginForm.username.includes('@')
+      })
     },
     getLoginData() {
       const [username, authHost] = this.loginForm.username.split('@')
 
       return {
         username: username.trim(),
-        authHost: authHost.trim(),
+        authHost: authHost ? authHost.trim() : window.location.host,
         password: this.loginForm.password
       }
     }

test/views/login/index.test.js

@@ -31,13 +31,19 @@ describe('Login', () => {
     router.beforeEach(beforeEachRoute)
   })
 
-  it('throws error if username does not contain authHost', () => {
+  it('takes authHost from window.location if it is not provided in username', () => {
     const wrapper = mount(Login, {
       store,
       router,
       localVue
     })
 
+    Object.defineProperty(window, 'location', {
+      value: {
+        ...window.location,
+        host: 'pleroma'
+      }
+    });
     const errorLog = store.state.errorLog.logs
     expect(errorLog.length).toBe(0)
     const submitButton = wrapper.find('button')
@@ -49,10 +55,7 @@ describe('Login', () => {
     submitButton.trigger('click')
 
     const updatedErrorLog = store.state.errorLog.logs
-    expect(updatedErrorLog.length).toBe(1)
+    expect(updatedErrorLog.length).toBe(0)
-    expect(updatedErrorLog[0].message).toEqual(
-      'Username must contain username and host, e.g. john@pleroma.social'
-    )
   })
 
   it('throws error if password is incorrect', async (done) => {
@@ -92,7 +95,7 @@ describe('Login', () => {
     const submitButton = wrapper.find('button')
     expect(wrapper.vm.$route.path).toBe('/login')
 
-    wrapper.find(usernameInput).element.value = 'bob@apple'
+    wrapper.find(usernameInput).element.value = 'bob@pleroma'
     wrapper.find(usernameInput).trigger('input')
     wrapper.find(passwordInput).element.value = '123456'
     wrapper.find(passwordInput).trigger('input')

test/views/users/index.test.js

@@ -27,7 +27,8 @@ describe('Search and filter users', () => {
     const wrapper = mount(Users, {
       store,
       localVue,
-      sync: false
+      sync: false,
+      stubs: ['router-link']
     })
 
     await flushPromises()
@@ -39,7 +40,8 @@ describe('Search and filter users', () => {
     const wrapper = mount(Users, {
       store,
       localVue,
-      sync: false
+      sync: false,
+      stubs: ['router-link']
     })
 
     wrapper.vm.handleDebounceSearchInput = (query) => {
@@ -76,7 +78,8 @@ describe('Users actions', () => {
     const wrapper = mount(Users, {
       store,
       localVue,
-      sync: false
+      sync: false,
+      stubs: ['router-link']
     })
     await flushPromises()
 
@@ -99,7 +102,8 @@ describe('Users actions', () => {
     const wrapper = mount(Users, {
       store,
       localVue,
-      sync: false
+      sync: false,
+      stubs: ['router-link']
     })
     await flushPromises()
 
@@ -114,7 +118,8 @@ describe('Users actions', () => {
     const wrapper = mount(Users, {
       store,
       localVue,
-      sync: false
+      sync: false,
+      stubs: ['router-link']
     })
     await flushPromises()
 
@@ -133,7 +138,8 @@ describe('Users actions', () => {
     const wrapper = mount(Users, {
       store,
       localVue,
-      sync: false
+      sync: false,
+      stubs: ['router-link']
     })
     await flushPromises()
     expect(store.state.users.fetchedUsers.length).toEqual(3)
@@ -148,7 +154,8 @@ describe('Users actions', () => {
     const wrapper = mount(Users, {
       store,
       localVue,
-      sync: false
+      sync: false,
+      stubs: ['router-link']
     })
     await flushPromises()
 
@@ -173,7 +180,8 @@ describe('Users actions', () => {
     const wrapper = mount(Users, {
       store,
       localVue,
-      sync: false
+      sync: false,
+      stubs: ['router-link']
     })
     await flushPromises()
 
@@ -192,7 +200,8 @@ describe('Users actions', () => {
     const wrapper = mount(Users, {
       store,
       localVue,
-      sync: false
+      sync: false,
+      stubs: ['router-link']
     })
     await flushPromises()
 
@@ -209,7 +218,8 @@ describe('Users actions', () => {
     const wrapper = mount(Users, {
       store,
       localVue,
-      sync: false
+      sync: false,
+      stubs: ['router-link']
     })
     await flushPromises()
 
@@ -245,7 +255,8 @@ describe('Creates new account', () => {
     const wrapper = mount(Users, {
       store,
       localVue,
-      sync: false
+      sync: false,
+      stubs: ['router-link']
     })
     await flushPromises()
 
@@ -269,7 +280,8 @@ describe('Creates new account', () => {
     const wrapper = mount(Users, {
       store,
       localVue,
-      sync: false
+      sync: false,
+      stubs: ['router-link']
     })
     await flushPromises()
     expect(wrapper.vm.usersCount).toEqual(3)
@@ -302,7 +314,8 @@ describe('Creates new account', () => {
     const wrapper = mount(NewAccountDialog, {
       store,
       localVue,
-      sync: false
+      sync: false,
+      stubs: ['router-link']
     })
 
     const validateEmailRule = { validator: wrapper.vm.validateEmail, field: 'email', fullField: 'email', type: 'string' }