chrome-launcher + spelling fixes + docs

CHANGELOG.md

@@ -10,6 +10,7 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 ### Added
 - CODE_OF_CONDUCT.md, CONTRIBUTING.md
 - `getHtml()` and `setHtml()` APIs. [#112](https://github.com/graphcool/chromeless/pull/112), [#74](https://github.com/graphcool/chromeless/issues/74)
+- When using chromeless locally, chromeless will now boot chrome automatically [#120](https://github.com/graphcool/chromeless/pull/120) @joelgriffith
 
 ### Changed
 - `.evaluate()` now returns the resulting value or a Promise [#110](https://github.com/graphcool/chromeless/pull/110) @joelgriffith
@@ -18,6 +19,7 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 ### Fixed
 - Ensure latest version of Serverless is used during deployment. [#58](https://github.com/graphcool/chromeless/issues/58)
 - package repository url [#64](https://github.com/graphcool/chromeless/pull/64) @Hazealign
+- Spelling and minor bugfix when chromeless calls Version in CPD [#120](https://github.com/graphcool/chromeless/pull/120) @joelgriffith
 
 
 ## [1.0.1] - 2017-07-27

README.md

@@ -94,11 +94,9 @@ run().catch(console.error.bind(console))
 
 ### Local Chrome Usage
 
-To run Chromeless locally, you need a recent version of Chrome or Chrome Canary installed and running.
+To run Chromeless locally, you need a recent version of Chrome or Chrome Canary installed (version 60 or greater). By default, chromeless will start Chrome automatically and will default to the most recent version found on your system if there's multiple. You can override this behavior by starting Chrome yourself, and passing a flag of `launchChrome: false` in the `Chromeless` constructor.
 
-Chromeless requires Chrome version 60 or greater.
-
-For example, on MacOS:
+To launch Chrome yourself, and open the port for chromeless, follow this example:
 
 ```sh
 alias canary="/Applications/Google\ Chrome\ Canary.app/Contents/MacOS/Google\ Chrome\ Canary"

package.json

@@ -13,7 +13,9 @@
   },
   "main": "dist/src/index.js",
   "typings": "dist/src/index.d.ts",
-  "files": ["dist"],
+  "files": [
+    "dist"
+  ],
   "engines": {
     "node": ">= 6.10.0"
   },
@@ -27,6 +29,7 @@
   "dependencies": {
     "aws-sdk": "^2.90.0",
     "bluebird": "^3.5.0",
+    "chrome-launcher": "^0.3.2",
     "chrome-remote-interface": "^0.24.2",
     "cuid": "^1.3.8",
     "form-data": "^2.1.4",

serverless/src/run.ts

@@ -19,6 +19,7 @@ export default async (
   const chrome = new LocalChrome({
     ...options,
     remote: false,
+    launchChrome: false,
     cdp: { closeTab: true },
   })
 

src/api.ts

@@ -21,6 +21,7 @@ export default class Chromeless<T extends any> implements Promise<T> {
       waitTimeout: 10000,
       remote: false,
       implicitWait: true,
+      launchChrome: true,
 
       ...options,
 

src/chrome/local-runtime.ts

@@ -23,11 +23,11 @@ import {
 export default class LocalRuntime {
 
   private client: Client
-  private chromlessOptions: ChromelessOptions
+  private chromelessOptions: ChromelessOptions
 
-  constructor(client: Client, chromlessOptions: ChromelessOptions) {
+  constructor(client: Client, chromelessOptions: ChromelessOptions) {
     this.client = client
-    this.chromlessOptions = chromlessOptions
+    this.chromelessOptions = chromelessOptions
   }
 
   async run(command: Command): Promise<any> {
@@ -92,22 +92,22 @@ export default class LocalRuntime {
 
   private async waitSelector(selector: string): Promise<void> {
     this.log(`Waiting for ${selector}`)
-    await waitForNode(this.client, selector, this.chromlessOptions.waitTimeout)
+    await waitForNode(this.client, selector, this.chromelessOptions.waitTimeout)
     this.log(`Waited for ${selector}`)
   }
 
   private async click(selector: string): Promise<void> {
-    if (this.chromlessOptions.implicitWait) {
+    if (this.chromelessOptions.implicitWait) {
       this.log(`click(): Waiting for ${selector}`)
-      await waitForNode(this.client, selector, this.chromlessOptions.waitTimeout)
+      await waitForNode(this.client, selector, this.chromelessOptions.waitTimeout)
     }
 
     const exists = await nodeExists(this.client, selector)
     if (!exists) {
       throw new Error(`click(): node for selector ${selector} doesn't exist`)
     }
 
-    const {scale} = this.chromlessOptions.viewport
+    const {scale} = this.chromelessOptions.viewport
     await click(this.client, selector, scale)
     this.log(`Clicked on ${selector}`)
   }
@@ -126,9 +126,9 @@ export default class LocalRuntime {
 
   async type(text: string, selector?: string): Promise<void> {
     if (selector) {
-      if (this.chromlessOptions.implicitWait) {
+      if (this.chromelessOptions.implicitWait) {
         this.log(`type(): Waiting for ${selector}`)
-        await waitForNode(this.client, selector, this.chromlessOptions.waitTimeout)
+        await waitForNode(this.client, selector, this.chromelessOptions.waitTimeout)
       }
 
       const exists = await nodeExists(this.client, selector)
@@ -223,7 +223,7 @@ export default class LocalRuntime {
   }
 
   private log(msg: string): void {
-    if (this.chromlessOptions.debug) {
+    if (this.chromelessOptions.debug) {
       console.log(msg)
     }
   }

src/chrome/local.ts

@@ -1,5 +1,6 @@
 import { Chrome, Command, ChromelessOptions, Client } from '../types'
 import * as CDP from 'chrome-remote-interface'
+import { LaunchedChrome, launch } from 'chrome-launcher'
 import LocalRuntime from './local-runtime'
 import { evaluate } from '../util'
 
@@ -11,16 +12,31 @@ interface RuntimeClient {
 export default class LocalChrome implements Chrome {
   private options: ChromelessOptions
   private runtimeClientPromise: Promise<RuntimeClient>
+  private chromeInstance?: LaunchedChrome
 
   constructor(options: ChromelessOptions = {}) {
     this.options = options
 
     this.runtimeClientPromise = this.initRuntimeClient()
   }
 
-  private async initRuntimeClient(): Promise<RuntimeClient> {
+  private async startChrome(): Promise<Client> {
+    this.chromeInstance = await launch({
+      logLevel: this.options.debug ? 'info' : 'silent',
+      port: this.options.cdp.port
+    })
+    return await CDP({ port: this.chromeInstance.port })
+  }
+
+  private async connectToChrome(): Promise<Client> {
     const target = await CDP.New()
-    const client = await CDP({ target })
+    return await CDP({ target })
+  }
+
+  private async initRuntimeClient(): Promise<RuntimeClient> {
+    const client = this.options.launchChrome ?
+      await this.startChrome() :
+      await this.connectToChrome()
 
     await this.setViewport(client)
 
@@ -39,7 +55,7 @@ export default class LocalChrome implements Chrome {
       fitWindow: false, // as we cannot resize the window, `fitWindow: false` is needed in order for the viewport to be resizable
     }
 
-    const versionResult = await CDP.Version()
+    const versionResult = await CDP.Version({ port: this.chromeInstance.port })
     const isHeadless = versionResult['User-Agent'].includes('Headless')
 
     if (viewport.height && viewport.width) {
@@ -80,6 +96,10 @@ export default class LocalChrome implements Chrome {
       CDP.Close({ id: client.target.id })
     }
 
+    if (this.chromeInstance) {
+      this.chromeInstance.kill()
+    }
+
     await client.close()
   }
 }

src/types.ts

@@ -32,6 +32,7 @@ export interface ChromelessOptions {
     height?: number // 900 if headless
     scale?: number // 1
   }
+  launchChrome?: boolean // auto-launch chrome (local) `true`
   cdp?: CDPOptions
   remote?: RemoteOptions | boolean
 }

src/util.ts

@@ -53,7 +53,7 @@ export async function wait(timeout: number): Promise<void> {
 export async function nodeExists(client: Client, selector: string): Promise<boolean> {
   const {Runtime} = client
   const exists = (selector) => {
-    return document.querySelector(selector)
+    return !!document.querySelector(selector)
   }
 
   const expression = `(${exists})(\`${selector}\`)`
@@ -62,9 +62,7 @@ export async function nodeExists(client: Client, selector: string): Promise<bool
     expression,
   })
 
-  // counter intuitive: if it is a real object and not just null,
-  // the chrome debugger won't return a value but return a objectId
-  return typeof result.result.value === 'undefined'
+  return result.result.value
 }
 
 export async function getClientRect(client, selector): Promise<ClientRect> {

yarn.lock

@@ -48,10 +48,22 @@
   version "3.5.8"
   resolved "https://registry.yarnpkg.com/@types/bluebird/-/bluebird-3.5.8.tgz#242a83379f06c90f96acf6d1aeab3af6faebdb98"
 
+"@types/core-js@^0.9.41":
+  version "0.9.42"
+  resolved "https://npm.corp.appnexus.com/@types%2fcore-js/-/core-js-0.9.42.tgz#dd6da92cd7d5ab5ca0b4477524537c3e633b6bce"
+
 "@types/cuid@^1.3.0":
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/@types/cuid/-/cuid-1.3.0.tgz#20b0e00ca555df564866bc52d2e251bf90c88db7"
 
+"@types/mkdirp@^0.3.29":
+  version "0.3.29"
+  resolved "https://npm.corp.appnexus.com/@types%2fmkdirp/-/mkdirp-0.3.29.tgz#7f2ad7ec55f914482fc9b1ec4bb1ae6028d46066"
+
+"@types/[email protected]":
+  version "6.0.66"
+  resolved "https://npm.corp.appnexus.com/@types%2fnode/-/node-6.0.66.tgz#5680b74a6135d33d4c00447e7c3dc691a4601625"
+
 "@types/node@^8.0.15":
   version "8.0.16"
   resolved "https://registry.yarnpkg.com/@types/node/-/node-8.0.16.tgz#5aa51abd72621a0ce53fb86bccd76825ee1b4ca9"
@@ -774,6 +786,17 @@ chokidar@^1.4.2:
   optionalDependencies:
     fsevents "^1.0.0"
 
+chrome-launcher@^0.3.2:
+  version "0.3.2"
+  resolved "https://npm.corp.appnexus.com/chrome-launcher/-/chrome-launcher-0.3.2.tgz#c3a89e40ed2462899bac809417c4d7c451d5de05"
+  dependencies:
+    "@types/core-js" "^0.9.41"
+    "@types/mkdirp" "^0.3.29"
+    "@types/node" "6.0.66"
+    lighthouse-logger "^1.0.0"
+    mkdirp "0.5.1"
+    rimraf "^2.6.1"
+
 chrome-remote-interface@^0.24.2:
   version "0.24.2"
   resolved "https://registry.yarnpkg.com/chrome-remote-interface/-/chrome-remote-interface-0.24.2.tgz#43a05440a1fa60b73769e72f3e7892ac11d66eba"
@@ -1005,7 +1028,7 @@ date-time@^2.1.0:
   dependencies:
     time-zone "^1.0.0"
 
-debug@^2.1.1, debug@^2.2.0:
+debug@^2.1.1, debug@^2.2.0, debug@^2.6.8:
   version "2.6.8"
   resolved "https://registry.yarnpkg.com/debug/-/debug-2.6.8.tgz#e731531ca2ede27d188222427da17821d68ff4fc"
   dependencies:
@@ -1886,6 +1909,12 @@ leven@^1.0.0:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/leven/-/leven-1.0.2.tgz#9144b6eebca5f1d0680169f1a6770dcea60b75c3"
 
+lighthouse-logger@^1.0.0:
+  version "1.0.0"
+  resolved "https://npm.corp.appnexus.com/lighthouse-logger/-/lighthouse-logger-1.0.0.tgz#c6abdfbbbf0b4a541ab33864802cbad8944bcc8c"
+  dependencies:
+    debug "^2.6.8"
+
 load-json-file@^1.0.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/load-json-file/-/load-json-file-1.1.0.tgz#956905708d58b4bab4c2261b04f59f31c99374c0"
@@ -2069,7 +2098,7 @@ minimist@^1.1.0, minimist@^1.1.3, minimist@^1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.0.tgz#a35008b20f41383eec1fb914f4cd5df79a264284"
 
-"mkdirp@>=0.5 0", mkdirp@^0.5.1:
+[email protected], "mkdirp@>=0.5 0", mkdirp@^0.5.1:
   version "0.5.1"
   resolved "https://registry.yarnpkg.com/mkdirp/-/mkdirp-0.5.1.tgz#30057438eac6cf7f8c4767f38648d6697d75c903"
   dependencies: