cypress E2e login to logout test done

cypress/e2e/loginToLogout.cy.js

@@ -1,4 +1,4 @@
-// 之後要優化: 加入生命週期、每一個測試步驟要分開寫，不寫在同一個 it 裡面、將測試寫成 report 輸出成 html(嘗試)
+// 之後要優化: 每一個測試步驟要分開寫，不寫在同一個 it 裡面、將測試寫成 report 輸出成 html(嘗試)
 
 describe("Login to Logout", () => {
   before(() => {
@@ -7,22 +7,24 @@ describe("Login to Logout", () => {
     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');
+  it("test login success and error", () => {
+    // 驗證帳密是否刪除前後空白、錯誤帳密是否顯示驗證、Button display
+    cy.fixture('users/id-not-exists').then(({username, password}) => {
+      cy.get('.btn-lg').should('be.disabled');
+      cy.get('#account').should('have.focus').type(username);
+      cy.get('.btn-lg').should('be.disabled');
+      cy.get('#password').type(password);
+      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('#account').clear().type(Cypress.env('user').username);
+    cy.get('#password').clear().type(Cypress.env('user').password);
     cy.get('.btn-lg').click();
     cy.get('form').submit(); // 選取 form 表單並發送
 

cypress/fixtures/example.json

@@ -1,5 +0,0 @@
-{
-  "name": "Using fixtures to represent data",
-  "email": "hello@cypress.io",
-  "body": "Fixtures are a great way to mock data for responses to routes"
-}

cypress/fixtures/users/id-not-exists.json

@@ -0,0 +1,4 @@
+{
+  "username": "   test   ",
+  "password": "   test   "
+}