test: add extra tests to github provider (#66)

* test: add extra tests to github provider

This includes Enzyme and some Jest matchers for Enzyme.

* pipeline: disable lts node due to lack of async await support

This creates an issue when testing Async components.

.travis.yml

@@ -2,7 +2,6 @@
 language: node_js
 node_js:
   - node
-  - lts/*
 
 os:
   - linux
@@ -37,11 +36,11 @@ deploy:
     on:
       condition: $TRAVIS_OS_NAME = linux
       branch: develop
-      node: lts/*
+      node: node
   - provider: script
     skip_cleanup: true
     script: npx semantic-release
     on:
       condition: $TRAVIS_OS_NAME = linux
       branch: master
-      node: lts/*
+      node: node

package.json

@@ -27,7 +27,10 @@
 		"@semantic-release/changelog": "^3.0.0",
 		"codecov": "^3.1.0",
 		"conventional-changelog-peakfijn": "^0.8.0",
+		"enzyme": "^3.7.0",
+		"enzyme-adapter-react-16": "^1.6.0",
 		"jest-chain": "^1.0.4",
+		"jest-enzyme": "^7.0.0",
 		"now": "^11.4.6",
 		"react-scripts": "2.0.5",
 		"release-rules-peakfijn": "^0.8.0",

src/providers/github.js

@@ -5,6 +5,17 @@ import { createInstance } from 'react-async';
  */
 export const username = process.env.REACT_APP_GITHUB_USERNAME || 'byCedric';
 
+/**
+ * Get all (GitHub) keywords from a text.
+ * It will find all words starting with `@` or `#` and return then without this character.
+ *
+ * @param  {string?} text
+ * @return {string[]}
+ */
+export const findKeywords = (text) => (
+	((text || '').match(/[@#]([a-z0-9]+)/gi) || []).map(value => value.substr(1))
+);
+
 /**
  * Fetch the user information from the GitHub API.
  *
@@ -24,14 +35,3 @@ export const fetchUser = () => (
  * @return {React.Component}
  */
 export const AsyncUser = createInstance({ promiseFn: fetchUser });
-
-/**
- * Get all (GitHub) keywords from a text.
- * It will find all words starting with `@` or `#` and return then without this character.
- *
- * @param  {string?} text
- * @return {string[]}
- */
-export const findKeywords = (text) => (
-	((text || '').match(/[@#]([a-z0-9]+)/gi) || []).map(value => value.substr(1))
-);

src/providers/github.test.js

@@ -1,6 +1,19 @@
-import { findKeywords } from './github';
+import React from 'react';
+import { mount } from 'enzyme';
+import {
+	username,
+	findKeywords,
+	fetchUser,
+	AsyncUser,
+} from './github';
 
 describe('providers/github', () => {
+	describe('username', () => {
+		it('is defined', () => {
+			expect(username).toBeDefined();
+		});
+	});
+
 	describe('findKeywords', () => {
 		it('finds mentions from text', () => {
 			expect(findKeywords('Something something @github something @bycedric.'))
@@ -27,4 +40,32 @@ describe('providers/github', () => {
 			expect(findKeywords('Something something something.')).toHaveLength(0);
 		});
 	});
+
+	describe('fetchUser', () => {
+		it('fetches the github user data', async () => {
+			global.fetch = jest.fn().mockResolvedValue({ ok: true, json: () => ({ username }) });
+
+			expect(await fetchUser()).toEqual({ username });
+			expect(fetch).toHaveBeenCalledWith(`https://api.github.com/users/${username}`);
+		});
+	});
+
+	describe('AsyncUser', () => {
+		it('fetches the github user data with a component', async () => {
+			const promise = Promise.resolve({ ok: true, json: () => ({ username }) });
+
+			global.fetch = jest.fn(() => promise);
+
+			const component = mount(
+				<AsyncUser>
+					{state => (state.data && state.data.username) || null}
+				</AsyncUser>
+			);
+
+			expect(component).toBeEmptyRender();
+			await promise;
+			expect(component).toIncludeText(username);
+			expect(fetch).toHaveBeenCalledWith(`https://api.github.com/users/${username}`);
+		});
+	});
 });

src/setupTests.js

@@ -1 +1,6 @@
 import 'jest-chain';
+import 'jest-enzyme';
+import Enzyme from 'enzyme';
+import Adapter from 'enzyme-adapter-react-16';
+
+Enzyme.configure({ adapter: new Adapter() });