// ***********************************************
// This example commands.js shows you how to
// create various custom commands and overwrite
// existing commands.
//
// For more comprehensive examples of custom
// commands please read more here:
// https://on.cypress.io/custom-commands
// ***********************************************
//
//
// -- This is a parent command --
// Cypress.Commands.add("login", (email, password) => { ... })
//
//
// -- This is a child command --
// Cypress.Commands.add("drag", { prevSubject: 'element'}, (subject, options) => { ... })
//
//
// -- This is a dual command --
// Cypress.Commands.add("dismiss", { prevSubject: 'optional'}, (subject, options) => { ... })
//
//
// -- This is will overwrite an existing command --
// Cypress.Commands.overwrite("visit", (originalFn, url, options) => { ... })

Cypress.Commands.add("login", (username, password) => {
  cy.request('/')
    .its('body')
    .then(body => {
      console.log(body);
      const $html = Cypress.$(body);

      const csrf = $html.find('input[name=csrfmiddlewaretoken]').val();
      console.log(csrf);
      cy.loginByCsrf(username, password, csrf)
        .then(resp => {
          expect(resp.status).to.eq(200);
          expect(resp.body).to.include('skillbox');
        });
    })

});

Cypress.Commands.add("logout", () => {
  cy.clearCookies();
});

Cypress.Commands.add('loginByCsrf', (username, password, csrftoken) => {
  cy.request({
    method: 'POST',
    url: '/accounts/login/',
    failOnStatusCode: false,
    form: true,
    body: {
      username: username,
      password: password,
      csrfmiddlewaretoken: csrftoken
    }
  });
});

// from https://stackoverflow.com/questions/53814647/how-can-i-alias-specific-graphql-requests-in-cypress
Cypress.Commands.add('waitFor', operationName => {
  cy.wait('@graphQL').then(({request}) => {
    if(request.body.operationName !== operationName) {
      return cy.waitFor(operationName);
    }
  });
});