iT邦幫忙

2021 iThome 鐵人賽

DAY 15
1
Software Development

你還在用手動測試嗎?30 天帶你學會前端自動化測試框架 - Cypress系列 第 15

自動化測試,讓你上班擁有一杯咖啡的時間 | Day 15 - 設定環境變量

  • 分享至 

  • xImage
  •  

此系列文章會同步發文到個人部落格,有興趣的讀者可以前往觀看喔。

在測試時,當要測試的環境有許多種,如開發環境、測試環境、生產環境等等,你可能會想說是否一個環境就要寫一次腳本?今天要跟大家分享的是環境變數設定,在設定檔中只要更改要訪問的 Url,則可以執行腳本囉。

  1. 在 cypress.json 檔,加上baseUrl

    {
    "baseUrl": "https://ithelp.ithome.com.tw/"
    }
    
  2. 在腳本中輸入 cy.visit("") ,不可以輸入 cy.visit()

    describe("測試鐵人賽上傳圖片", function () {
      beforeEach(()=>{
        cy.visit("");
        cy.login({ userId: "account", password: "password" });
      })
    
      afterEach(()=>{
        cy.get('li > a').contains("登出").click({force: true,}); //點選登出
      })
    
      it("點選鐵人賽發文後,應該要可以上傳圖片", function () {
        cy.get('.menu__ironman-btn').click({force: true,}); //點選鐵人賽發文
        cy.get('.group__badge--software-dev').click({force: true,}); //點選主題
        cy.get('.post-header__title').type("測試上傳圖片"); //輸入標題
        cy.get('.fa-upload').click({force: true,}); //點選上傳圖片icon
        cy.get('.upload').click({force: true,}); //點選上傳圖片
        const filepath = 'images/avataaars.png' //定義照片路徑
        cy.get('#uploadButton').attachFile(filepath) //上傳檔案
        cy.get('#InsertImg').click() //點選上傳(點選插入圖片)
        cy.get('.save-group__btn').click({force: true,}); //點選儲存草稿
    
      })
    })
    
  3. 結果
    https://ithelp.ithome.com.tw/upload/images/20210929/20140883jZ5pvbazDt.png

參考資料


上一篇
自動化測試,讓你上班擁有一杯咖啡的時間 | Day 14 - 取得 ESLint 支援
下一篇
自動化測試,讓你上班擁有一杯咖啡的時間 | Day 16 - 如何選取下拉式選單的值
系列文
你還在用手動測試嗎?30 天帶你學會前端自動化測試框架 - Cypress30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

1 則留言

0
Kuma
iT邦新手 3 級 ‧ 2021-09-29 10:52:39

設定環境變量真的非常適合用腳本進行的 :)

我要留言

立即登入留言