From d32fa5b09b723ff23bc42ee2f6c5e9922d181217 Mon Sep 17 00:00:00 2001 From: Clement Denis Date: Tue, 16 Jun 2020 12:07:20 +0200 Subject: [PATCH] update `get-them-all` tests --- puppeteer/get-them-all_test.js | 193 +++++++++++++------------------ puppeteer/test.js | 2 +- subjects/get-them-all/data.js | 47 ++++++++ subjects/get-them-all/index.html | 49 +------- 4 files changed, 127 insertions(+), 164 deletions(-) create mode 100644 subjects/get-them-all/data.js diff --git a/puppeteer/get-them-all_test.js b/puppeteer/get-them-all_test.js index b4d85c7f..3847c44a 100644 --- a/puppeteer/get-them-all_test.js +++ b/puppeteer/get-them-all_test.js @@ -1,169 +1,132 @@ -import { deepStrictEqual } from 'assert' -import puppeteer from 'puppeteer-core' -import people from '../assets/data/get-them-all.js' - -const config = { - headless: false, - executablePath: - '/Applications/Google Chrome.app/Contents/MacOS/Google Chrome', -} - -const browser = await puppeteer.launch(config) -const [page] = await browser.pages() -await page.goto('http://localhost:8000/dom-js/get-them-all/') - -const architects = people - .filter((p) => p.tag === 'a') - .map((e) => e.id) - .sort((a, b) => a.localeCompare(b)) - -const notArchitects = people - .filter((p) => p.tag !== 'a') - .map((e) => e.id) - .sort((a, b) => a.localeCompare(b)) - -const checkArchitects = async () => { +import { people } from './subjects/get-them-all/data.js' + +const getIds = predicate => + people + .filter(predicate) + .map(e => e.id) + .sort((a, b) => a.localeCompare(b)) + +const architects = getIds(p => p.tag === 'a') +const notArchitects = getIds(p => p.tag !== 'a') + +const classical = getIds(p => p.classe === 'classical') +const notClassical = getIds(p => p.tag === 'a' && p.classe !== 'classical') + +const active = getIds(p => p.classe === 'classical' && p.active) +const notActive = getIds( + p => p.tag === 'a' && p.classe === 'classical' && p.active === false, +) + +const bonanno = people.find(p => p.id === 'BonannoPisano').id +const notBonanno = getIds( + p => + p.tag === 'a' && + p.classe === 'classical' && + p.active && + p.id !== 'BonannoPisano', +) + +export const tests = [] + +tests.push(async ({ eq, page }) => { + // get architects const btnArchitect = await page.$(`#btnArchitect`) btnArchitect.click() await page.waitFor(500) - const selected = await page.$$eval('a', (nodes) => + const selected = await page.$$eval('a', nodes => nodes - .filter((node) => node.textContent === 'Architect') - .map((node) => node.id) + .filter(node => node.textContent === 'Architect') + .map(node => node.id) .sort((a, b) => a.localeCompare(b)), ) - const eliminated = await page.$$eval('span', (nodes) => + eq(selected, architects) + + const eliminated = await page.$$eval('span', nodes => nodes - .filter((node) => node.style.opacity === '0.2') - .map((node) => node.id) + .filter(node => node.style.opacity === '0.2') + .map(node => node.id) .sort((a, b) => a.localeCompare(b)), ) - deepStrictEqual(`architects: ${selected}`, `architects: ${architects}`) - deepStrictEqual( - `not architects: ${eliminated}`, - `not architects: ${notArchitects}`, - ) -} - -checkArchitects() -await page.waitFor(1000) - -// get classical -const classical = people - .filter((p) => p.classe === 'classical') - .map((e) => e.id) - .sort((a, b) => a.localeCompare(b)) + eq(eliminated, notArchitects) -const notClassical = people - .filter((p) => p.tag === 'a' && p.classe !== 'classical') - .map((e) => e.id) - .sort((a, b) => a.localeCompare(b)) + await page.waitFor(1000) +}) -const checkClassical = async () => { +tests.push(async ({ page, eq }) => { + // get classical const btnClassical = await page.$(`#btnClassical`) btnClassical.click() await page.waitFor(500) - const selected = await page.$$eval('.classical', (nodes) => + const selected = await page.$$eval('.classical', nodes => nodes - .filter((node) => node.textContent === 'Classical') - .map((node) => node.id) + .filter(node => node.textContent === 'Classical') + .map(node => node.id) .sort((a, b) => a.localeCompare(b)), ) - const eliminated = await page.$$eval('a:not(.classical)', (nodes) => + eq(selected, classical) + + const eliminated = await page.$$eval('a:not(.classical)', nodes => nodes - .filter((node) => node.style.opacity === '0.2') - .map((node) => node.id) + .filter(node => node.style.opacity === '0.2') + .map(node => node.id) .sort((a, b) => a.localeCompare(b)), ) - deepStrictEqual(`classical: ${selected}`, `classical: ${classical}`) - deepStrictEqual( - `not classical: ${eliminated}`, - `not classical: ${notClassical}`, - ) -} - -checkClassical() -await page.waitFor(1000) + eq(eliminated, notClassical) -// get active -const active = people - .filter((p) => p.classe === 'classical' && p.active) - .map((e) => e.id) - .sort((a, b) => a.localeCompare(b)) + await page.waitFor(1000) +}) -const notActive = people - .filter( - (p) => p.tag === 'a' && p.classe === 'classical' && p.active === false, - ) - .map((e) => e.id) - .sort((a, b) => a.localeCompare(b)) - -const checkActive = async () => { +tests.push(async ({ page, eq }) => { + // check active const btnActive = await page.$(`#btnActive`) btnActive.click() await page.waitFor(500) - const selected = await page.$$eval('.classical.active', (nodes) => + const selected = await page.$$eval('.classical.active', nodes => nodes - .filter((node) => node.textContent === 'Active') - .map((node) => node.id) + .filter(node => node.textContent === 'Active') + .map(node => node.id) .sort((a, b) => a.localeCompare(b)), ) + eq(selected, active) - const eliminated = await page.$$eval('.classical:not(.active)', (nodes) => + const eliminated = await page.$$eval('.classical:not(.active)', nodes => nodes - .filter((node) => node.style.opacity === '0.2') - .map((node) => node.id) + .filter(node => node.style.opacity === '0.2') + .map(node => node.id) .sort((a, b) => a.localeCompare(b)), ) - deepStrictEqual(`active: ${selected}`, `active: ${active}`) - deepStrictEqual(`not active: ${eliminated}`, `not active: ${notActive}`) -} - -checkActive() -await page.waitFor(1000) + eq(eliminated, notActive) + await page.waitFor(1000) +}) -// get bonanno -const bonanno = people.find((p) => p.id === 'BonannoPisano').id - -const notBonanno = people - .filter( - (p) => - p.tag === 'a' && - p.classe === 'classical' && - p.active && - p.id !== 'BonannoPisano', - ) - .map((e) => e.id) - .sort((a, b) => a.localeCompare(b)) - -const checkBonanno = async () => { +tests.push(async ({ page, eq }) => { + // get bonanno const btnBonanno = await page.$(`#btnBonanno`) btnBonanno.click() await page.waitFor(500) - const selected = await page.$eval('#BonannoPisano', (node) => { + const selected = await page.$eval('#BonannoPisano', node => { if (node.textContent === 'Bonanno Pisano') return node.id }) + eq(`bonanno: ${selected}`, `bonanno: ${bonanno}`) + const eliminated = await page.$$eval( 'a.classical.active:not(#BonannoPisano)', - (nodes) => + nodes => nodes - .filter((node) => node.style.opacity === '0.2') - .map((node) => node.id) + .filter(node => node.style.opacity === '0.2') + .map(node => node.id) .sort((a, b) => a.localeCompare(b)), ) - deepStrictEqual(`bonanno: ${selected}`, `bonanno: ${bonanno}`) - deepStrictEqual(`not bonanno: ${eliminated}`, `not bonanno: ${notBonanno}`) -} - -checkBonanno() + eq(eliminated, notBonanno) +}) diff --git a/puppeteer/test.js b/puppeteer/test.js index 511428ae..9315cd0f 100644 --- a/puppeteer/test.js +++ b/puppeteer/test.js @@ -40,7 +40,7 @@ const server = http.createServer(({ url, method }, response) => { let browser, code = 0 try { err && (console.error(err.stack) || process.exit(1)) - const { setup, tests } = await import(`./${exercise}_test.js`) + const { setup = () => {}, tests } = await import(`./${exercise}_test.js`) browser = await puppeteer.launch(config) const [page] = await browser.pages() await page.goto(`http://localhost:${PORT}/${exercise}/index.html`) diff --git a/subjects/get-them-all/data.js b/subjects/get-them-all/data.js new file mode 100644 index 00000000..9252ee70 --- /dev/null +++ b/subjects/get-them-all/data.js @@ -0,0 +1,47 @@ +export const people = [ + { id: 'LolaDunam', tag: 'span', classe: 'modern', active: false }, + { id: 'LeeMarley', tag: 'span', classe: 'baroque', active: false }, + { id: 'JeanDujardin', tag: 'a', classe: 'classical', active: true }, + { id: 'MarloStanfield', tag: 'span', classe: 'modern', active: false }, + { id: 'GeorgesDrumond', tag: 'span', classe: 'baroque', active: true }, + { id: 'JuliaWhite', tag: 'span', classe: 'modern', active: true }, + { id: 'BarneyLeberre', tag: 'span', classe: 'modern', active: true }, + { id: 'DavidCarretta', tag: 'a', classe: 'classical', active: false }, + { id: 'AugustoCesar', tag: 'span', classe: 'modern', active: true }, + { id: 'DavidGuetta', tag: 'a', classe: 'modern', active: false }, + { id: 'MarlonBrando', tag: 'a', classe: 'classical', active: false }, + { id: 'BonannoPisano', tag: 'a', classe: 'classical', active: true }, + { id: 'AvonBarksdale', tag: 'span', classe: 'baroque', active: true }, + { id: 'BarackObama', tag: 'span', classe: 'baroque', active: false }, + { id: 'MarcDupont', tag: 'span', classe: 'modern', active: false }, + { id: 'BillieElliott', tag: 'a', classe: 'baroque', active: true }, + { id: 'MariaCallas', tag: 'a', classe: 'baroque', active: false }, + { id: 'SteveJobbs', tag: 'a', classe: 'classical', active: false }, + { id: 'JoeLee', tag: 'span', classe: 'baroque', active: false }, + { id: 'AnthonyGrant', tag: 'span', classe: 'baroque', active: false }, + { id: 'ShakimaGreggs', tag: 'a', classe: 'modern', active: true }, + { id: 'RoyDeere', tag: 'span', classe: 'baroque', active: true }, + { id: 'BobTurner', tag: 'a', classe: 'classical', active: true }, + { id: 'AngeloCapri', tag: 'span', classe: 'modern', active: false }, + { id: 'SamMcDonald', tag: 'span', classe: 'baroque', active: true }, + { id: 'FannyLelouche', tag: 'span', classe: 'baroque', active: true }, + { id: 'ClarkLoister', tag: 'a', classe: 'classical', active: false }, + { id: 'FinanObrien', tag: 'span', classe: 'modern', active: false }, + { id: 'ClariceSterling', tag: 'a', classe: 'modern', active: true }, + { id: 'JayHernan', tag: 'span', classe: 'baroque', active: true }, + { id: 'HelenMirren', tag: 'a', classe: 'classical', active: false }, + { id: 'SarahForestier', tag: 'a', classe: 'modern', active: false }, + { id: 'JacquesChirac', tag: 'a', classe: 'classical', active: true }, + { id: 'MartinWealer', tag: 'a', classe: 'baroque', active: true }, + { id: 'JodieFoster', tag: 'span', classe: 'baroque', active: true }, + { id: 'JeanJacques', tag: 'span', classe: 'modern', active: false }, + { id: 'MollyHeart', tag: 'a', classe: 'baroque', active: false }, + { id: 'FabioSalso', tag: 'a', classe: 'classical', active: true }, + { id: 'CarlosSanchez', tag: 'span', classe: 'baroque', active: true }, + { id: 'RussellBell', tag: 'a', classe: 'classical', active: false }, + { id: 'JackDoe', tag: 'span', classe: 'baroque', active: true }, + { id: 'EricCarver', tag: 'a', classe: 'classical', active: false }, + { id: 'LouisDeschamps', tag: 'span', classe: 'baroque', active: true }, + { id: 'HoracioCane', tag: 'a', classe: 'baroque', active: true }, + { id: 'HenryBright', tag: 'a', classe: 'baroque', active: true }, +] diff --git a/subjects/get-them-all/index.html b/subjects/get-them-all/index.html index a1134f56..a62ce3fe 100644 --- a/subjects/get-them-all/index.html +++ b/subjects/get-them-all/index.html @@ -93,6 +93,7 @@ span {