Readings discussion

• questions?

Testing

Meteor Testing Guide

Types of Testing

• Unit test
• Integration test
• Acceptance test (end to end test)
• Load test

Testing in Meteor

Install the driver

meteor add practicalmeteor:mocha

Run the tests

meteor test --driver-package practicalmeteor:mocha --port 3100

practicalmeteor:mocha shows results in the browser

Test files

Will load files with .tests.js on them

Base code

Testing Database

We need

• xolvio:cleaner for cleaning the db
• dburles:factory for inserting data
• faker generates fake data

Install dependencies

meteor add xolvio:cleaner
meteor add dburles:factory
meteor npm install faker --save-dev

Add test files

Create a ./imports/ui/players.tests.js file

/* eslint-env mocha */

import { Meteor } from "meteor/meteor";
import { assert } from "meteor/practicalmeteor:chai";
import { resetDatabase } from "meteor/xolvio:cleaner";
import { Factory } from "meteor/dburles:factory";
import { sinon } from 'meteor/practicalmeteor:sinon';
import { Players } from "./players.js";
import faker  from "faker";

if (Meteor.isServer) {
  describe("Players", () => {
    describe("methods", () => {
      // Generate a random name
      const name = faker.name.findName();
      let currentUser;
      beforeEach(() => {
        Players.remove({});

        // Stud the user
        resetDatabase();
        Factory.define("user", Meteor.users, {
          username: name,
        });
        currentUser = Factory.create("user");
        sinon.stub(Meteor, "user");
        Meteor.user.returns(currentUser);

        Players.insert({
          name: name,
          x: 10,
          y: 10
        });
      });

      afterEach(() => {
        Meteor.user.restore();
        resetDatabase();
      });

      it("can update position", () => {

        const updatePlayer = Meteor.server.method_handlers["players.update"];

        // Set up a fake method invocation that looks like what the method expects
        const invocation = { currentUser };

        // Run the method with `this` set to the fake invocation
        updatePlayer.apply(invocation, [15,15]);

        let newPlayer = Players.findOne({name:name});

        assert.equal(newPlayer.x, 15);
        assert.equal(newPlayer.y, 15);

      });
    });
  });
}

Testing React

We need:

• Enzyme

Install dependencies

meteor npm install --save-dev enzyme
meteor npm install --save-dev react-test-renderer@15
meteor npm install --save-dev enzyme enzyme-adapter-react-15

Add test files

Create a ./both/setup.tests.js that setups the adapter for enzyme

Then create a ./imports/ui/Controls.tests.js that test the Controls React component

./both/setup.tests.js

// setup file
import { configure } from "enzyme";
import Adapter from "enzyme-adapter-react-15";

configure({ adapter: new Adapter() });

./imports/ui/Controls.tests.js

import React from "react";
import { shallow } from "enzyme";
import { chai } from "meteor/practicalmeteor:chai";
import Controls from "./Controls.jsx";


describe("Controls", () => {
  it("should render", () => {

    const controls = shallow(<Controls onMove={this.onMove}></Controls>);
    chai.assert(controls.hasClass("Controls"));
    chai.assert(controls.find("button").length, 4);
  });
});