Merge pull request #3 from makeshift-array/unit-test

Unit test

Author: DennisMartinez

.gitignore

@@ -4,3 +4,4 @@
 npm-debug.log
 *.sublime-project
 *.sublime-workspace
+*.DS_Store

README.md

@@ -52,7 +52,16 @@ A list of features in this kit.
 * Font Support
   * Supported but no tooling, only copies from one folder to another.
 * Unit Test Support
-  * TODO: [Ava](https://www.npmjs.com/package/ava), Maybe?
+  * Karma test suite ([karma](https://www.npmjs.com/package/karma))
+    * [karma-phantomjs-launcher](https://www.npmjs.com/package/karma-phantomjs-launcher)
+  * Jasmin framework ([jasmin](https://www.npmjs.com/package/jasmine))
+    * [jasmine-ajax](https://github.com/jasmine/jasmine-ajax)
+    * [jasmine-jquery](https://www.npmjs.com/package/jasmine-jquery)
+  * Test coverage
+    * [karma-spec-reporter](https://www.npmjs.com/package/karma-spec-reporter)
+    * [karma-coverage](https://www.npmjs.com/package/karma-coverage)
+    * [istanbul](https://www.npmjs.com/package/istanbul)
+    * [isparta-loader](https://www.npmjs.com/package/isparta-loader)
 * Utility Support
   * Conditional Pipe Control ([gulp-if](https://www.npmjs.com/package/gulp-if))
   * Pipe Cleaner ([gulp-plumber](https://www.npmjs.com/package/gulp-plumber))

__tests__/Github-test.js

@@ -0,0 +1,143 @@
+import 'babel-polyfill'
+import $ from 'jquery'
+import 'jasmine-jquery'
+import 'jasmine-ajax'
+import { ok200, notFound404 } from './__helpers__/GithubResponses'
+import { GitHub } from '../src/js/modules/Github'
+
+jasmine.getFixtures().fixturesPath = 'base/src/modules'
+
+describe('Github.js - instantiation', () => {
+  let github = null
+
+  beforeEach(() => {
+    github = new GitHub('jfusco')
+  })
+
+  afterEach(() => {
+    github = null
+  })
+
+  it('exists in DOM', () => {
+    loadFixtures('github.html')
+
+    expect($('.github')).toBeInDOM()
+  })
+
+  it('should error if no username is passed in', () => {
+    // Test undefined
+    expect((() => {
+        new GitHub()
+      })
+    ).toThrowError(Error)
+
+    // Test empty string
+    expect((() => {
+        new GitHub('')
+      })
+    ).toThrowError(Error)
+  })
+
+  it('should set this.el to jQuery object', () => {
+    expect(github.el instanceof $).toBe(true)
+  })
+
+  it('should set a username', () => {
+    expect(github.username).toBe('jfusco')
+  })
+})
+
+describe('Github.js - ajax', () => {
+  const github = new GitHub('DennisMartinez')
+
+  let request
+
+  beforeEach(done => {
+    jasmine.Ajax.install()
+
+    github.getUserData()
+
+    request = jasmine.Ajax.requests.mostRecent()
+    request.respondWith(ok200)
+
+    done()
+  });
+
+  afterEach(() => {
+    jasmine.Ajax.uninstall();
+  })
+
+  it('sends the request to the right end point', () => {
+    expect(request.url).toBe('https://api.github.com/users/DennisMartinez')
+  });
+
+  it('uses the correct method', () => {
+    expect(request.method).toBe('GET')
+  });
+
+  it('should return the correct data', () => {
+    const data = JSON.parse(request.responseText)
+
+    expect(typeof data).toBe('object')
+    expect(request.status).toBe(200)
+    expect(data.name).toBe('Dennis Martinez')
+    expect(data.company).toBe('Verndale')
+  })
+})
+
+describe('Github.js - render', () => {
+  let github = null,
+    gitHubAvatar,
+    gitHubInfo
+
+  const data = JSON.parse(ok200.responseText)
+
+  beforeEach(() => {
+    loadFixtures('github.html')
+
+    github = new GitHub('DennisMartinez')
+    github.render(data)
+
+    gitHubAvatar = $('.github-avatar')
+    gitHubInfo = $('.github-info')
+  })
+
+  afterEach(() => {
+    github = null
+    gitHubAvatar = null
+    gitHubInfo = null
+  })
+
+  describe('avatar', () => {
+    it('should exist', () => {
+      expect(gitHubAvatar).toBeInDOM()
+    })
+
+    it('should render avatar attributes', () => {
+      const $avatar = gitHubAvatar.find('img')
+
+      expect($avatar.attr('src')).toBe(data.avatar_url)
+      expect($avatar.attr('alt')).toBe(data.name)
+    })
+  })
+
+  describe('info', () => {
+    it('should exist', () => {
+      expect(gitHubInfo).toBeInDOM()
+    })
+
+    it('should render user info', () => {
+      const $gitHubLink = gitHubInfo.find('a')
+      const $company = gitHubInfo.find('li:nth-child(2)')
+      const $email = gitHubInfo.find('li:nth-child(3)')
+      const $bio = gitHubInfo.find('p')
+
+      expect($gitHubLink.attr('href')).toBe(data.html_url)
+      expect($gitHubLink.text()).toBe(data.html_url)
+
+      expect($company.text()).toBe(`Company: ${data.company}`)
+      expect($email.text()).toBe(`Email: ${data.email}`)
+      expect($bio.text()).toBe(data.bio)
+    })
+  })
+})

__tests__/__helpers__/GithubResponses.js

@@ -0,0 +1,45 @@
+// 200
+export const ok200 = {
+  status: 200,
+  responseText: JSON.stringify({
+    avatar_url: "https://avatars1.githubusercontent.com/u/1375616?v=3",
+    bio: "mek a d weeb fun",
+    blog: null,
+    company: "Verndale",
+    created_at: "2012-01-24T16:19:15Z",
+    email: "[email protected]",
+    events_url: "https://api.github.com/users/DennisMartinez/events{/privacy}",
+    followers: 13,
+    followers_url: "https://api.github.com/users/DennisMartinez/followers",
+    following: 15,
+    following_url: "https://api.github.com/users/DennisMartinez/following{/other_user}",
+    gists_url: "https://api.github.com/users/DennisMartinez/gists{/gist_id}",
+    gravatar_id: "",
+    hireable: true,
+    html_url: "https://github.com/DennisMartinez",
+    id: 1375616,
+    location: "CO",
+    login: "DennisMartinez",
+    name: "Dennis Martinez",
+    organizations_url: "https://api.github.com/users/DennisMartinez/orgs",
+    public_gists: 20,
+    public_repos: 10,
+    received_events_url: "https://api.github.com/users/DennisMartinez/received_events",
+    repos_url: "https://api.github.com/users/DennisMartinez/repos",
+    site_admin: false,
+    starred_url: "https://api.github.com/users/DennisMartinez/starred{/owner}{/repo}",
+    subscriptions_url: "https://api.github.com/users/DennisMartinez/subscriptions",
+    type: "User",
+    updated_at: "2017-03-25T16:42:02Z",
+    url: "https://api.github.com/users/DennisMartinez"
+  })
+}
+
+// 404
+export const notFound404 = {
+  status: 404,
+  responseText: JSON.stringify({
+    documentation_url: "https://developer.github.com/v3",
+    message: "Not Found"
+  })
+}