(TIL) 16. Jest + GitHub actions = CI


1.


お会いできて嬉しいです.
今日はいよいよ歌のunit test libraryとjestを使った日
それ以外にGitHubが提供するブランチ機構のCIとactionsの適用も試みた.
総評は….

  • repoでactionsをテストして適用するには時間がかかります!
    これは,構築段階でnpm installを用いたためである.

  • JESTはもう少しで知ることができますしかし、ないよりずっと強いです.
    より拡張されたテストコンセプトが必要なようです.現在、ビジネスロジックのみをテストしています.

  • Actions+JestはPRテストの自動化、CIを実現する.
    私たちはもっと多くの行動を理解する必要があります.新しい世界.
  • では、どのような方法で併用されているのか、testのサンプルコードはどのような形式なのか.ちょっと足りないけどアップしたい

    2. Jest


    Jestを使う方法は簡単です.

  • React-Nativeスタンダードnpm i -D jest個ならそのまま!使用可能です.

  • そして、TSプロジェクトの1:1応答に従って、テストロジックを含むファイル~.test.tsを作成し、内部にコードを記述する.
  • // dayjs.test.ts (utils logic test)
    
    test('[DayJS Logic] dayOfWeekDate test : (I)dayNum(0-6) (O)yearMonth string 반환 검사', () => {
      for (let i = 0; i <= 6; i++) {
        const [year, month, day] = dayOfWeekDate(i).split('-');
        expect(parseInt(year, 10)).toEqual(NOW_YEAR_NUM);
        expect(parseInt(month, 10)).toBeLessThanOrEqual(12);
        expect(parseInt(day, 10)).toBeLessThanOrEqual(31);
      }
    });

  • 今後のプロジェクトフォルダ位置にnpm test万と入力したら?テストはすぐに実行されます.

  • また、プロジェクト内のテストファイルがある程度のテストを行っていることを確認し、次にどれだけのテストが必要かを判断するためにnpx jest --coverageを実行する必要があります.
  • そのような過程を経験したが、Jestの使用は大きな問題ではない.
    場合によっては、mockingなどのNative Logicは使用できません.
    そのほかにもUI components test, Redux chunk actionなどのキーワードを耳にしましたが、少し遠い未来なのでここに書いておきましょう.

    また、端末でテスト結果を表示することもできます.ははは

    3. GitHub actions


    午後中ずっとアクションとレスリングをしていました.
    私はヘルプされたブログのリンクをアップロードします.興味のある人は試してみてください.
    ActionsはGitHubのプロジェクトCI機能であり、MSに依存する.
    通常、pushとpull requestの2つの機能をトリガとして管理できます.たとえば、特定のテストを自動的に実行します.
    Remote PushもPRも管理できるので、これからもっと多くのユーザーが利用します.
    actionsは、単一の機能よりも特定の外部ライブラリと一緒に使用するのに適しているようです.
    例えば、Jestのようなテストライブラリです.
    市場にはいろいろな動きがありますが、必要ならそこから持ってきて使ってもいいです.
    Github Market Place:action
    今日はactionの実行を見るために、自分でタイプしてスクリプトを書きました.
    次のスクリプトはjestに関連付けられたスクリプトです.
    npm installやnpm testなど、よく知られているコマンドが表示されます.
    name: PR_Test
    
    on: [pull_request]
    
    jobs:
      build:
        runs-on: ubuntu-latest
    
        steps:
          - uses: actions/checkout@v2
          
          - name: Setup Node
            uses: actions/setup-node@v1
            with:
              node-version: "14.x"
    
          - name: npm_install
            run: npm install
            
          - name: run_test_code
            run: npm test
            
          - name : if_fail
            uses: actions/github-script@v4
            with:
                github-token: ${{ secrets.TOKEN }}
                script : |
                  const ref = "${{github.ref}}"
                  const pull_number = Number(ref.split("/")[2])
                  console.log(pull_number, ref.split("/"), github.ref)
                  await github.pulls.createReview({
                    ...context.repo,
                    pull_number,
                    body : "테스트코드를 다시 확인해주세요. ",
                    event : "REQUEST_CHANGES"
                  })
                  await github.pulls.update({
                    ...context.repo,
                    pull_number,
                    state: "closed"
                  })
            if: failure()
  • script : ~ JavaScript構文を使用します.
  • on : [pull_request]部は、イベントが発生した場合を示す.
    最も重要なのは、初期設定にはbranch : [~]などのコードが含まれていることです.
    ただし、分岐を指定するとfeature/~など…アームからアップロードされたPRを自動的に見つけることができません.
    このため、手動で構築し、手動でテストし、actionsを完了しました.
  • Jestのプロジェクトを上書きするCI環境を構築したい場合は、インポートして使用できます.
    さらに,push eventやPRについても多くの動作が存在する.jobsgithub-token 설정하는 방법などグーグルには整理記事がたくさんありますが、気になる人は振り返ってみてください.

    テストに失敗したPRをactionタブで表示することもできます.
    PRがテストに合格しない場合は、自動的にオフになります.
    これも設定できます.(closed‖単純連結制限)

    4.


    今日もいろんな新聞を読んでボーっとした一日でした.
    しかし、テストが行われているのを見て嬉しいです.
    明日は多くのテストロジックをします.
    じゃ、明日論理を持ってきます.楽しい一日をお過ごしください.