オープンソースの冒険:エピソード24:Imba

前のエピソードからImba 2 JSON Beautifierアプリをとって、それのためにサイプレステストを加えるようにしましょう.
第1ステップはnpm install cypressである.
私たちは、サイプレスをnpx cypress openでファイルを作成させることができました、しかし、それは我々がそれを気にしない余分なファイルの膨大な数を作成します.
それはone of common complaints about Cypress -代わりにファイルを生成する別のcypress initを持っている代わりに、それはあなたがそれらをしたい場合は、ボイラー板のファイルを作成し続けるでしょう.
とにかく、手動でreleavntファイルを作成しましょう.

サイプレス.JSON

デフォルトの設定を使用できます.

{}

サイプレス/インテグレーション/アプリ。京大理

私は完全にimba 1バージョンからコードを再利用しました.私はImba言語でテストを書くことができるかどうか知りません.何らかの方法があります.

context("JSON Pretty Printing App", () => {
  beforeEach(() => {
    cy.visit("http://localhost:3000/")
  })

  it("does not format JSON automatically", () => {
    cy.get("textarea")
      .clear()
      .type("[1, 2,3,\n   4]")
    // makes sure nothing happens
    cy.wait(100)
    cy.get("textarea")
      .invoke("val")
      .should("eq", "[1, 2,3,\n   4]")
  })

  it("formats JSON when you press the button", () => {
    cy.get("textarea")
      .clear()
      .type("[1, 2,3,\n   4]")
    cy.get("button").click()
    cy.get("textarea")
      .invoke("val")
      .should("eq", "[1, 2, 3, 4]")
  })

  it("reports error if JSON is invalid, but clears if text changes", () => {
    cy.get("textarea")
      .clear()
      .type("[1, 2, 3,")
    cy.wait(100)
    cy.get('.error').should('not.exist')
    cy.get("button").click()
    cy.get('.error').should('exist')
    cy.get("textarea").type("4")
    cy.get('.error').should('not.exist')
  })
})

パッケージ。JSON

npx cypress runでテストを実行することができますが、より明確にするために、package.jsonにこのエントリを追加することができます.

実行する

次のようにします.

$ npm test

> test
> cypress run


====================================================================================================

  (Run Starting)

  ┌────────────────────────────────────────────────────────────────────────────────────────────────┐
  │ Cypress:        9.5.2                                                                          │
  │ Browser:        Electron 94 (headless)                                                         │
  │ Node Version:   v17.7.1 (/usr/local/Cellar/node/17.7.1/bin/node)                               │
  │ Specs:          1 found (app.spec.js)                                                          │
  └────────────────────────────────────────────────────────────────────────────────────────────────┘


────────────────────────────────────────────────────────────────────────────────────────────────────

  Running:  app.spec.js                                                                     (1 of 1)
Browserslist: caniuse-lite is outdated. Please run:
npx browserslist@latest --update-db

Why you should do it regularly:
https://github.com/browserslist/browserslist#browsers-data-updating


  JSON Pretty Printing App
    ✓ does not format JSON automatically (634ms)
    ✓ formats JSON when you press the button (521ms)
    ✓ reports error if JSON is invalid, but clears if text changes (697ms)


  3 passing (3s)


  (Results)

  ┌────────────────────────────────────────────────────────────────────────────────────────────────┐
  │ Tests:        3                                                                                │
  │ Passing:      3                                                                                │
  │ Failing:      0                                                                                │
  │ Pending:      0                                                                                │
  │ Skipped:      0                                                                                │
  │ Screenshots:  0                                                                                │
  │ Video:        true                                                                             │
  │ Duration:     2 seconds                                                                        │
  │ Spec Ran:     app.spec.js                                                                      │
  └────────────────────────────────────────────────────────────────────────────────────────────────┘


  (Video)

  -  Started processing:  Compressing to 32 CRF
  -  Finished processing: ~/imba2-json-beautifier/cypress/videos/app.spec.js.mp4    (0 seconds)



====================================================================================================

  (Run Finished)


       Spec                                              Tests  Passing  Failing  Pending  Skipped
  ┌────────────────────────────────────────────────────────────────────────────────────────────────┐
  │ ✔  app.spec.js                              00:02        3        3        -        -        - │
  └────────────────────────────────────────────────────────────────────────────────────────────────┘
    ✔  All specs passed!                        00:02        3        3        -        -        -

ソースコード

ソースコードはimba2-json-beautifier repositoryです.
また、see the live version here .

今度来る

次のエピソードでは、私はimba 2でもう少し複雑なプロジェクトをしようとします.