Tools/Cypress

Cypress入門〜インストールから起動まで〜

NANCEEE 2022. 5. 27. 01:45
반응형

はじめに

今年からフロントの開発に入りました。今まではバックの開発をしてきましたが、目標はフルスタックエンジニアなので今回が自分にとってはいい機会になると思います。
今まで経験しなかったいろんなツールや技術を触ることになって、その中で興味深かったものをまとめていこうかと思います。
さあ、その初めはテストツールであるCypressを見てみましょう。

Cypress?

https://www.cypress.io

 

JavaScript End to End Testing Framework

Fast, easy and reliable testing for anything that runs in a browser. Install Cypress in seconds and take the pain out of front-end testing.

www.cypress.io

Cypressはテストを自動化するJavaScriptのフレイムワークで、E2E test、総合テスト(Integration test)、単体テスト(Unit test)ができます。テストの実行だけではなく、動画やスクリーンショットの証跡の作成、ダッシュボードでのテスト結果のレポート確認もできます。

E2E test?

E2E testとは「End to End Test」の略語で、エンドユーザの視点でテストする方法です。E2E testではユーザが実際使用しているようにwork flowを想定して、想定した結果のどおり正しく動くのかがを確認します。

インストール

Cypressのテストを実施するディレクトリの下にインストールをします。インストールの際にはnpmもしくはyarnを利用します。

npm install cypress 

起動

インストールしたディレクトリで以下のコマンドを実行してみましょう。

npx cypress open

実行したら以下のようにターミナルに表示され、cypressが起動されます。

It looks like this is your first time using Cypress: 9.7.0

✔  Verified Cypress! /Users/juhyanglee/Library/Caches/Cypress/9.7.0/Cypress.app

Opening Cypress...

さて、初起動になります!
次の記事はテストの作成やテストレポートの確認方法について語りましょう。
ここまで読んでくださってありがとうございました。

반응형