From 65755def27afbcfdca20a7104e6319aaa92bd034 Mon Sep 17 00:00:00 2001 From: chiayin Date: Thu, 2 Feb 2023 12:24:50 +0800 Subject: [PATCH] cypress login test pass --- .gitignore | 1 + cypress.config.js | 2 +- cypress/e2e/example.cy.js | 8 ------ cypress/e2e/loginToLogout.cy.js | 39 +++++++++++++++++++++++++++++ package.json | 2 +- src/components/icons/IconMember.vue | 2 +- 6 files changed, 43 insertions(+), 11 deletions(-) delete mode 100644 cypress/e2e/example.cy.js create mode 100644 cypress/e2e/loginToLogout.cy.js diff --git a/.gitignore b/.gitignore index 06c6e59..78c0931 100644 --- a/.gitignore +++ b/.gitignore @@ -34,3 +34,4 @@ vscode # local env files .env.local .env.*.local +.env.demo diff --git a/cypress.config.js b/cypress.config.js index 872ef5b..7064c99 100644 --- a/cypress.config.js +++ b/cypress.config.js @@ -4,6 +4,6 @@ const { defineConfig } = require("cypress"); module.exports = defineConfig({ e2e: { specPattern: "cypress/e2e/**/*.{cy,spec}.{js,jsx,ts,tsx}", - baseUrl: "http://localhost:4173", + baseUrl: '', }, }); diff --git a/cypress/e2e/example.cy.js b/cypress/e2e/example.cy.js deleted file mode 100644 index 3130c00..0000000 --- a/cypress/e2e/example.cy.js +++ /dev/null @@ -1,8 +0,0 @@ -// https://docs.cypress.io/api/introduction/api.html - -describe("My First Test", () => { - it("visits the app root url", () => { - cy.visit("/"); - cy.contains("h1", "You did it!"); - }); -}); diff --git a/cypress/e2e/loginToLogout.cy.js b/cypress/e2e/loginToLogout.cy.js new file mode 100644 index 0000000..32ef55c --- /dev/null +++ b/cypress/e2e/loginToLogout.cy.js @@ -0,0 +1,39 @@ +// 之後要優化: 加入生命週期、每一個測試步驟要分開寫，不寫在同一個 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(); + }); +}); diff --git a/package.json b/package.json index 8b2e8e7..b4ee671 100644 --- a/package.json +++ b/package.json @@ -1,5 +1,5 @@ { - "name": "lucia-frontend", + "name": "frontend", "version": "0.2.0", "private": true, "scripts": { diff --git a/src/components/icons/IconMember.vue b/src/components/icons/IconMember.vue index a03f77c..9d173ed 100644 --- a/src/components/icons/IconMember.vue +++ b/src/components/icons/IconMember.vue @@ -1,5 +1,5 @@