create project

2025-01-31 22:08:00 +00:00 · 2021-07-27 10:54:21 +09:00 · 2021-07-27 10:54:21 +09:00 · 73a039d76f
commit 73a039d76f
parent 0c8620d3bb
16 changed files with 7014 additions and 0 deletions
--- a/.gitignore
+++ b/.gitignore
@ -0,0 +1,4 @@
 /dist/
 /node_modules/
 /.cache/
 /.parcel-cache/
--- a/README.md
+++ b/README.md
@ -0,0 +1,3 @@
 # Jest ハンズオン
 [![Edit in CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/github/kou029w/jest-hands-on)
--- a/codesandbox.config.json
+++ b/codesandbox.config.json
@ -0,0 +1 @@
 { "template": "parcel" }
--- a/index.html
+++ b/index.html
@ -0,0 +1,56 @@
 <!DOCTYPE html>
 <html lang="ja" dir="ltr">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width" />
    <title>jest-hands-on</title>
    <!-- @license https://cdn.jsdelivr.net/npm/@exampledev/new.css/LICENSE -->
    <link
      rel="stylesheet"
      href="https://cdn.jsdelivr.net/npm/@exampledev/new.css/new.min.css"
    />
  </head>
  <body>
    <h1>Jest ハンズオン</h1>
    <p>CodeSandboxの場合、[Tests]のパネルを開いて、テスト結果を確認します。</p>
    <iframe
      src="https://codesandbox.io/embed/github/kou029w/jest-hands-on?codemirror=1&module=%2Fsrc%2Fsum.test.js&previewwindow=tests"
      style="
        width: 100%;
        height: 500px;
        border: 0;
        border-radius: 4px;
        overflow: hidden;
      "
    ></iframe>
    <p>
      ローカル環境の場合、
      <code>npm test</code>
      コマンドを実行して、テスト結果を確認します。
    </p>
    <h2>ドキュメント</h2>
    <p>
      リファレンスとして
      <a href="https://jestjs.io/ja/docs/getting-started">Jestのドキュメント</a>
      を使用します。ご参照ください。
    </p>
    <h2>構成</h2>
    <p>
      src/*.test.js がテスト本体です。
      ファイルを配置することによって実行可能です。
    </p>
    <ul>
      <li>はじめましょう … sum.js, sum.test.js</li>
      <li>
        Matcherを使用する … toBe.test.js, toEqual.test.js, notToBe.test.js
      </li>
      <li>非同期コードのテスト … callback.test.js, promise.test.js</li>
      <li>セットアップと破棄 … setupTeardown.test.js, scope.test.js</li>
      <li>モック関数 … mock.test.js</li>
    </ul>
  </body>
 </html>
--- a/package.json
+++ b/package.json
@ -0,0 +1,15 @@
 {
  "name": "jest-hands-on",
  "version": "1.0.0",
  "private": true,
  "license": "CC0-1.0",
  "scripts": {
    "test": "jest",
    "start": "parcel index.html --open",
    "build": "parcel build index.html"
  },
  "devDependencies": {
    "jest": "^27.0.6",
    "parcel": "^2.0.0-beta.3.1"
  }
 }
--- a/src/callback.test.js
+++ b/src/callback.test.js
@ -0,0 +1,26 @@
 /** @license https://github.com/facebook/jest/blob/master/LICENSE */
 // ダミー
 const fetchData = (callback) => callback("peanut butter");
 // 実行しないでください!
 test.skip("the data is peanut butter", () => {
  function callback(data) {
    expect(data).toBe("peanut butter");
  }
  fetchData(callback);
 });
 test("the data is peanut butter", (done) => {
  function callback(data) {
    try {
      expect(data).toBe("peanut butter");
      done();
    } catch (error) {
      done(error);
    }
  }
  fetchData(callback);
 });
--- a/src/mock.test.js
+++ b/src/mock.test.js
@ -0,0 +1,26 @@
 /** @license https://github.com/facebook/jest/blob/master/LICENSE */
 function forEach(items, callback) {
  for (let index = 0; index < items.length; index++) {
    callback(items[index]);
  }
 }
 const mockCallback = jest.fn((x) => 42 + x);
 forEach([0, 1], mockCallback);
 test("このモック関数は2回呼ばれます", () => {
  expect(mockCallback.mock.calls.length).toBe(2);
 });
 test("このモック関数の最初の呼び出しのときの第1引数はゼロです", () => {
  expect(mockCallback.mock.calls[0][0]).toBe(0);
 });
 test("このモック関数の2回目の呼び出しのときの第1引数は1です", () => {
  expect(mockCallback.mock.calls[1][0]).toBe(1);
 });
 test("このモック関数の最初の呼び出しのときの戻り値は42です", () => {
  expect(mockCallback.mock.results[0].value).toBe(42);
 });
--- a/src/notToBe.test.js
+++ b/src/notToBe.test.js
@ -0,0 +1,9 @@
 /** @license https://github.com/facebook/jest/blob/master/LICENSE */
 test("adding positive numbers is not zero", () => {
  for (let a = 1; a < 10; a++) {
    for (let b = 1; b < 10; b++) {
      expect(a + b).not.toBe(0);
    }
  }
 });
--- a/src/promise.test.js
+++ b/src/promise.test.js
@ -0,0 +1,23 @@
 /** @license https://github.com/facebook/jest/blob/master/LICENSE */
 // ダミー
 const fetchData = () => Promise.resolve("peanut butter");
 test("the data is peanut butter", () => {
  return fetchData().then((data) => {
    expect(data).toBe("peanut butter");
  });
 });
 test("the data is peanut butter", () => {
  return expect(fetchData()).resolves.toBe("peanut butter");
 });
 test("the data is peanut butter", async () => {
  const data = await fetchData();
  expect(data).toBe("peanut butter");
 });
 test("the data is peanut butter", async () => {
  await expect(fetchData()).resolves.toBe("peanut butter");
 });
--- a/src/scope.test.js
+++ b/src/scope.test.js
@ -0,0 +1,14 @@
 /** @license https://github.com/facebook/jest/blob/master/LICENSE */
 beforeAll(() => console.log("1 - beforeAll"));
 afterAll(() => console.log("1 - afterAll"));
 beforeEach(() => console.log("1 - beforeEach"));
 afterEach(() => console.log("1 - afterEach"));
 test("", () => console.log("1 - test"));
 describe("Scoped / Nested block", () => {
  beforeAll(() => console.log("2 - beforeAll"));
  afterAll(() => console.log("2 - afterAll"));
  beforeEach(() => console.log("2 - beforeEach"));
  afterEach(() => console.log("2 - afterEach"));
  test("", () => console.log("2 - test"));
 });
--- a/src/setupTeardown.test.js
+++ b/src/setupTeardown.test.js
@ -0,0 +1,60 @@
 /** @license https://github.com/facebook/jest/blob/master/LICENSE */
 // ダミー
 const initializeCityDatabase = async () => {
  console.log("Cityデータベースの初期化処理");
 };
 const clearCityDatabase = async () => {
  console.log("Cityデータベースの消去");
 };
 const isCity = (city) => {
  // …なにかデータベースに依存する処理
  console.log(`${city} は都市です`);
  return true;
 };
 beforeEach(async () => {
  await initializeCityDatabase();
 });
 afterEach(async () => {
  await clearCityDatabase();
 });
 beforeAll(async () => {
  await initializeCityDatabase();
 });
 afterAll(async () => {
  await clearCityDatabase();
 });
 // ダミー
 const initializeFoodDatabase = async () => {
  console.log("Foodデータベースの初期化処理");
 };
 const isValidCityFoodPair = () => true;
 test("city database has Vienna", () => {
  expect(isCity("Vienna")).toBeTruthy();
 });
 test("city database has San Juan", () => {
  expect(isCity("San Juan")).toBeTruthy();
 });
 describe("matching cities to foods", () => {
  // このdescribeブロックのテストにのみ適用されます
  beforeEach(async () => {
    await initializeFoodDatabase();
  });
  test("Vienna <3 veal", () => {
    expect(isValidCityFoodPair("Vienna", "Wiener Schnitzel")).toBe(true);
  });
  test("San Juan <3 plantains", () => {
    expect(isValidCityFoodPair("San Juan", "Mofongo")).toBe(true);
  });
 });
--- a/src/sum.js
+++ b/src/sum.js
@ -0,0 +1,6 @@
 /** @license https://github.com/facebook/jest/blob/master/LICENSE */
 function sum(a, b) {
  return a + b;
 }
 module.exports = sum;
--- a/src/sum.test.js
+++ b/src/sum.test.js
@ -0,0 +1,7 @@
 /** @license https://github.com/facebook/jest/blob/master/LICENSE */
 const sum = require("./sum");
 test("adds 1 + 2 to equal 3", () => {
  expect(sum(1, 2)).toBe(3);
 });
--- a/src/toBe.test.js
+++ b/src/toBe.test.js
@ -0,0 +1,5 @@
 /** @license https://github.com/facebook/jest/blob/master/LICENSE */
 test("two plus two is four", () => {
  expect(2 + 2).toBe(4);
 });
--- a/src/toEqual.test.js
+++ b/src/toEqual.test.js
@ -0,0 +1,7 @@
 /** @license https://github.com/facebook/jest/blob/master/LICENSE */
 test("object assignment", () => {
  const data = { one: 1 };
  data["two"] = 2;
  expect(data).toEqual({ one: 1, two: 2 });
 });
--- a/yarn.lock
+++ b/yarn.lock
		`@ -0,0 +1,3 @@`
							`# Jest ハンズオン`

							`[![Edit in CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/github/kou029w/jest-hands-on)`