You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

72 lines
1.9 KiB

import { colors } from './subjects/fifty-shades-of-cold/data.js'
colors.sort()
const cold = ['aqua', 'blue', 'turquoise', 'green', 'purple', 'cyan', 'navy']
const isCold = color => cold.some(coldColor => color.includes(coldColor))
const toClass = (a, b) => `.${a} { background: ${b} }`
const toDiv = (a, b) => `<div class="${a}">${b}</div>`
export const tests = []
tests.push(async ({ page, eq }) => {
// check that the css is properly generated
const style = await page.$$eval('style', nodes => nodes[1].innerHTML)
const classes = style
.split('}')
.map(s => s.replace(/(\.|{|:|;|\s+)/g, ''))
.filter(Boolean)
.sort()
for (const [i, c] of colors.entries()) {
if (!classes[i]) throw Error(`Not enough class (expected: ${c})`)
const [a, b] = classes[i].split('background')
eq(toClass(a, b), toClass(c, c))
}
})
tests.push(async ({ page, eq }) => {
// check that the divs are properly generated
const values = await page.$$eval('div', nodes =>
nodes.map(n => [n.className, n.textContent]),
)
const divs = values.map(v => toDiv(...v)).sort()
let skipped = 0
for (const [i, c] of colors.entries()) {
if (isCold(c)) {
if (!values[i - skipped]) throw Error(`Not enough div (expected: ${c})`)
eq(divs[i - skipped], toDiv(c, c))
continue
}
skipped++
if (divs.includes(toDiv(c, c))) {
throw Error(`div ${toDiv(c, c)} is not very cold`)
}
}
})
tests.push(async ({ page, eq }) => {
// test that clicking update the color accordingly
const coldColors = colors.filter(isCold)
for (const c of coldColors) {
await page.$$eval(
'div',
(nodes, c) => nodes.find(n => n.textContent === c).click(),
c,
)
const count = await page.$$eval(
'div',
(nodes, c) => nodes.filter(n => n.className === c).length,
c,
)
eq(count, coldColors.length)
}
})