Как проверить вход в календарь GSuite с помощью Cypress

Question

Окружающая среда

• Windows 10
• NodeJs 8
• Кипарис 3.1.2
• Селен
• хром v59

Как пройти аутентификацию в календаре Google с помощью Cypress?

Мне нужно запустить автоматические тесты для расширения Chrome, которое я разрабатываю. Первым шагом является аутентификация / вход в календарь GSuite.

Я использую Cypress, но я не могу войти в календарь GSuite. Вместо этого при «нажатии входа» (из Cypress) он снова переключается на кнопку Next.

Мой фрагмент кода

describe('Login',function() {
   it('Go to GSuite calendar', function() {
     cy.visit('https://www.google.com/calendar')
   })

   it('Login', function() {
     cy.get('#Email').type('my user')
     cy.get('#next').click()
     cy.get('#Passwd').type('my password')
     cy.get('#signIn').click()
   })
})  

Это не сработало и привело меня к кнопке Next

Скриншоты

1. Хит выполнить

2. В конце он возвращается к начальному экрану, а не регистрирует меня в

My Try with Selenium и все работает

from selenium import webdriver
import time

# variables for userid & password
u = "JohnDoe@xxxx-labs.com"
p = "Mysecretpassword"

# chromedriver installation required for login through google chrome
driverpath = "C:/Users/pjain2/Desktop/chromedriver_win32/chromedriver"

# launch google calendar login page
d = webdriver.Chrome(driverpath)
d.get("https://www.google.com/calendar")

# fill email field send_keys for filling text
e = d.find_element_by_id("identifierId")
e.send_keys(u)

# find & click next button
d.find_element_by_xpath("//*[@id='identifierNext']/content/span").click()
time.sleep(2)

# enter password
e = d.find_element_by_xpath("//*[@id='password']/div[1]/div/div[1]/input")
e.send_keys("Mysecretpassword")
time.sleep(2)

# sign in
d.find_element_by_xpath("//*[@id='passwordNext']/content/span").click()
time.sleep(10)

Снимок экрана успешного входа в календарь Google

Я хочу добиться того же с Cypress

Есть указатели?

Answer 1

В spec.js файле добавьте следующий код:

describe('Random VMR for ESG',function() {
    beforeEach(() => {
       cy.visit('https://www.google.com/calendar')
    })
      it('type email & password', function() {
        cy.get('#Email').type('my user')
        cy.get('#next').click()
        cy.get('#Passwd').type('my password')
        cy.get('#signIn').click()
    })   
})

В папке support, в command.js добавьте следующий код:

Cypress.Commands.add('login', ()=> {
    cy.request({         // cy.request is not bound by any security and will bypass the login part
        method: 'POST' , // Post request to URL along with body
        url: 'https://www.google.com/calendar',
        body: {
            user: {
                email: 'my user',
                password: 'my password',
            }
        }
    })
     //server sends back the response JSON payload 
    .then((resp) => {      //token extracted from JSON payload and is saved in LocalStorage
     window.localStorage.setItem('jwt' , resp.body.user.token)
    })
})

В файле spec.js есть код, который просто посещает URL и проверяет тип ввода email и password и выполняет вход.

Проблема была в том, что перенаправлял страницу обратно на первую страницу сразу после входа. Чтобы обойти это поведение, мы используем cy.request в commands.js файле, так как cy.request запрашивает вне ограничений браузера , т.е. он не связан никакими ценными бумагами.

После того, как вы пройдете надлежащий тест e2e для входа в систему, нет смысла продолжать cy.visit() вход в систему и ждать, пока вся страница загрузит все связанные ресурсы, прежде чем выполнять какие-либо другие команды. Это может замедлить весь наш набор тестов. Используя cy.request(), мы можем обойти все это, потому что он автоматически получает и устанавливает куки так же, как если бы запросы поступали из самого браузера.

Поэтому запрос POST был отправлен вместе с полезной нагрузкой JSON или телом. Теперь, после успешной проверки тела запроса, наш код приложения извлекает токен из полезной нагрузки и сохраняет его в локальном хранилище , а также добавляет токен во все заголовки запроса, чтобы сервер API мог аутентифицировать последующий запрос, поступающий из наше приложение.

Когда наше приложение загружается, оно проверяет, что токен уже находится в локальном хранилище или нет, если это так, то оно идет вперед и устанавливает его в агенте запроса. Таким образом, он будет обходить часть входа, когда вы будете тестировать GSuite .