mirrors/OverlayScrollbars
2
0
Fork 0
mirror of https://github.com/tenrok/OverlayScrollbars.git synced 2026-06-12 11:32:28 +03:00
Code Issues Packages Projects Releases Wiki Activity

add path aliases

Browse Source
This commit is contained in:
Rene
2020-10-27 22:25:58 +01:00
parent 3cd6c2b85d
commit 46b1a58cfc
14 changed files with 230 additions and 147 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/Select.ts
+73
View File
@@ -0,0 +1,73 @@
// 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);
if (targetElm) {
targetElm.classList.remove(...selectOptions);
targetElm.classList.add(selectedOption);
}
};
export const selectOption = (select: HTMLSelectElement | null, selectedOption: string | number): boolean => {
if (!select) {
return false;
}
const options = getSelectOptions(select);
const currValue = select.value;
if (selectedOption === currValue) {
return false;
}
if (typeof selectedOption === 'string' && options.includes(selectedOption)) {
select.value = selectedOption;
} else if (typeof selectedOption === 'number' && options.length < selectedOption && selectedOption > -1) {
select.selectedIndex = selectedOption;
}
let event;
if (typeof Event === 'function') {
event = new Event('change');
} else {
event = document.createEvent('Event');
event.initEvent('change', true, true);
}
select.dispatchEvent(event);
return true;
};
export const iterateSelect = async <T>(
select: HTMLSelectElement | null,
options?: {
beforeEach?: () => T | Promise<T>;
check?: (input: T) => void | Promise<void>;
afterEach?: () => void | Promise<void>;
}
) => {
if (select) {
const { beforeEach = noop, check = noop, afterEach = noop } = options || {};
const selectOptions = getSelectOptions(select);
const selectOptionsReversed = getSelectOptions(select).reverse();
const iterateOptions = [...selectOptions, ...selectOptionsReversed];
for (let i = 0; i < iterateOptions.length; i++) {
const option = iterateOptions[i];
// eslint-disable-next-line
const beforeEachObj: T = await beforeEach();
if (selectOption(select, option)) {
// eslint-disable-next-line
await check(beforeEachObj);
// eslint-disable-next-line
await afterEach();
}
}
}
};
packages/overlayscrollbars/package-lock.json
Generated
-22
View File
@@ -1,22 +0,0 @@
{
"version": "0.0.1",
"lockfileVersion": 1,
"requires": true,
"dependencies": {
"@types/jquery": {
"version": "3.5.0",
"resolved": "https://registry.npmjs.org/@types/jquery/-/jquery-3.5.0.tgz",
"integrity": "sha512-C7qQUjpMWDUNYQRTXsP5nbYYwCwwgy84yPgoTT7fPN69NH92wLeCtFaMsWeolJD1AF/6uQw3pYt62rzv83sMmw==",
"dev": true,
"requires": {
"@types/sizzle": "*"
}
},
"@types/sizzle": {
"version": "2.3.2",
"resolved": "https://registry.npmjs.org/@types/sizzle/-/sizzle-2.3.2.tgz",
"integrity": "sha512-7EJYyKTL7tFR8+gDbB6Wwz/arpGa0Mywk1TJbNzKzHtzbwVmY4HR9WqS5VV7dsBUKQmPNr192jHr/VpBluj/hg==",
"dev": true
}
}
}
packages/overlayscrollbars/tests/puppeteer/Environment/index.ts → packages/overlayscrollbars/tests/puppeteer/Environment/index.browser.ts
View File
packages/overlayscrollbars/tests/puppeteer/Environment/index.test.ts
-5
View File
@@ -7,11 +7,6 @@ describe('Environment', () => {
});
it('should be titled "Environment"', async () => {
//await expect(page).toMatchElement('#a');
//await expect(page).toMatchElement('#b');
//await expect(page).toMatchElement('#c');
//await expect(page).toMatchElement('#d');
const a: Environment = await page.evaluate(() => window.envInstance);
console.log(a);
await expect(page.title()).resolves.toMatch('Environment');
packages/overlayscrollbars/tests/puppeteer/SizeObserver/index.ts → packages/overlayscrollbars/tests/puppeteer/SizeObserver/index.browser.ts
+31 -75
View File
@@ -1,9 +1,10 @@
import 'overlayscrollbars.scss';
import './index.scss';
import { createSizeObserver } from 'overlayscrollbars/observers/createSizeObserver';
import { from, removeClass, addClass, hasDimensions, isString, isNumber, offsetSize } from 'support';
import { hasDimensions, offsetSize, WH } from 'support';
import { waitFor } from '@testing-library/dom';
import should from 'should';
import { generateSelectCallback, iterateSelect } from '@/testing-browser/Select';
const targetElm = document.querySelector('#target');
const heightSelect: HTMLSelectElement | null = document.querySelector('#height');
@@ -25,80 +26,35 @@ const observerElm = createSizeObserver(() => {
});
});
const getSelectOptions = (selectElement: HTMLSelectElement) => {
const arr = from(selectElement.options).map((option) => option.value);
return arr;
};
const selectCallback = generateSelectCallback(targetElm as HTMLElement);
const selectCallback = (event: Event) => {
const target = event.target as HTMLSelectElement;
const selectedOption = target.value;
const selectOptions = getSelectOptions(target);
removeClass(targetElm, selectOptions.join(' '));
addClass(targetElm, selectedOption);
};
const selectOption = (select: HTMLSelectElement | null, selectedOption: string | number): boolean => {
if (!select) {
return false;
}
const options = getSelectOptions(select);
const currValue = select.value;
if (selectedOption === currValue) {
return false;
}
if (isString(selectedOption) && options.includes(selectedOption)) {
select.value = selectedOption;
} else if (isNumber(selectedOption) && options.length < selectedOption && selectedOption > -1) {
select.selectedIndex = selectedOption;
}
let event;
if (typeof Event === 'function') {
event = new Event('change');
} else {
event = document.createEvent('Event');
event.initEvent('change', true, true);
}
select.dispatchEvent(event);
return true;
};
const iterateSelect = async (select: HTMLSelectElement | null, afterEach?: () => any) => {
if (select) {
const selectOptions = getSelectOptions(select);
const selectOptionsReversed = getSelectOptions(select).reverse();
const iterateOptions = [...selectOptions, ...selectOptionsReversed];
for (let i = 0; i < iterateOptions.length; i++) {
const option = iterateOptions[i];
const iterate = async (select: HTMLSelectElement | null, afterEach?: () => any) => {
await iterateSelect<{ currIterations: number; currOffsetSize: WH<number> }>(select, {
beforeEach() {
const currIterations = iterations;
const currOffsetSize = offsetSize(targetElm as HTMLElement);
if (selectOption(select, option)) {
const newOffsetSize = offsetSize(targetElm as HTMLElement);
const offsetSizeChanged = currOffsetSize.w !== newOffsetSize.w || currOffsetSize.h !== newOffsetSize.h;
if (hasDimensions(targetElm as HTMLElement) && offsetSizeChanged) {
// eslint-disable-next-line
await waitFor(() => should.equal(iterations, currIterations + 1), {
onTimeout(error): Error {
window.setTestResult(false);
return error;
},
});
}
return {
currIterations,
currOffsetSize,
};
},
async check({ currIterations, currOffsetSize }) {
const newOffsetSize = offsetSize(targetElm as HTMLElement);
const offsetSizeChanged = currOffsetSize.w !== newOffsetSize.w || currOffsetSize.h !== newOffsetSize.h;
if (typeof afterEach === 'function') {
// eslint-disable-next-line
await afterEach();
}
if (hasDimensions(targetElm as HTMLElement) && offsetSizeChanged) {
// eslint-disable-next-line
await waitFor(() => should.equal(iterations, currIterations + 1), {
onTimeout(error): Error {
window.setTestResult(false);
return error;
},
});
}
}
}
},
afterEach,
});
};
heightSelect?.addEventListener('change', selectCallback);
@@ -128,22 +84,22 @@ selectCallback({ target: boxSizingSelect });
selectCallback({ target: displaySelect });
const iteratePadding = async (afterEach?: () => any) => {
await iterateSelect(paddingSelect, afterEach);
await iterate(paddingSelect, afterEach);
};
const iterateBorder = async (afterEach?: () => any) => {
await iterateSelect(borderSelect, afterEach);
await iterate(borderSelect, afterEach);
};
const iterateHeight = async (afterEach?: () => any) => {
await iterateSelect(heightSelect, afterEach);
await iterate(heightSelect, afterEach);
};
const iterateWidth = async (afterEach?: () => any) => {
await iterateSelect(widthSelect, afterEach);
await iterate(widthSelect, afterEach);
};
const iterateBoxSizing = async (afterEach?: () => any) => {
await iterateSelect(boxSizingSelect, afterEach);
await iterate(boxSizingSelect, afterEach);
};
const iterateDisplay = async (afterEach?: () => any) => {
await iterateSelect(displaySelect, afterEach);
await iterate(displaySelect, afterEach);
};
const start = async () => {
packages/overlayscrollbars/tsconfig.json
+4 -1
View File
@@ -1,6 +1,9 @@
{
"extends": "../../tsconfig.base.json",
"compilerOptions": {
"baseUrl": "./src/"
"baseUrl": "./src/",
"paths": {
"@/testing-browser/*": ["../../testing-browser/src/*"]
}
}
}
packages/testing-browser/package.json
+5
View File
@@ -0,0 +1,5 @@
{
"private": true,
"name": "testing",
"version": "0.0.0"
}
packages/testing-browser/src/Select.ts
+73
View File
@@ -0,0 +1,73 @@
// 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);
if (targetElm) {
targetElm.classList.remove(...selectOptions);
targetElm.classList.add(selectedOption);
}
};
export const selectOption = (select: HTMLSelectElement | null, selectedOption: string | number): boolean => {
if (!select) {
return false;
}
const options = getSelectOptions(select);
const currValue = select.value;
if (selectedOption === currValue) {
return false;
}
if (typeof selectedOption === 'string' && options.includes(selectedOption)) {
select.value = selectedOption;
} else if (typeof selectedOption === 'number' && options.length < selectedOption && selectedOption > -1) {
select.selectedIndex = selectedOption;
}
let event;
if (typeof Event === 'function') {
event = new Event('change');
} else {
event = document.createEvent('Event');
event.initEvent('change', true, true);
}
select.dispatchEvent(event);
return true;
};
export const iterateSelect = async <T>(
select: HTMLSelectElement | null,
options?: {
beforeEach?: () => T | Promise<T>;
check?: (input: T) => void | Promise<void>;
afterEach?: () => void | Promise<void>;
}
) => {
if (select) {
const { beforeEach = noop, check = noop, afterEach = noop } = options || {};
const selectOptions = getSelectOptions(select);
const selectOptionsReversed = getSelectOptions(select).reverse();
const iterateOptions = [...selectOptions, ...selectOptionsReversed];
for (let i = 0; i < iterateOptions.length; i++) {
const option = iterateOptions[i];
// eslint-disable-next-line
const beforeEachObj: T = await beforeEach();
if (selectOption(select, option)) {
// eslint-disable-next-line
await check(beforeEachObj);
// eslint-disable-next-line
await afterEach();
}
}
}
};
packages/testing-browser/tsconfig.json
+6
View File
@@ -0,0 +1,6 @@
{
"extends": "../../tsconfig.base.json",
"compilerOptions": {
"baseUrl": "./src/"
}
}