Nightmare tests

app/components/BrowserTests.js

@@ -0,0 +1,33 @@
+import React, { Component } from 'react'
+import { Button } from 'stardust'
+import autobind from 'autobind-decorator'
+
+import browserTest from '../content/lib/browser/runBrowserTest'
+
+const initialState = { status: null, err: null, stdout: null, stderr: null }
+
+export default class BrowserTests extends Component {
+  state = initialState
+
+  @autobind
+  testYahoo() {
+    this.setState({ ...initialState, status: '...running' })
+
+    browserTest('yahoo')
+      .then(res => {
+        this.setState({ ...res, status: 'passed' })
+      })
+      .catch(err => {
+        this.setState({ ...err, status: 'failed' })
+      })
+  }
+
+  render() {
+    return (
+      <div>
+        <Button onClick={this.testYahoo}>Test Yahoo</Button>
+        <pre>{JSON.stringify(this.state, null, 2)}</pre>
+      </div>
+    )
+  }
+}

app/containers/App.js

@@ -20,6 +20,9 @@ export default class App extends Component {
           <Link className='item' to='/assignments'>
             Assignments
           </Link>
+          <Link className='item' to='/browser-tests'>
+            Browser Tests
+          </Link>
           <Link className='item' to='/profile'>
             Profile
           </Link>

app/containers/BrowserTestsPage.js

@@ -0,0 +1,10 @@
+import React, { Component } from 'react'
+import BrowserTests from '../components/BrowserTests'
+
+export default class AssignmentsPage extends Component {
+  render() {
+    return (
+      <BrowserTests />
+    )
+  }
+}

app/content/lib/browser/runBrowserTest.js

@@ -0,0 +1,14 @@
+import cp from 'child_process'
+import Promise from 'bluebird'
+
+const runNightmare = (testPath) => new Promise((resolve, reject) => {
+  cp.execFile(`node`, [`app/content/lib/browser/${testPath}.js`], (err, stdout, stderr) => {
+    if (err) {
+      reject({ err, stdout, stderr })
+    } else {
+      resolve({ err, stdout, stderr })
+    }
+  })
+})
+
+export default runNightmare

app/content/lib/browser/yahoo.js

@@ -0,0 +1,11 @@
+import Nightmare from 'nightmare'
+const nightmare = Nightmare({ show: true })
+
+nightmare
+  .goto('http://yahoo.com')
+  .type('input[title="Search"]', 'github nightmare')
+  .click('#uh-search-button')
+  .wait('#main')
+  .evaluate(() => document.querySelector('#main .searchCenterMiddle li a').href)
+  .end()
+  .then((x) => console.log(x))

app/routes.js

@@ -4,13 +4,15 @@ import App from './containers/App'
 import HomePage from './containers/HomePage'
 import CounterPage from './containers/CounterPage'
 import AssignmentsPage from './containers/AssignmentsPage'
+import BrowserTestsPage from './containers/BrowserTestsPage'
 import ProfilePage from './containers/ProfilePage'
 
 export default (
   <Route path='/' component={App}>
     <IndexRoute component={HomePage} />
     <Route path='/counter' component={CounterPage} />
     <Route path='/assignments' component={AssignmentsPage} />
+    <Route path='/browser-tests' component={BrowserTestsPage} />
     <Route path='/profile' component={ProfilePage} />
   </Route>
 )

package.json

@@ -107,6 +107,7 @@
     "highlight.js": "^9.2.0",
     "invariant": "^2.2.0",
     "jquery": "^2.2.1",
+    "nightmare": "^2.2.0",
     "react": "^0.14.2",
     "react-dom": "^0.14.2",
     "react-markdown": "^2.1.0",