diff --git a/test/acceptance/README.md b/test/acceptance/README.md new file mode 100644 index 000000000..9c37846dc --- /dev/null +++ b/test/acceptance/README.md @@ -0,0 +1,16 @@ +# Acceptance tests + +The idea of this tests is to automatically test the entire stack, including the library, the renderer and the integration with the backend. + +This is done through screenshot testing, comparing `test-cases` screenshots against reference images stored in the `references` folder. + +## Generating the references + + yarn test:acceptance:prepare + +## Running the tests + + yarn test:acceptance + + +This will generate a `_out.png` for every test case so you can visually compare the results if the test fails. diff --git a/test/acceptance/get-references.js b/test/acceptance/get-references.js index 691b60083..074a27e9f 100644 --- a/test/acceptance/get-references.js +++ b/test/acceptance/get-references.js @@ -24,7 +24,6 @@ function getReferences(folder) { const filepath = path.resolve(__dirname, `./test-cases/${folder}/${file}`); if (file.endsWith('.html') && !BLACKLIST_FILES.includes(file)) { console.log(`Taking reference from ${file}`); - console.log(`$(npm bin)/exquisite-sst ${HEADLESS_FLAG} --reference --url file://${filepath} --output ${OUTPUT_DIR}/${folder}/${file.replace('.html', '.png')} --delay ${DELAY}`) execSync(`$(npm bin)/exquisite-sst ${HEADLESS_FLAG} --reference --url file://${filepath} --output ${OUTPUT_DIR}/${folder}/${file.replace('.html', '.png')} --delay ${DELAY}`); } }); diff --git a/test/acceptance/index.test.js b/test/acceptance/index.test.js index 2ab60a03e..658871d70 100644 --- a/test/acceptance/index.test.js +++ b/test/acceptance/index.test.js @@ -6,7 +6,7 @@ chai.use(require('chai-as-promised')); const expect = chai.expect; const REFERENCES_FOLDER = 'references'; -const DELAY = 8000; +const DELAY = 3000; // Headless chrome with GPU only works with linux const HEADLESS = (process.platform === 'linux'); const references = _flatten(_getReferences(REFERENCES_FOLDER)); @@ -14,7 +14,7 @@ const references = _flatten(_getReferences(REFERENCES_FOLDER)); describe('Screenshot tests:', () => { references.forEach(test); - // test({ folder: 'styling', file: 'rampCategoryAuto' }); + // test({ folder: 'styling', file: 'rampCategoryAuto' }); // Running a single test }); // Wrapper to perform a single test. @@ -25,7 +25,7 @@ function test({ folder, file }) { const output = path.resolve(__dirname, `./${REFERENCES_FOLDER}/${folder}/${file}_out.png`); const filepath = path.resolve(__dirname, `./test-cases/${folder}/${file}.html`); const URL = `file://${filepath}`; - return expect(exquisite.test({ input, output, url: URL, delay: DELAY, threshold: 0.5, headless: HEADLESS })).to.eventually.be.true; + return expect(exquisite.test({ input, output, url: URL, delay: DELAY, threshold: 0.1, headless: HEADLESS })).to.eventually.be.true; }); } diff --git a/test/acceptance/references/basic/lines.png b/test/acceptance/references/basic/lines.png new file mode 100644 index 000000000..33a6b626c Binary files /dev/null and b/test/acceptance/references/basic/lines.png differ diff --git a/test/acceptance/references/basic/polygons.png b/test/acceptance/references/basic/polygons.png new file mode 100644 index 000000000..39f033f08 Binary files /dev/null and b/test/acceptance/references/basic/polygons.png differ diff --git a/test/acceptance/test-cases/basic/lines.html b/test/acceptance/test-cases/basic/lines.html new file mode 100644 index 000000000..c9cfa3473 --- /dev/null +++ b/test/acceptance/test-cases/basic/lines.html @@ -0,0 +1,51 @@ + + + + + + + + + + + + + + + + +
+ + + + diff --git a/test/acceptance/test-cases/basic/polygons.html b/test/acceptance/test-cases/basic/polygons.html new file mode 100644 index 000000000..74a0b6480 --- /dev/null +++ b/test/acceptance/test-cases/basic/polygons.html @@ -0,0 +1,51 @@ + + + + + + + + + + + + + + + + +
+ + + +