DEV Community

Cover image for Tests Everywhere - JavaScript
Roger Viñas Alcon
Roger Viñas Alcon

Posted on • Edited on

Tests Everywhere - JavaScript

GitHub logo rogervinas / tests-everywhere

🤠 Tests, Tests Everywhere!

JavaScript testing this simple Hello World with Jest

Show me the code

Implementation

  1. Create HelloMessage class in HelloMessage.js:
class HelloMessage {
  text = "Hello World!";
}
Enter fullscreen mode Exit fullscreen mode
  1. Create HelloConsole class in HelloConsole.js:
class HelloConsole {
  print(text) {
    console.log(text);
  }
}
Enter fullscreen mode Exit fullscreen mode
  1. Create HelloApp class in HelloApp.js:
class HelloApp {
  constructor(helloMessage, helloConsole) {
    this.helloMessage = helloMessage;
    this.helloConsole = helloConsole;
  }

  printHello() {
    this.helloConsole.print(this.helloMessage.text);
  }
}
Enter fullscreen mode Exit fullscreen mode
  1. Create main function in Main.js that wraps it all together:
const HelloMessage = require("./HelloMessage");
const HelloConsole = require("./HelloConsole");
const HelloApp = require("./HelloApp");

const message = new HelloMessage();
const console = new HelloConsole();
const app = new HelloApp(message, console);
app.printHello();
Enter fullscreen mode Exit fullscreen mode

Test

Following Jest > Getting Started guide ...

  1. Test HelloMessage in HelloMessage.test.js:
describe("HelloMessage", () => {
  it("should return hello world", () => {
    const message = new HelloMessage();
    expect(message.text).toBe("Hello World!");
  });
});
Enter fullscreen mode Exit fullscreen mode
  1. Test HelloApp in HelloApp.test.js:
// 2.1 Mock ./HelloMessage module
jest.mock("./HelloMessage");
// 2.2 Mock ./HelloConsole module
jest.mock("./HelloConsole");

describe("HelloApp", () => {
  it("should print hello message", () => {
    const messageText = "Hello Test!";

    // 2.3 Set mock implementation to be returned
    // anytime new HelloMessage() is called
    HelloMessage.mockImplementation(() => {
      return {
        text: messageText,
      };
    });
    // 2.4 Create a HelloMessage
    // that will be a mock thanks to 2.1 and 2.2
    const message = new HelloMessage();

    // 2.5 Create a HelloConsole
    // that will be a mock thanks to 2.3
    const console = new HelloConsole();

    // 2.6 Create a HelloApp, the one we want to test, passing the mocks
    const app = new HelloApp(message, console);
    // 2.7 Execute the method we want to test
    app.printHello();

    // 2.8 Verify HelloConsole mock print() method
    // has been called once with "Hello Test!"
    expect(console.print).toHaveBeenCalledTimes(1);
    expect(console.print).toHaveBeenCalledWith(messageText);
  });
});
Enter fullscreen mode Exit fullscreen mode
  1. Test output should look like:
> jest

 PASS  ./HelloMessage.test.js
 PASS  ./HelloApp.test.js

Test Suites: 2 passed, 2 total
Tests:       2 passed, 2 total
Snapshots:   0 total
Time:        1.229 s
Ran all test suites.
Enter fullscreen mode Exit fullscreen mode

Happy Testing! 💙

Heroku

Simplify your DevOps and maximize your time.

Since 2007, Heroku has been the go-to platform for developers as it monitors uptime, performance, and infrastructure concerns, allowing you to focus on writing code.

Learn More

Top comments (0)

A Workflow Copilot. Tailored to You.

Pieces.app image

Our desktop app, with its intelligent copilot, streamlines coding by generating snippets, extracting code from screenshots, and accelerating problem-solving.

Read the docs

AWS Security LIVE!

Hosted by security experts, AWS Security LIVE! showcases AWS Partners tackling real-world security challenges. Join live and get your security questions answered.

Tune in to the full event

DEV is partnering to bring live events to the community. Join us or dismiss this billboard if you're not interested. ❤️