Merge pull request #75 from oslabs-beta/dev

Dev to master

sapling/package.json

@@ -10,8 +10,9 @@
 		"vscode": "^1.60.0"
 	},
 	"categories": [
-		"Other"
+		"Visualization"
 	],
+	"keywords": ["react", "component hierarchy", "devtools"],
 	"activationEvents": [
 		"onStartupFinished"
 	],

sapling/src/test/suite/extension.test.ts

@@ -1,4 +1,5 @@
-import * as assert from 'assert';
+import { describe, suite , test, before} from 'mocha';
+import { expect } from 'chai';
 
 // You can import and use all API from the 'vscode' module
 // as well as import your extension to test it
@@ -8,13 +9,36 @@ import * as vscode from 'vscode';
 suite('Extension Test Suite', () => {
 	vscode.window.showInformationMessage('Start all tests.');
 
-	test('Sample test', () => {
-		assert.strictEqual(-1, [1, 2, 3].indexOf(5));
-		assert.strictEqual(-1, [1, 2, 3].indexOf(0));
-	});
+	describe('Sapling loads correctly', () => {
+    let saplingExtension;
+    before (() => {
+      saplingExtension = vscode.extensions.getExtension('team-sapling.sapling');
+    });
 
-	test('Sample test 2', () => {
-		assert.strictEqual(1, 1);
-	});
+    test('Sapling is registered as an extension', () => {
+      expect(saplingExtension).to.not.be.undefined;
+    });
 
+    test('Sapling extension is activated after VSCode startup', () => {
+      expect(saplingExtension.isActive).to.be.true;
+    });
+
+    test('Sapling extension package.json exists', () => {
+      expect(saplingExtension.packageJSON).to.not.be.undefined;
+    });
+  });
+
+  // describe('It registers saplings commands successfully', () => {
+  //   let commandList;
+  //   before( (done) => {
+	// 		vscode.commands.getCommands().then(commands => {
+  //       commandList = commands;
+  //       done();
+  //     });
+	// 	});
+
+  //   test('It registers the sapling.generateTree command', () => {
+  //     expect(commandList).to.be.an('array').that.does.include('sapling.generateTree');
+  //   });
+  // });
 });

sapling/src/test/suite/parser.test.ts

@@ -83,10 +83,12 @@ suite('Parser Test Suite', () => {
 			tree = parser.parse();
 		});
 
-		test('Should parse destructured imports', () => {
-			expect(tree.children).to.have.lengthOf(2);
+		test('Should parse destructured and third party imports', () => {
+			expect(tree.children).to.have.lengthOf(3);
 			expect(tree.children[0]).to.have.own.property('name').that.is.oneOf(['Switch', 'Route']);
 			expect(tree.children[1]).to.have.own.property('name').that.is.oneOf(['Switch', 'Route']);
+			expect(tree.children[2]).to.have.own.property('name').that.is.equal('Tippy');
+
 		});
 
 		test('reactRouter should be designated as third party and reactRouter', () => {
@@ -97,10 +99,28 @@ suite('Parser Test Suite', () => {
 			expect(tree.children[1]).to.have.own.property('reactRouter').to.be.true;
 		});
 
-		//test for third party without reactRouter
+		test('Tippy should be designated as third party and not reactRouter', () => {
+			expect(tree.children[2]).to.have.own.property('thirdParty').to.be.true;
+			expect(tree.children[2]).to.have.own.property('reactRouter').to.be.false;
+		});
 	});
 
-	// TEST 3: WOBBEGAINZ
+	// TEST 3: IDENTIFIES REDUX STORE CONNECTION
+	describe('It identifies a Redux store connection and designates the component as such', () => {
+		before(() => {
+			file = path.join(__dirname, '../../../src/test/test_apps/test_3/index.js');
+			parser = new SaplingParser(file);
+			tree = parser.parse();
+		});
+
+		test('The reduxConnect properties of the connected component and the unconnected component should be true and false, respectively', () => {
+			expect(tree.children[1].children[0].name).to.equal('ConnectedContainer');
+			expect(tree.children[1].children[0]).to.have.own.property('reduxConnect').that.is.true;
+
+			expect(tree.children[1].children[1].name).to.equal('UnconnectedContainer');
+			expect(tree.children[1].children[1]).to.have.own.property('reduxConnect').that.is.false;
+		});
+	});
 
 	// TEST 4: ALIASED IMPORTS
 	describe('It works for aliases', () => {
@@ -156,7 +176,7 @@ suite('Parser Test Suite', () => {
 		});
 	});
 
-	// TEST 6: Bad import of App2 from App1 Component
+	// TEST 6: BAD IMPORT OF APP2 FROM APP1 COMPONENT
 	describe('It works for badly imported children nodes', () => {
 		before(() => {
 			file = path.join(__dirname, '../../../src/test/test_apps/test_6/index.js');
@@ -170,7 +190,7 @@ suite('Parser Test Suite', () => {
 		});
 	});
 
-	// TEST 7: Syntax error in app file causes parser error
+	// TEST 7: SYNTAX ERROR IN APP FILE CAUSES PARSER ERROR
 	describe('It should log an error when the parser encounters a javascript syntax error', () => {
 		before(() => {
 			file = path.join(__dirname, '../../../src/test/test_apps/test_7/index.js');
@@ -185,14 +205,33 @@ suite('Parser Test Suite', () => {
 		});
 	});
 
-	// Test 8: Props check
+	// TEST 8: MULTIPLE PROPS ON ONE COMPONENT
 	describe('It should properly count repeat components and consolidate and grab their props', () => {
 		before(() => {
 			file = path.join(__dirname, '../../../src/test/test_apps/test_8/index.js');
 			parser = new SaplingParser(file);
 			tree = parser.parse();
 		});
 
+		test('Grandchild should have a count of 1', () => {
+			expect(tree.children[0].children[0]).to.have.own.property('count').that.equals(1);
+		});
+
+		test('Grandchild should have the correct three props', () => {
+			expect(tree.children[0].children[0].props).has.own.property('prop1').that.is.true;
+			expect(tree.children[0].children[0].props).has.own.property('prop2').that.is.true;
+			expect(tree.children[0].children[0].props).has.own.property('prop3').that.is.true;
+		});
+	});
+
+	// TEST 9: FINDING DIFFERENT PROPS ACROSS TWO OR MORE IDENTICAL COMPONENTS
+	describe('It should properly count repeat components and consolidate and grab their props', () => {
+		before(() => {
+			file = path.join(__dirname, '../../../src/test/test_apps/test_9/index.js');
+			parser = new SaplingParser(file);
+			tree = parser.parse();
+		});
+
 		test('Grandchild should have a count of 2', () => {
 			expect(tree.children[0].children[0]).to.have.own.property('count').that.equals(2);
 		});
@@ -203,7 +242,7 @@ suite('Parser Test Suite', () => {
 		});
 	});
 
-	// Test 10: check children works and component works
+	// TEST 10: CHECK CHILDREN WORKS AND COMPONENTS WORK
 	describe('It should render children when children are rendered as values of prop called component', () => {
 		before(() => {
 			file = path.join(__dirname, '../../../src/test/test_apps/test_10/index.jsx');
@@ -219,4 +258,28 @@ suite('Parser Test Suite', () => {
 			expect(tree.children[1].children[4]).to.have.own.property('name').that.is.equal('HistoryDisplay');
 		});
 	});
+
+	// TEST 11: PARSER DOESN'T BREAK UPON RECURSIVE COMPONENTS
+	describe('It should render the second call of mutually recursive components, but no further', () => {
+		before(() => {
+			file = path.join(__dirname, '../../../src/test/test_apps/test_11/index.js');
+			parser = new SaplingParser(file);
+			tree = parser.parse();
+		});
+
+		test('Tree should not be undefined', () => {
+			expect(tree).to.not.be.undefined;
+		});
+
+		test('Tree should have an index component while child App1, grandchild App2, great-grandchild App1', () => {
+			expect(tree).to.have.own.property('name').that.is.equal('index');
+			expect(tree.children).to.have.lengthOf(1);
+			expect(tree.children[0]).to.have.own.property('name').that.is.equal('App1');
+			expect(tree.children[0].children).to.have.lengthOf(1);
+			expect(tree.children[0].children[0]).to.have.own.property('name').that.is.equal('App2');
+			expect(tree.children[0].children[0].children).to.have.lengthOf(1);
+			expect(tree.children[0].children[0].children[0]).to.have.own.property('name').that.is.equal('App1');
+			expect(tree.children[0].children[0].children[0].children).to.have.lengthOf(0);
+		});
+	});
 });

sapling/src/test/test_apps/test_2/index.js

@@ -1,6 +1,7 @@
 import React from 'react';
 import { render } from 'react-dom';
 import { Switch, Route } from 'react-router-dom';
+import Tippy from 'tippy';
 
 // TEST 2 - Third Party Components, Destructuring Import
 
@@ -9,5 +10,6 @@ render(
     <Switch >
       <Route component={App}>
       </Route>
+      <Tippy />
     </Switch>
   </div>, document.getElementById('root'));

sapling/src/test/test_apps/test_3/App.jsx

@@ -0,0 +1,21 @@
+import React, { Component } from 'react';
+import ConnectedContainer from './containers/ConnectedContainer'
+import UnconnectedContainer from './containers/UnconnectedContainer'
+
+
+class App extends Component {
+  constructor(props) {
+    super(props);
+  }
+
+  render() {
+    return (
+      <div>
+          <ConnectedContainer />
+          <UnconnectedContainer />
+      </div>
+    );
+  }
+}
+
+export default App;

sapling/src/test/test_apps/test_3/actions/actions.js

@@ -0,0 +1,10 @@
+import * as types from '../constants/actionTypes';
+
+export const fakeAction1Creator = () => ({
+  type: types.FAKE_ACTION_1,
+});
+
+export const fakeAction2Creator = () => ({
+  type: types.FAKE_ACTION_2,
+});
+