Использование Cypress с Vue.js - Программный вход - PullRequest
Новая
       33

Использование Cypress с Vue.js - Программный вход

0 голосов
/ 04 июля 2019

Вариант использования: войдите в наше приложение Vue.js, используя вспомогательную библиотеку auth0-js.

Настройка: Руководство по аутентификации Auth0 , Cypress.io для тестирования интерфейса, Следуя этому фантастическому руководству по авторской работе Джонни Рейли .

Это руководство дало нам почти все.Вот файл commands.js Cypress (настройка входа в систему). 


const auth0 = require('auth0-js');

Cypress.Commands.add('loginAsAdmin', (overrides = {}) => {
  Cypress.log({
      name: 'LoginWithAuth0'
  });

  const webAuth = new auth0.WebAuth({
      domain: Cypress.env('auth_url'), 
      clientID: Cypress.env('auth_client_id'), 
      responseType: 'token id_token'
  });

  webAuth.client.login(
      {
          realm: 'Username-Password-Authentication',
          username: Cypress.env('auth_username'),
          password: Cypress.env('auth_password'),
          audience: Cypress.env('auth_audience'), 
          scope: 'openid email profile'
      },
      function(err, authResult) {
            window.sessionStorage.setItem('access_token', authResult.accessToken);
            window.sessionStorage.setItem('id_token', authResult.idToken);
            window.sessionStorage.setItem('expires_at', authResult.expiresIn * 1000 + new Date().getTime());
            window.localStorage.setItem('loggedIn', 'true');


          } else {
              console.error('Problem logging into Auth0', err);
  throw err;
          }
      }
  );
});

authResult возвращает объект со следующей информацией: 

{
  accessToken: <access_token>
  expiresIn: 86400
  idToken: <id_token>
  scope: "openid email profile read:current_user update:current_user_metadata delete:current_user_metadata create:current_user_metadata create:current_user_device_credentials delete:current_user_device_credentials update:current_user_identities"
  tokenType: "Bearer"
}

Простой тест Cypress с использованием cy.loginAsAdmin(); - 

describe('login', () => {
  it('should successfully log into our app', () => {
    cy.loginAsAdmin();
    cy.visit('/dashboard') // only seen whilst logged in.
  });
});

Но безуспешно - он все равно просит меня войти в приложение.

Я заметил, что в документации vue.js для auth0 не упоминается хранение каких-либочасти, которые составляли authResult ранее в sessionStorage / localStorage.Так что я не уверен, что это способ пройти аутентификацию с использованием этих технологий.

Я что-то упустил?Есть ли альтернативный поток для смеси Cypress / Vue?

...