diff --git a/config/jest-puppeteer.env.js b/config/jest-puppeteer.env.js index fb8fdf5..ad89637 100644 --- a/config/jest-puppeteer.env.js +++ b/config/jest-puppeteer.env.js @@ -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); diff --git a/config/jest-puppeteer.rollup.js b/config/jest-puppeteer.rollup.js index 73cbf83..cb6d08f 100644 --- a/config/jest-puppeteer.rollup.js +++ b/config/jest-puppeteer.rollup.js @@ -87,20 +87,6 @@ const genHtmlTemplateFunc = (content) => ({ attributes, files, meta, publicPath, ${content || ''} ${scripts}
- `; }; diff --git a/jest-puppeteer.config.base.js b/jest-puppeteer.config.base.js index 84e826b..25cad94 100644 --- a/jest-puppeteer.config.base.js +++ b/jest-puppeteer.config.base.js @@ -15,6 +15,6 @@ module.exports = { server: { command: `cross-env TEST_SERVER_PORT=${port} node ${testServerPath}`, port, - launchTimeout: 4000, + launchTimeout: 10000, }, }; diff --git a/packages/overlayscrollbars/tests/puppeteer/Environment/index.browser.ts b/packages/overlayscrollbars/tests/puppeteer/Environment/index.browser.ts index 8eb6e85..ce2b25c 100644 --- a/packages/overlayscrollbars/tests/puppeteer/Environment/index.browser.ts +++ b/packages/overlayscrollbars/tests/puppeteer/Environment/index.browser.ts @@ -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 }; diff --git a/packages/overlayscrollbars/tests/puppeteer/Environment/index.test.ts b/packages/overlayscrollbars/tests/puppeteer/Environment/index.test.ts index e17754d..aefbea9 100644 --- a/packages/overlayscrollbars/tests/puppeteer/Environment/index.test.ts +++ b/packages/overlayscrollbars/tests/puppeteer/Environment/index.test.ts @@ -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'); }); diff --git a/packages/overlayscrollbars/tests/puppeteer/SizeObserver/index.browser.ts b/packages/overlayscrollbars/tests/puppeteer/SizeObserver/index.browser.ts index 5a94a5d..07f4126 100644 --- a/packages/overlayscrollbars/tests/puppeteer/SizeObserver/index.browser.ts +++ b/packages/overlayscrollbars/tests/puppeteer/SizeObserver/index.browser.ts @@ -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); diff --git a/packages/overlayscrollbars/tsconfig.json b/packages/overlayscrollbars/tsconfig.json index f3a0465..9c95ff8 100644 --- a/packages/overlayscrollbars/tsconfig.json +++ b/packages/overlayscrollbars/tsconfig.json @@ -3,7 +3,7 @@ "compilerOptions": { "baseUrl": "./src/", "paths": { - "@/testing-browser/*": ["../../testing-browser/src/*"] + "@/testing-browser*": ["../../testing-browser/src/*"] } } } diff --git a/packages/testing-browser/src/Select.ts b/packages/testing-browser/src/Select.ts index a913b1b..154b93c 100644 --- a/packages/testing-browser/src/Select.ts +++ b/packages/testing-browser/src/Select.ts @@ -1,17 +1,24 @@ +function isEvent(obj: any): obj is Event { + return obj instanceof Event || !!obj.target; +} + // eslint-disable-next-line const noop = (): 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); + } } }; diff --git a/packages/testing-browser/src/TestResult.ts b/packages/testing-browser/src/TestResult.ts new file mode 100644 index 0000000..df0a772 --- /dev/null +++ b/packages/testing-browser/src/TestResult.ts @@ -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; +}; diff --git a/rollup.config.base.js b/rollup.config.base.js index 0ad196b..7f03a2e 100644 --- a/rollup.config.base.js +++ b/rollup.config.base.js @@ -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);