thiagoa

// spec/javascripts/integration/twitter/mountComponent.spec.js

import { expect } from 'chai';
import sinon from 'sinon';
import createFixture from '../../support/createFixture';

describe('mountComponent', () => {
  let fixture;
  let server;

thiagoa

// app/assets/javascripts/app/twitter/mountComponent.js

export default function mountComponent(opts) {
}

thiagoa

export default function mountComponent(opts) {
  const containerNode = opts.containerNode;
  
  containerNode.innerHTML = `
    <div class="tweet"><p>Hi @dude!</p></div>
    <div class="tweet"><p>Pizza!</p></div>
  `;
}

thiagoa

const httpStatusCode = 200;
const contentType = { 'Content-Type': 'application/json' };
const serverResponse = JSON.stringify({ foo: 'bar' });
const server = sinon.fakeServer.create();

server.respondWith('GET', '/my/endpoint', [
  httpStatusCode, contentType, serverResponse
]);

performRequest();

thiagoa

// spec/javascripts/integration/twitter/fetchTimeline.spec.js

import { expect } from 'chai';
import sinon from 'sinon';

describe('fetchTimeline', () => {
  let server;

  beforeEach(() => {
    server = sinon.fakeServer.create();

thiagoa

// app/assets/javascxripts/app/twitter/fetchTimeline.js

import axios from 'axios';

export default function fetchTimeline(id) {
  return axios.get(`/twitter_timeline/${id}`);
}

thiagoa

// app/assets/javascripts/app/twitter/fetchTimeline.js

import { get } from 'axios';

const options = { responseType: 'json' };

export default function fetchTimeline(id) {
  return get(`/twitter_timeline/${id}`, options).then(response => response.data);
}

thiagoa

it('chains then callbacks', () => {
  server.respondWith('GET', '/twitter_timeline/thiago', [
    200, { 'Content-Type': 'application/json' }, JSON.stringify(response),
  ]);

  const promise = fetchTimeline('thiago').then((body) => {
    expect(body).to.deep.equal(response);

    return `${body.tweets[0].text} modified`;
  });

thiagoa

// spec/javascripts/support/createFakeTimelineServer.js

import sinon from 'sinon';

const headers = { 'Content-Type': 'application/json' };

export default function createFakeTimelineServer() {
  const server = sinon.fakeServer.create();

  server.autoRespond = true;

thiagoa

// spec/javascripts/integration/twitter/fetchTimeline.spec.js

import { expect } from 'chai';
import sinon from 'sinon';
import fetchTimeline from 'app/twitter/fetchTimeline';
import createFakeTimelineServer from '../../support/createFakeTimelineServer';

describe('fetchTimeline', () => {
  let server;