// 之後要優化: 加入生命週期、每一個測試步驟要分開寫，不寫在同一個 it 裡面、將測試寫成 report 輸出成 html(嘗試)

describe("Login to Logout", () => {
  before(() => {
    cy.visit("/"); // 測試可否進入網站
    cy.contains("h2", "LOGIN"); // 是否轉址到 /login 並顯示畫面
    cy.url().should('include', 'login') // url path 要有 'Login'，確定進入 login page
  })

  it("login error username and password", () => {
    // 驗證帳密是否刪除前後空白、輸入錯誤是否彈跳驗證、Button display
    cy.get('.btn-lg').should('be.disabled');
    cy.get('#account').should('have.focus').type('  test  ');
    cy.get('.btn-lg').should('be.disabled');
    cy.get('#password').type('  test  ');
    cy.get('.btn-lg').click();
    cy.get('#account').should('have.value', 'test');
    cy.get('#password').should('have.value', 'test');
    cy.get('form').submit();
    cy.contains("p", "Incorrect account or password.");
    cy.url().should('include', 'login');

    // 正確帳密登入
    cy.get('#account').clear().type('');
    cy.get('#password').clear().type('');
    cy.get('.btn-lg').click();
    cy.get('form').submit(); // 選取 form 表單並發送

    // 轉址到 files 頁
    cy.url().should('include', 'files');
    cy.get('a #iconMember').scrollIntoView().click();

    // 轉址到會員頁
    cy.url().should('include', 'member-area');

    // 登出
    cy.get('.btn-sm').contains('log out').click();
  });
});