browser monkey

Reliable DOM testing

npm install browser-monkey

Browser Monkey is a DOM assertion library. It helps you write framework agnostic browser tests that are reliable in the face of asynchronous behaviours like animations, AJAX and delayed rendering. It also helps you to write tests that exhibit the semantic meaning of the page, as opposed to a jumble of CSS selectors.

• automatically waits for commands and assertions.
• create rich DSLs for your page structure.
• framework agnostic: works with React, Angular, jQuery, Hyperdom and many many more.
• can simulate text entry and clicks.
• returns promises that resolve when the elements are found.

Here is an example project that demonstrates how to use browser-monkey with Karma.

@dereke has made an excellent video of a TDD session using browser-monkey.

Docs

Docs Website

example

import createMonkey from "browser-monkey/create";
import createTestDiv from "browser-monkey/lib/createTestDiv";
import hyperdom from "hyperdom";
import App from "./app";

describe("beer app", () => {
  let page;

  beforeEach(() => {
    const $testContainer = createTestDiv();
    hyperdom.append($testContainer, new App());
    page = createMonkey($testContainer);
  });

  it("greets me", async () => {
    await page.find("h1").shouldHave({ text: "Hello Lubbers" });
  });

  it("shows me beer", async () => {
    await page.click("Beer");
    await page.shouldHave({ text: "Punk IPA" });
  });
});

Run this example

We're hiring!

Join our remote team and help us build amazing software. Check out our career opportunities.