Merge pull request #29 from kremalicious/feature/lighthouse

add lighthouse test

.travis.yml

@@ -1,6 +1,10 @@
+sudo: required
 language: node_js
 node_js: node
 
+addons:
+  chrome: stable
+
 cache:
   directories:
     - node_modules
@@ -9,6 +13,12 @@ cache:
 install:
   - npm i
 
+before_script:
+  - export DISPLAY=:99.0
+  - export CHROME_PATH="$(pwd)/chrome-linux/chrome"
+  - sh -e /etc/init.d/xvfb start
+  - sleep 3 # wait for xvfb to boot
+
 script:
   - npm test
   - npm run build

package.json

@@ -14,7 +14,7 @@
     "start": "npm run svg && ./node_modules/gatsby/dist/bin/gatsby.js develop",
     "format": "prettier --write 'src/**/*.{js,jsx}'",
     "format:css": "prettier-stylelint --write --quiet 'src/**/*.{css,scss}'",
-    "test": "npm run lint",
+    "test": "npm run lint && ./node_modules/.bin/ava **/*.test.js --verbose",
     "deploy": "./scripts/deploy.sh",
     "new": "node ./scripts/new.js",
     "svg": "./scripts/svg.sh"
@@ -48,13 +48,16 @@
   },
   "devDependencies": {
     "@svgr/cli": "^2.3.0",
+    "ava": "^0.25.0",
     "babel-eslint": "^9.0.0",
+    "chrome-launcher": "^0.10.2",
     "eslint": "^5.5.0",
     "eslint-config-prettier": "^3.0.1",
     "eslint-loader": "^2.1.0",
     "eslint-plugin-graphql": "^2.1.1",
     "eslint-plugin-prettier": "^2.6.2",
     "eslint-plugin-react": "^7.11.1",
+    "lighthouse": "^3.1.1",
     "ora": "^3.0.0",
     "prepend": "^1.0.2",
     "prettier": "^1.14.2",

scripts/lighthouse.test.js

@@ -0,0 +1,52 @@
+const chromeLauncher = require('chrome-launcher')
+const { test } = require('ava')
+const lighthouse = require('lighthouse')
+const { siteUrl } = require('../gatsby-config').siteMetadata
+
+const launchChromeAndRunLighthouse = (
+  url,
+  opts = { chromeFlags: ['--headless'] },
+  config = null
+) =>
+  chromeLauncher.launch({ chromeFlags: opts.chromeFlags }).then(chrome => {
+    opts.port = chrome.port
+    return lighthouse(url, opts, config).then(results =>
+      chrome.kill().then(() => results.lhr)
+    )
+  })
+
+let scores
+test.before(async () => {
+  console.log(`Auditing ${siteUrl}.\n`) // eslint-disable-line no-console
+  scores = await launchChromeAndRunLighthouse(siteUrl).then(
+    ({ categories }) => categories
+  )
+})
+
+const logScore = score => `Is ${score * 100}.`
+
+const testOutput = (t, metric) => {
+  const score = scores[metric].score
+  t.log(logScore(score))
+  return score >= 0.9 ? t.pass() : t.fail()
+}
+
+test('Performance Score above 90', t => {
+  testOutput(t, 'performance')
+})
+
+test('PWA Score above 90', t => {
+  testOutput(t, 'pwa')
+})
+
+test('Accessibility Score above 90', t => {
+  testOutput(t, 'accessibility')
+})
+
+test('Best Practices Score above 90', t => {
+  testOutput(t, 'best-practices')
+})
+
+test('SEO Score above 90', t => {
+  testOutput(t, 'seo')
+})