mirrors/OverlayScrollbars
2
0
Fork 0
mirror of https://github.com/tenrok/OverlayScrollbars.git synced 2026-05-18 21:09:41 +03:00
Code Issues Packages Projects Releases Wiki Activity

refine browser testing

Browse Source
This commit is contained in:
Rene
2020-10-31 16:19:12 +01:00
parent 4d8d76c5fc
commit 7df21970e6
10 changed files with 61 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files
config/jest-puppeteer.env.js
+4 -4
View File
@@ -1,5 +1,5 @@
const PuppeteerEnvironment = require('jest-environment-puppeteer');
const pti = require('puppeteer-to-istanbul');
// const pti = require('puppeteer-to-istanbul');
const { setupRollupTest, cleanupRollupTest } = require('./jest-puppeteer.rollup.js');
class PuppeteerRollupEnvironment extends PuppeteerEnvironment {
@@ -22,9 +22,9 @@ class PuppeteerRollupEnvironment extends PuppeteerEnvironment {
async teardown() {
// coverage
const { page } = this.global;
const [jsCoverage, cssCoverage] = await Promise.all([page.coverage.stopJSCoverage(), page.coverage.stopCSSCoverage()]);
pti.write([...jsCoverage, ...cssCoverage], { includeHostname: true, storagePath: './.pptr' });
// const { page } = this.global;
// const [jsCoverage, cssCoverage] = await Promise.all([page.coverage.stopJSCoverage(), page.coverage.stopCSSCoverage()]);
// pti.write([...jsCoverage, ...cssCoverage], { includeHostname: true, storagePath: './.pptr' });
// cleanup
cleanupRollupTest(this.ctx.testPath, this.cfg.cache);
config/jest-puppeteer.rollup.js
-14
View File
@@ -87,20 +87,6 @@ const genHtmlTemplateFunc = (content) => ({ attributes, files, meta, publicPath,
${content || ''}
${scripts}
<div id="testResult"></div>
<script>
var testResultElm = document.getElementById('testResult');
window.setTestResult = function(result) {
if (typeof result === 'boolean') {
testResultElm.setAttribute('class', result ? 'passed' : 'failed');
}
else {
testResultElm.removeAttribute('class');
}
};
window.testPassed = function() {
return testResultElm.getAttribute('class') === 'passed';
}
</script>
</body>
</html>`;
};
jest-puppeteer.config.base.js
+1 -1
View File
@@ -15,6 +15,6 @@ module.exports = {
server: {
command: `cross-env TEST_SERVER_PORT=${port} node ${testServerPath}`,
port,
launchTimeout: 4000,
launchTimeout: 10000,
},
};
packages/overlayscrollbars/tests/puppeteer/Environment/index.browser.ts
+3 -3
View File
@@ -1,7 +1,7 @@
import 'overlayscrollbars.scss';
import { Environment } from 'environment';
window.envInstance = new Environment();
document.body.textContent = JSON.stringify(window.envInstance);
const envInstance = new Environment();
document.body.textContent = JSON.stringify(envInstance);
export { Environment };
export { envInstance };
packages/overlayscrollbars/tests/puppeteer/Environment/index.test.ts
+2 -1
View File
@@ -7,7 +7,8 @@ describe('Environment', () => {
});
it('should be titled "Environment"', async () => {
const a: Environment = await page.evaluate(() => window.envInstance);
// @ts-ignore
const a: Environment = await page.evaluate(() => window.Environment.envInstance);
console.log(a);
await expect(page.title()).resolves.toMatch('Environment');
});
packages/overlayscrollbars/tests/puppeteer/SizeObserver/index.browser.ts
+12 -21
View File
@@ -3,6 +3,7 @@ import './index.scss';
import should from 'should';
import { waitFor } from '@testing-library/dom';
import { generateSelectCallback, iterateSelect } from '@/testing-browser/Select';
import { setTestResult } from '@/testing-browser/TestResult';
import { hasDimensions, offsetSize, WH } from 'support';
import { createSizeObserver } from 'overlayscrollbars/observers/createSizeObserver';
@@ -48,7 +49,7 @@ const iterate = async (select: HTMLSelectElement | null, afterEach?: () => any)
// eslint-disable-next-line
await waitFor(() => should.equal(iterations, currIterations + 1), {
onTimeout(error): Error {
window.setTestResult(false);
setTestResult(false);
return error;
},
});
@@ -65,24 +66,12 @@ borderSelect?.addEventListener('change', selectCallback);
boxSizingSelect?.addEventListener('change', selectCallback);
displaySelect?.addEventListener('change', selectCallback);
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
selectCallback({ target: heightSelect });
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
selectCallback({ target: widthSelect });
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
selectCallback({ target: paddingSelect });
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
selectCallback({ target: borderSelect });
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
selectCallback({ target: boxSizingSelect });
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
selectCallback({ target: displaySelect });
selectCallback(heightSelect);
selectCallback(widthSelect);
selectCallback(paddingSelect);
selectCallback(borderSelect);
selectCallback(boxSizingSelect);
selectCallback(displaySelect);
const iteratePadding = async (afterEach?: () => any) => {
await iterate(paddingSelect, afterEach);
@@ -104,7 +93,8 @@ const iterateDisplay = async (afterEach?: () => any) => {
};
const start = async () => {
window.setTestResult(null);
setTestResult(null);
targetElm?.removeAttribute('style');
await iterateDisplay();
await iterateBoxSizing(async () => {
@@ -116,7 +106,8 @@ const start = async () => {
});
});
});
window.setTestResult(true);
setTestResult(true);
};
startBtn?.addEventListener('click', start);
packages/overlayscrollbars/tsconfig.json
+1 -1
View File
@@ -3,7 +3,7 @@
"compilerOptions": {
"baseUrl": "./src/",
"paths": {
"@/testing-browser/*": ["../../testing-browser/src/*"]
"@/testing-browser*": ["../../testing-browser/src/*"]
}
}
}
packages/testing-browser/src/Select.ts
+14 -7
View File
@@ -1,17 +1,24 @@
function isEvent(obj: any): obj is Event {
return obj instanceof Event || !!obj.target;
}
// eslint-disable-next-line
const noop = <T>(): T => {
return {} as T;
};
const getSelectOptions = (selectElement: HTMLSelectElement) => Array.from(selectElement.options).map((option) => option.value);
export const generateSelectCallback = (targetElm: HTMLElement | null) => (event: Event) => {
const target = event.target as HTMLSelectElement;
const selectedOption = target.value;
const selectOptions = getSelectOptions(target);
export const generateSelectCallback = (targetElm: HTMLElement | null) => (event: Event | HTMLSelectElement | null) => {
const target: HTMLSelectElement | null = isEvent(event) ? (event.target as HTMLSelectElement) : event;
if (target) {
const selectedOption = target.value;
const selectOptions = getSelectOptions(target);
if (targetElm) {
targetElm.classList.remove(...selectOptions);
targetElm.classList.add(selectedOption);
if (targetElm) {
targetElm.classList.remove(...selectOptions);
targetElm.classList.add(selectedOption);
}
}
};
packages/testing-browser/src/TestResult.ts
+17
View File
@@ -0,0 +1,17 @@
const getTestResultElm = () => document.getElementById('testResult');
export const setTestResult = (result: boolean | null) => {
const elm = getTestResultElm();
if (elm) {
if (typeof result === 'boolean') {
elm.setAttribute('class', result ? 'passed' : 'failed');
} else {
elm.removeAttribute('class');
}
}
};
export const testPassed = (): boolean => {
const elm = getTestResultElm();
return elm ? elm.getAttribute('class') === 'passed' : false;
};
rollup.config.base.js
+7 -1
View File
@@ -254,8 +254,14 @@ const rollupConfig = (config = {}, { project = process.cwd(), overwrite = {}, si
});
}
if (isLast) {
build.plugins.unshift({
build.plugins.push({
name: 'deleteCacheDirs',
moduleParsed(moduleInfo) {
//if (filename.includes('index.browser')) {
console.log('moduleInfo', moduleInfo);
//console.log('importer', filename);
//}
},
writeBundle() {
const cacheDirs = cache.map((dir) => path.resolve(projectPath, dir));
const deletedDirs = del.sync(cacheDirs);