pidgin/nest

Not sure what happened, but the DO logo only had the stroke and not the fill after deploying. I've changed it to just file, plain svg, and tested extensively in both chrome and firefox and it appears to be fine now...

2019-08-23, Gary Kramlich
93380b0d85b2
Not sure what happened, but the DO logo only had the stroke and not the fill after deploying. I've changed it to just file, plain svg, and tested extensively in both chrome and firefox and it appears to be fine now...
try {
var config = require('./diff-config.json')
} catch (e) {
config = {}
}
const {
dir = 'http://localhost:1313',
waitToScreenShotTime = 500,
additionalPages = ['404.html'],
verbose = false,
maxJobs = 15,
} = config
console.log('Config being used', {
dir,
waitToScreenShotTime,
additionalPages,
verbose,
maxJobs,
})
const fetch = require(/^http:/.test(dir) ? 'http' : 'https')
const Differencify = require('differencify')
const differencify = new Differencify()
// WARNING: Changing these values may invalidate previous snapshots
const viewports = Object.freeze({
phone: Object.freeze({ width: 320, height: 1000 }),
tablet: Object.freeze({ width: 768, height: 4000 }),
massive: Object.freeze({ width: 1440, height: 4000 }),
})
const viewportKeys = Object.keys(viewports)
const nonIdentical = []
;(async () => {
const stack = []
// Map the target pages
const pages = (await fetch_json(`${dir}/index.json`))
.map(u => u.uri)
.concat(additionalPages.map(p => `${dir}/${p}`))
.sort()
console.log(`Diffing these pages:`)
// Populates stack with tests
for (const pagePath of pages) {
console.log('\t' + pagePath.trim().replace(dir, ''))
for (const viewportName of viewportKeys) {
stack.push(() => checkPage(pagePath, viewportName))
}
}
// Run tests
await differencify.launchBrowser({ timeout: 0 })
await concurrence(stack)
await differencify.cleanup()
// Output results
if (nonIdentical.length) {
console.log(`Pages that have changed:`)
console.log(
nonIdentical
.sort()
.map(p => '\t' + p)
.join('\n')
)
} else {
console.log('No differences detected')
}
})()
/**
* Handles Differencify
* @param {string} url path to page
* @param {string} viewportName key to viewport config
*/
async function checkPage(url, viewportName) {
const viewport = viewports[viewportName]
const path = url.replace(dir, '')
const testName = `page-${viewportName}-${safeFileName(path)}`
try {
await differencify
.init({ testName, timeout: 0 })
.newPage()
.setViewport(viewport)
.goto(url)
.wait(waitToScreenShotTime)
.screenshot()
.toMatchSnapshot()
.result(result => {
if (!result) nonIdentical.push(`${viewportName} ${path}`)
})
.close()
.end()
} catch (error) {
console.error(error)
}
if (verbose) console.log(`checked ${viewportName} ${path}`)
}
/**
* Fetches and parses JSON from web resource
* @param {string} url to resource to fetch
*/
function fetch_json(url) {
return new Promise(resolve =>
fetch.get(url, res => {
res.setEncoding('utf8')
let body = ''
res.on('data', data => (body += data))
res.on('end', () => resolve(JSON.parse(body)))
})
)
}
/**
* Creates a file safe string
* @param {string} str Possibly unsafe url
*/
function safeFileName(str) {
return str
.replace(/[^a-z0-9]/gi, '_')
.toLowerCase()
.replace(/^_|_$/, '')
}
/**
* Handles concurrence
* @param {Function[]} stack The functions to be called
*/
function concurrence(stack) {
const er = e => console.error(e)
let count = 0
return new Promise(resolve => {
pull()
function pull() {
while (count < maxJobs) {
let fn = stack.pop()
if (!fn) return
fn()
.catch(er)
.then(cont)
.catch(er)
count++
}
}
function cont() {
count--
if (count === 0 && stack.length === 0) return resolve()
pull()
}
}).catch(er)
}