@thednp/shorty 2.0.3 → 2.0.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (61) hide show
  1. package/README.md +7 -5
  2. package/dist/shorty.cjs +17 -1
  3. package/dist/shorty.cjs.map +1 -1
  4. package/dist/shorty.d.ts +20 -8
  5. package/dist/shorty.js +17 -1
  6. package/dist/shorty.js.map +1 -1
  7. package/dist/shorty.mjs +423 -379
  8. package/dist/shorty.mjs.map +1 -1
  9. package/dts.config.ts +1 -7
  10. package/package.json +16 -16
  11. package/src/boolean/isApple.ts +1 -1
  12. package/src/boolean/isFirefox.ts +3 -1
  13. package/src/boolean/isMobile.ts +1 -1
  14. package/src/boolean/supportPassive.ts +1 -1
  15. package/src/event/one.ts +1 -1
  16. package/src/get/getRectRelativeToOffsetParent.ts +1 -1
  17. package/src/index.ts +6 -0
  18. package/src/misc/createCustomEvent.ts +5 -5
  19. package/src/misc/createElementNS.ts +1 -1
  20. package/src/misc/data.ts +2 -5
  21. package/src/misc/emulateAnimationEnd.ts +4 -3
  22. package/src/misc/emulateTransitionEnd.ts +3 -3
  23. package/src/misc/focusTrap.ts +64 -0
  24. package/src/misc/normalizeOptions.ts +2 -2
  25. package/src/misc/timer.ts +3 -3
  26. package/src/selectors/closest.ts +5 -2
  27. package/src/selectors/getCustomElements.ts +1 -2
  28. package/src/selectors/getElementById.ts +2 -2
  29. package/src/selectors/getElementsByClassName.ts +2 -7
  30. package/src/selectors/getElementsByTagName.ts +2 -5
  31. package/src/selectors/querySelector.ts +6 -3
  32. package/src/selectors/querySelectorAll.ts +4 -1
  33. package/src/strings/focusableSelector.ts +4 -0
  34. package/test/att.test.ts +43 -0
  35. package/test/boolean.test.ts +30 -0
  36. package/test/class.test.ts +26 -0
  37. package/test/event.test.ts +39 -0
  38. package/{cypress/test.html → test/fixtures/getExampleDom.ts} +21 -32
  39. package/test/fixtures/style.css +18 -0
  40. package/test/get.test.ts +150 -0
  41. package/{cypress/e2e/is.cy.ts → test/is.test.ts} +77 -70
  42. package/test/misc.test.ts +400 -0
  43. package/test/selectors.test.ts +90 -0
  44. package/tsconfig.json +6 -1
  45. package/{vite.config.ts → vite.config.mts} +3 -8
  46. package/vitest.config-ui.mts +21 -0
  47. package/vitest.config.mts +20 -0
  48. package/cypress/e2e/att.cy.ts +0 -46
  49. package/cypress/e2e/boolean.cy.ts +0 -44
  50. package/cypress/e2e/class.cy.ts +0 -28
  51. package/cypress/e2e/event.cy.ts +0 -51
  52. package/cypress/e2e/get.cy.ts +0 -168
  53. package/cypress/e2e/misc.cy.ts +0 -354
  54. package/cypress/e2e/selectors.cy.ts +0 -85
  55. package/cypress/plugins/esbuild-istanbul.ts +0 -50
  56. package/cypress/plugins/tsCompile.ts +0 -34
  57. package/cypress/support/commands.ts +0 -37
  58. package/cypress/support/e2e.ts +0 -21
  59. package/cypress/support/index.js +0 -22
  60. package/cypress.config.ts +0 -30
  61. /package/{cypress → test}/fixtures/custom-elem.js +0 -0
@@ -0,0 +1,400 @@
1
+ import { expect, it, describe, vi, afterEach } from 'vitest';
2
+ import { getExampleDOM } from './fixtures/getExampleDom';
3
+ import * as SHORTY from '../src/index';
4
+ import "./fixtures/style.css";
5
+
6
+ describe('Shorty Library Tests - MISC', () => {
7
+ const wrapper = document.createElement('div');
8
+ document.body.append(wrapper);
9
+
10
+ afterEach(async () => {
11
+ wrapper.innerHTML = '';
12
+ });
13
+
14
+ it('Test misc folder - emulateTransitionEnd - no transition', async () => {
15
+ vi.useFakeTimers();
16
+ const container = getExampleDOM();
17
+ wrapper.append(container);
18
+ await vi.waitFor(() => container.querySelector('.alert'), 200);
19
+
20
+ const {
21
+ dispatchEvent,
22
+ emulateTransitionEnd,
23
+ createCustomEvent,
24
+ reflow,
25
+ querySelector,
26
+ setElementStyle,
27
+ getElementStyle,
28
+ removeClass,
29
+ addClass,
30
+ one,
31
+ } = SHORTY;
32
+
33
+ const el = querySelector('.alert', container) as HTMLElement;
34
+ const btn = querySelector('.btn-close', el) as HTMLButtonElement;
35
+ const alertHideEvent = createCustomEvent('hide-alert',);
36
+
37
+ setElementStyle(el, {
38
+ transition: 'none',
39
+ transitionProperty: 'none',
40
+ transitionDuration: '0s',
41
+ 'transition-delay': '0s',
42
+ '--transition-prop': 'none',
43
+ });
44
+
45
+ expect(getElementStyle(el, 'transitionProperty')).to.equal('none');
46
+ expect(getElementStyle(el, 'transition-duration')).to.equal('0s');
47
+ expect(getElementStyle(el, 'transitionDelay')).to.equal('0s');
48
+ expect(getElementStyle(el, '--transition-prop')).to.equal('none');
49
+
50
+ one(el, 'hide-alert', function hideHandler(e: typeof alertHideEvent) {
51
+ expect(e.target).to.equal(el);
52
+ expect(e.relatedTarget).to.equal(btn);
53
+ });
54
+
55
+ one(btn, 'click', function handleBtn(e) {
56
+ expect(e.target).to.equal(btn);
57
+ removeClass(el, 'show');
58
+ reflow(el);
59
+ alertHideEvent.relatedTarget = btn;
60
+ dispatchEvent(el, alertHideEvent);
61
+ emulateTransitionEnd(el, function () {
62
+ addClass(el, 'show');
63
+ vi.advanceTimersByTime(350);
64
+ });
65
+ });
66
+
67
+ btn.click();
68
+ });
69
+
70
+ it('Test misc folder - emulateTransitionEnd - default', async () => {
71
+ vi.useFakeTimers();
72
+ const container = getExampleDOM();
73
+ wrapper.append(container);
74
+ await vi.waitFor(() => container.querySelector('.alert'), 200);
75
+
76
+ const {
77
+ dispatchEvent,
78
+ emulateTransitionEnd,
79
+ createCustomEvent,
80
+ reflow,
81
+ querySelector,
82
+ removeClass,
83
+ addClass,
84
+ one,
85
+ focus,
86
+ } = SHORTY;
87
+
88
+ const el = querySelector('.alert', container) as HTMLElement;
89
+ const btn = querySelector('.btn-close', el) as HTMLButtonElement;
90
+ const alertHideEvent = createCustomEvent('hide-alert', { relatedTarget: null });
91
+
92
+ one(el, 'hide-alert', function hideHandler(e: typeof alertHideEvent) {
93
+ expect(e.target).to.equal(el);
94
+ expect(e.relatedTarget).to.equal(btn);
95
+ });
96
+
97
+ one(btn, 'click', function handleBtn(e) {
98
+ expect(e.target).to.equal(btn);
99
+ removeClass(el, 'show');
100
+ reflow(el);
101
+ alertHideEvent.relatedTarget = btn;
102
+ dispatchEvent(el, alertHideEvent);
103
+ emulateTransitionEnd(el, function () {
104
+ addClass(el, 'show');
105
+ focus(btn, { preventScroll: false });
106
+ console.log('transitionend triggered');
107
+ vi.advanceTimersByTime(350);
108
+ });
109
+ });
110
+
111
+ btn.click();
112
+ });
113
+
114
+ it("Can use focus trap", async () => {
115
+ const container = getExampleDOM();
116
+ const { focus, toggleFocusTrap, focusableSelector } = SHORTY;
117
+ wrapper.append(container);
118
+ await vi.waitFor(() => container.querySelector('.alert'), 200);
119
+ const element = container.querySelector<HTMLElement>('.alert')!;
120
+ const firstFocusable = element.querySelector<SHORTY.FocusableElement>(focusableSelector)!;
121
+ const table = container.querySelector<HTMLElement>('table')!;
122
+ const doc = element.ownerDocument!;
123
+
124
+ focus(firstFocusable);
125
+ toggleFocusTrap(element);
126
+ element.dispatchEvent(new KeyboardEvent('keydown', { bubbles: true, code: 'Tab', key: 'Tab', shiftKey: true }));
127
+ element.dispatchEvent(new KeyboardEvent('keydown', { bubbles: true, code: 'Tab', key: 'Tab', shiftKey: true }));
128
+ element.dispatchEvent(new KeyboardEvent('keydown', { bubbles: true, code: 'Tab', key: 'Tab', shiftKey: true }));
129
+ element.dispatchEvent(new KeyboardEvent('keydown', { bubbles: true, code: 'Tab', key: 'Tab', shiftKey: true }));
130
+ element.dispatchEvent(new KeyboardEvent('keydown', { bubbles: true, code: 'Tab', key: 'Tab', shiftKey: true }));
131
+ element.dispatchEvent(new KeyboardEvent('keydown', { bubbles: true, code: 'Tab', key: 'Tab', }));
132
+ element.dispatchEvent(new KeyboardEvent('keydown', { bubbles: true, code: 'Tab', key: 'Tab', }));
133
+ element.dispatchEvent(new KeyboardEvent('keydown', { bubbles: true, code: 'Tab', key: 'Tab', }));
134
+ element.dispatchEvent(new KeyboardEvent('keydown', { bubbles: true, code: 'Tab', key: 'Tab', }));
135
+ element.dispatchEvent(new KeyboardEvent('keydown', { bubbles: true, code: 'Tab', key: 'Tab', }));
136
+
137
+ await vi.waitFor(() => {
138
+ expect(element).to.contain(doc.activeElement);
139
+ }, 50)
140
+ toggleFocusTrap(element);
141
+
142
+ toggleFocusTrap(table);
143
+ table.dispatchEvent(new KeyboardEvent('keydown', { bubbles: true, code: 'Tab', shiftKey: true }));
144
+ table.dispatchEvent(new KeyboardEvent('keydown', { bubbles: true, code: 'Tab' }));
145
+
146
+ await vi.waitFor(() => {
147
+ expect(element).to.contain(doc.activeElement);
148
+ }, 50)
149
+ toggleFocusTrap(table);
150
+ });
151
+
152
+ it('Test misc folder - emulateAnimationEnd - default', async () => {
153
+ vi.useFakeTimers();
154
+ const container = getExampleDOM();
155
+ wrapper.append(container);
156
+ const { emulateAnimationEnd, getElementStyle, querySelector, addClass } = SHORTY;
157
+ await vi.waitFor(() => container.querySelector('.alert'), 200);
158
+
159
+ const el = querySelector('.alert') as HTMLElement;
160
+
161
+ addClass(el, 'animate-test');
162
+ emulateAnimationEnd(el, () => {
163
+ console.log('animationend fired - default');
164
+ vi.advanceTimersByTime(350);
165
+ });
166
+ await vi.waitFor(() => {
167
+ expect(getElementStyle(el, 'animationName'), 'animationName').to.equal('animate-test');
168
+ expect(getElementStyle(el, 'animationDuration'), 'animationDuration').to.equal('0.3s');
169
+ expect(getElementStyle(el, 'animationDelay'), 'animationDelay').to.equal('0s');
170
+ }, 351)
171
+ });
172
+
173
+
174
+ it('Test misc folder - emulateAnimationEnd - no duration', async () => {
175
+ vi.useFakeTimers();
176
+ const container = getExampleDOM();
177
+ wrapper.append(container);
178
+ await vi.waitFor(() => container.querySelector('.alert'), 200);
179
+
180
+ const { emulateAnimationEnd, setElementStyle, getElementStyle, querySelector, addClass } =
181
+ SHORTY;
182
+
183
+ const el = querySelector('.alert', container)!;
184
+ // setElementStyle(el, { animationDuration: '0.1s' });
185
+ setElementStyle(el, { animationDuration: '0s' });
186
+
187
+ addClass(el, 'animate-test');
188
+
189
+ emulateAnimationEnd(el, () => {
190
+ console.log('animationend fired no duration');
191
+ vi.advanceTimersByTime(150);
192
+ });
193
+
194
+ await vi.waitFor(() => {
195
+ expect(getElementStyle(el, 'animationName'), 'animationName').to.equal('animate-test');
196
+ expect(getElementStyle(el, 'animationDuration'), 'animationDuration').to.equal('0s');
197
+ expect(getElementStyle(el, 'animationDelay'), 'animationDelay').to.equal('0s');
198
+ }, 50)
199
+
200
+ });
201
+
202
+ it('Test misc folder - everything else', async () => {
203
+ const container = getExampleDOM();
204
+ wrapper.append(container);
205
+ await vi.waitFor(() => container.querySelector('.alert'), 200);
206
+
207
+ const {
208
+ ArrayFrom,
209
+ Float32ArrayFrom,
210
+ Float64ArrayFrom,
211
+ distinct,
212
+ noop,
213
+ ObjectHasOwn,
214
+ ObjectEntries,
215
+ ObjectAssign,
216
+ ObjectKeys,
217
+ ObjectValues,
218
+ // ObjectDefineProperty,
219
+ ObjectFromEntries,
220
+ createElement,
221
+ createElementNS,
222
+ Data,
223
+ getInstance,
224
+ normalizeOptions,
225
+ Timer,
226
+ toLowerCase,
227
+ toUpperCase,
228
+ querySelector,
229
+ getElementsByClassName,
230
+ } = SHORTY;
231
+
232
+
233
+ const el = querySelector('.alert', container)!;
234
+ const table = querySelector('.table', container)!;
235
+
236
+ const defaults = { op1: true, op2: true, op3: 5, title: null };
237
+ const jsOps = { op1: false, op2: false, op3: 8, title: 'something' };
238
+ expect(ObjectHasOwn(jsOps, 'op3')).to.be.true;
239
+ expect(ObjectHasOwn(jsOps, 'momo')).to.be.false;
240
+ // @ts-expect-error
241
+ expect(ObjectHasOwn(null, 'momo')).to.be.false;
242
+ expect(normalizeOptions(el, defaults, {}, 'bs'), 'normalizeOptions(data)').to.deep.equal({
243
+ op1: false,
244
+ op2: true,
245
+ op3: 10,
246
+ title: null,
247
+ });
248
+ // @ts-expect-error
249
+ expect(normalizeOptions(el, defaults, jsOps, 'bs'), 'normalizeOptions(js)').to.deep.equal({
250
+ op1: false,
251
+ op2: false,
252
+ op3: 8,
253
+ title: 'something',
254
+ });
255
+ expect(noop()).to.be.undefined;
256
+
257
+ // @ts-expect-error
258
+ Timer.set('el', noop, 150);
259
+ Timer.set(el, () => console.log(el.tagName + ' has timer of 150'), 150, 'alert');
260
+ // @ts-expect-error
261
+ expect(Timer.get('el', 'alert')).to.be.null;
262
+ expect(Timer.get(el, 'alert')).to.not.be.undefined;
263
+ // @ts-expect-error
264
+ Timer.clear('el', 'alert');
265
+ Timer.clear(el, 'alert');
266
+ expect(Timer.get(el, 'alert')).to.be.null;
267
+
268
+ Timer.set(el, () => console.log(el.tagName + ' has timer of 250'), 250);
269
+ expect(Timer.get(el)).to.not.be.null;
270
+ Timer.clear(el);
271
+ expect(Timer.get(el)).to.be.null;
272
+
273
+ expect([0, 1, 1, 2, 3, 3].filter(distinct), 'filter(DISTINCT)').to.deep.equal([0, 1, 2, 3]);
274
+
275
+ expect(toLowerCase('textSample'), 'toLowerCase(string)').to.equal('textsample');
276
+ expect(toUpperCase('textSample'), 'toUpperCase(string)').to.equal('TEXTSAMPLE');
277
+
278
+ // expect(
279
+ // Object.defineProperty({ c: 3}, 'a', { value: {b: 1}, writable: true }),
280
+ // 'ObjectDefineProperty(object1, prop, value)',
281
+ // ).to.deep.equal({ c: 3, a: {b: 1} });
282
+ expect(
283
+ ObjectAssign({ c: 3 }, { a: 1, b: 2 }),
284
+ 'ObjectAssign(object1, object2)',
285
+ ).to.deep.equal({ a: 1, b: 2, c: 3 });
286
+ expect(ObjectEntries({ a: 1, b: 2 }), 'ObjectEntries(object)').to.deep.equal([
287
+ ['a', 1],
288
+ ['b', 2],
289
+ ]);
290
+ expect(ObjectKeys({ a: 1, b: 2 }), 'ObjectKeys(object)').to.deep.equal(['a', 'b']);
291
+ expect(ObjectValues({ a: 1, b: 2 }), 'ObjectValues(object)').to.deep.equal([1, 2]);
292
+
293
+ expect(Float32ArrayFrom([0, 1, 2, 3]), 'Float32ArrayFrom(array)').to.be.instanceOf(
294
+ Float32Array,
295
+ );
296
+ expect(Float64ArrayFrom([0, 1, 2, 3]), 'Float64ArrayFrom(array)').to.be.instanceOf(
297
+ Float64Array,
298
+ );
299
+ expect(Float64ArrayFrom([0, 1, 2, 3]).length, 'Float64ArrayFrom(array)').to.eq(4);
300
+
301
+ expect(
302
+ ArrayFrom(new Float32Array([0, 1, 2, 3])),
303
+ 'ArrayFrom(Float32Array)',
304
+ ).to.be.instanceOf(Array);
305
+ expect(ArrayFrom(new Float64Array([0, 1, 2, 3])), 'Array(Float64Array)').to.be.instanceOf(
306
+ Array,
307
+ );
308
+ expect(
309
+ ArrayFrom(getElementsByClassName('table', container)),
310
+ 'ArrayFrom(HTMLCollection)',
311
+ ).to.deep.equal([table]);
312
+
313
+ expect(createElement(), 'createElement()').to.be.undefined;
314
+ expect(createElement('input'), 'createElement(string)').to.be.instanceOf(HTMLInputElement);
315
+ const parag = createElement({
316
+ tagName: 'p',
317
+ className: 'lead',
318
+ innerText: 'This is a newly created paragraph.',
319
+ });
320
+ expect(parag).to.be.instanceOf(HTMLParagraphElement)
321
+ expect(parag?.className).to.contain('lead')
322
+ expect(parag?.innerHTML).to.contain('This is a newly created paragraph.');
323
+ expect(
324
+ createElement({
325
+ tagName: 'p',
326
+ textContent: 'This is a newly created paragraph.',
327
+ }),
328
+ 'createElement(object)',
329
+ ).to.be.instanceOf(HTMLParagraphElement)
330
+ // .and.contain('This is a newly created paragraph.');
331
+
332
+ expect(
333
+ createElement({
334
+ className: 'lead',
335
+ innerText: 'This is a newly created paragraph.',
336
+ }),
337
+ 'createElement(incompleteObject)',
338
+ ).to.be.undefined;
339
+
340
+ expect(createElementNS(''), 'createElementNS()').to.be.undefined;
341
+ expect(
342
+ createElementNS('http://www.w3.org/2000/svg', 'svg'),
343
+ 'createElementNS(ns, string)',
344
+ ).to.be.instanceOf(SVGElement);
345
+ expect(
346
+ createElementNS<HTMLButtonElement>('http://www.w3.org/1999/xhtml', {
347
+ tagName: 'button',
348
+ className: 'btn',
349
+ innerText: 'New Item',
350
+ textContent: 'New Item',
351
+ }),
352
+ 'createElementNS(ns, object)',
353
+ )
354
+ .to.be.instanceOf(HTMLButtonElement)
355
+ // .and.contain('btn')
356
+ // .and.contain('New Item');
357
+
358
+ expect(
359
+ createElementNS<SVGPathElement & { d: string }>('http://www.w3.org/2000/svg', {
360
+ tagName: 'path',
361
+ d: 'M98,158l157,156L411,158l27,27L255,368L71,185L98,158z',
362
+ }),
363
+ 'createElementNS(ns, object)',
364
+ ).to.be.instanceOf(SVGPathElement)
365
+ .and.have.property('d').equal('M98,158l157,156L411,158l27,27L255,368L71,185L98,158z');
366
+
367
+ expect(
368
+ createElementNS<SVGPathElement & { d: string }>('http://www.w3.org/2000/svg', {
369
+ tagName: '',
370
+ className: 'icon',
371
+ d: 'M98,158l157,156L411,158l27,27L255,368L71,185L98,158z',
372
+ }),
373
+ 'createElementNS(ns, incompleteObject)',
374
+ ).to.be.undefined;
375
+
376
+ // @ts-expect-error
377
+ Data.set(el);
378
+ // @ts-expect-error
379
+ expect(Data.get(el), 'not enough params - Data.get(node)').to.be.null;
380
+
381
+ // @ts-expect-error
382
+ Data.set('str', 'strKey', 'data');
383
+ // @ts-expect-error
384
+ expect(Data.get('str', 'strKey'), 'not HTMLElement - Data.get(string, string, string)').to
385
+ .be.null;
386
+
387
+ Data.set(el, 'Alert', { element: el });
388
+ expect(Data.get(el, 'Alert'), 'Data.get(node, key)').to.deep.equal({ element: el });
389
+ expect(getInstance(el, 'Alert'), 'getInstance(node, key)').to.deep.equal({ element: el });
390
+ expect(Data.getAllFor('Alert')?.size, 'Data.getAllFor(string).size').to.equal(1);
391
+
392
+ Data.remove(el, 'Alert');
393
+ expect(Data.get(el, 'Alert'), 'removed - Data.get(node, string)').to.be.null;
394
+ expect(getInstance(el, 'Alert'), 'removed - getInstance(node, string)').to.be.null;
395
+ expect(Data.getAllFor('Alert'), 'removed - Data.getAllFor(string)').to.be.null;
396
+ Data.remove(el, 'Alert');
397
+
398
+ expect(ObjectFromEntries([['a', 1], ['b', 2]])).to.deep.equal({ a: 1, b: 2 })
399
+ });
400
+ });
@@ -0,0 +1,90 @@
1
+ import { expect, it, describe, vi, afterEach } from 'vitest';
2
+ import { getExampleDOM } from './fixtures/getExampleDom';
3
+ import * as SHORTY from '../src/index';
4
+ import CustomElem from './fixtures/custom-elem';
5
+ import "./fixtures/style.css";
6
+
7
+ describe('Shorty Library Tests', () => {
8
+ const wrapper = document.createElement('div');
9
+ document.body.append(wrapper);
10
+ afterEach(async () => {
11
+ wrapper.innerHTML = '';
12
+ });
13
+
14
+ it('Test selectors folder', () => {
15
+ const container = getExampleDOM();
16
+ wrapper.append(container);
17
+
18
+ const {
19
+ closest,
20
+ getCustomElements,
21
+ getElementById,
22
+ getElementsByClassName,
23
+ getElementsByTagName,
24
+ matches,
25
+ querySelector,
26
+ querySelectorAll,
27
+ } = SHORTY;
28
+
29
+ const el = querySelector('.alert', container);
30
+ if (!el) return;
31
+ const win = window;
32
+
33
+ const CE = new CustomElem();
34
+ win.document.body.append(CE);
35
+
36
+ expect(querySelectorAll('div'), 'querySelectorAll(div)').to.have.length(3);
37
+ expect(querySelectorAll('div', win.document), 'querySelectorAll(div, parent)').to.have.length(3);
38
+
39
+ // @ts-expect-error
40
+ expect(querySelector(), 'querySelector()').to.be.null;
41
+ expect(querySelector(el), 'querySelector(node)').to.equal(el);
42
+ expect(querySelector('.alert'), 'querySelector(selector)').to.not.be.null;
43
+ expect(querySelector('.alert', win.document), 'querySelector(selector, parent)').to.eq(el);
44
+ // @ts-expect-error
45
+ expect(closest(), 'closest()').to.be.null;
46
+ // @ts-expect-error
47
+ expect(closest(el)).to.be.null;
48
+ expect(closest(el, 'wombat'), 'closest(el, invalidTagSelector)').to.be.null;
49
+ expect(closest(el, 'body'), 'closest(body)').to.eq(win.document.body);
50
+
51
+ expect(getCustomElements(), 'getCustomElements()').to.have.lengthOf(1);
52
+ expect(getCustomElements(win.document), 'getCustomElements(expected)').to.deep.equal([CE]);
53
+
54
+ // @ts-expect-error
55
+ expect(getElementById(), 'getElementById()').to.be.null;
56
+ expect(getElementById('alertDemo'), 'getElementById(id)').to.not.be.null;
57
+ expect(
58
+ getElementById('alertDemo', win.document),
59
+ 'getElementById(id, parent)',
60
+ ).to.be.instanceOf(win.HTMLDivElement);
61
+
62
+ // @ts-expect-error
63
+ expect(getElementsByClassName(), 'getElementsByClassName()').to.be.instanceOf(
64
+ HTMLCollection,
65
+ );
66
+ expect(
67
+ getElementsByClassName('alert'),
68
+ 'getElementsByClassName(selector)',
69
+ ).to.be.instanceOf(HTMLCollection);
70
+ expect(
71
+ getElementsByClassName('alert', win.document),
72
+ 'getElementsByClassName(selector, parent)',
73
+ ).to.be.instanceOf(win.HTMLCollection);
74
+
75
+ // @ts-expect-error
76
+ expect(getElementsByTagName(), 'getElementsByTagName()').to.be.instanceOf(HTMLCollection);
77
+ expect(getElementsByTagName('div'), 'getElementsByTagName(selector)').to.be.instanceOf(
78
+ HTMLCollection,
79
+ );
80
+ expect(
81
+ getElementsByTagName('div', win.document),
82
+ 'getElementsByTagName(selector, parent)',
83
+ ).to.be.instanceOf(win.HTMLCollection);
84
+
85
+ expect(
86
+ [...getElementsByClassName('alert', win.document)].filter(x => matches(x, 'div')),
87
+ 'matches(node, selector)',
88
+ ).to.deep.equal([el]);
89
+ });
90
+ });
package/tsconfig.json CHANGED
@@ -23,7 +23,12 @@
23
23
  "allowSyntheticDefaultImports": true,
24
24
  "noEmit": true,
25
25
  "checkJs": true,
26
- "skipLibCheck": true // allows dts-bundle-generator to import from package.json
26
+ "skipLibCheck": true, // allows dts-bundle-generator to import from package.json
27
+ "paths": {
28
+ "~/*": [
29
+ "./src/*"
30
+ ],
31
+ }
27
32
  },
28
33
  "include": ["src/*", "src/**/*"],
29
34
  "exclude": ["node_modules", "experiments", "coverage", "dist"],
@@ -1,17 +1,12 @@
1
1
  import { resolve } from 'path';
2
2
  import { defineConfig } from 'vite';
3
- import { name } from './package.json';
4
-
5
- const getPackageName = () => {
6
- return name.includes('@') ? name.split('/')[1] : name;
7
- };
8
3
 
9
4
  const NAME = 'SHORTY';
10
5
 
11
6
  const fileName = {
12
- es: `${getPackageName()}.mjs`,
13
- cjs: `${getPackageName()}.cjs`,
14
- iife: `${getPackageName()}.js`,
7
+ es: `shorty.mjs`,
8
+ cjs: `shorty.cjs`,
9
+ iife: `shorty.js`,
15
10
  };
16
11
 
17
12
  export default defineConfig({
@@ -0,0 +1,21 @@
1
+ import { defineConfig } from "vitest/config";
2
+
3
+ export default defineConfig({
4
+ test: {
5
+ css: true,
6
+ globals: true,
7
+ coverage: {
8
+ provider: "istanbul",
9
+ reporter: ["html", "text", "lcov"],
10
+ enabled: true,
11
+ include: ["src/**/*.{ts,tsx}"],
12
+ },
13
+ browser: {
14
+ // provider: 'webdriverio', // or 'preview'
15
+ enabled: true,
16
+ headless: false,
17
+ name: 'chrome', // browser name is required
18
+ // enableUI: true
19
+ },
20
+ },
21
+ });
@@ -0,0 +1,20 @@
1
+ import { defineConfig } from "vitest/config";
2
+
3
+ export default defineConfig({
4
+ test: {
5
+ css: true,
6
+ globals: true,
7
+ coverage: {
8
+ provider: "istanbul",
9
+ reporter: ["html", "text", "lcov"],
10
+ enabled: true,
11
+ include: ["src/**/*.{ts,tsx}"],
12
+ },
13
+ browser: {
14
+ provider: 'playwright', // or 'webdriverio'
15
+ enabled: true,
16
+ headless: true,
17
+ name: 'chromium', // browser name is required
18
+ },
19
+ },
20
+ });
@@ -1,46 +0,0 @@
1
- /// <reference types="cypress" />
2
- // @ts-nocheck
3
-
4
- // import SHORTY from '../../src/index';
5
- import * as SHORTY from '../../src/index';
6
-
7
- describe('Shorty Library Tests', () => {
8
- before(() => {
9
- cy.visit('cypress/test.html');
10
- });
11
-
12
- it('Test attr folder', () => {
13
- const {
14
- getAttribute,
15
- setAttribute,
16
- hasAttribute,
17
- removeAttribute,
18
- getAttributeNS,
19
- setAttributeNS,
20
- hasAttributeNS,
21
- removeAttributeNS,
22
- querySelector,
23
- } = SHORTY;
24
-
25
- cy
26
- .get('.alert')
27
- .should($element => {
28
- const el = $element[0];
29
- expect(getAttribute(el, 'class'), 'getAttribute').to.have.length.above(0);
30
- setAttribute(el, 'data-att', 'momo');
31
- expect(hasAttribute(el, 'data-att'), 'hasAttribute').to.be.true;
32
- removeAttribute(el, 'data-att');
33
- expect(hasAttribute(el, 'data-att'), 'hasAttribute').to.be.false;
34
- });
35
- cy.get('svg').should($svg => {
36
- console.log(querySelector('svg'));
37
- const svg = $svg[0] as HTMLElement;
38
- const ns = 'http://www.w3.org/2000/svg';
39
- expect(hasAttributeNS(ns, svg, 'transform'), 'hasAttributeNS').to.be.false;
40
- setAttributeNS(ns, svg, 'transform', 'scale(0.99)');
41
- expect(getAttributeNS(ns, svg, 'transform'), 'getAttributeNS').to.eq('scale(0.99)');
42
- removeAttributeNS(ns, svg, 'transform');
43
- expect(getAttributeNS(ns, svg, 'transform'), 'getAttributeNS').to.be.null;
44
- });
45
- });
46
- });
@@ -1,44 +0,0 @@
1
- /// <reference types="cypress" />
2
- // @ts-nocheck
3
-
4
- // import SHORTY from '../../src/index';
5
- import * as SHORTY from '../../src/index';
6
-
7
- describe('Shorty Library Tests', () => {
8
- before(() => {
9
- cy.visit('cypress/test.html');
10
- });
11
-
12
- it('Test boolean folder', () => {
13
- const {
14
- // these are impossible to test 100% of the branches
15
- isApple,
16
- isMobile,
17
- isFirefox,
18
- support3DTransform,
19
- supportAnimation,
20
- supportPassive,
21
- supportTouch,
22
- supportTransform,
23
- supportTransition,
24
- // querySelectorAll, getWindow
25
- } = SHORTY;
26
- cy
27
- .window()
28
- .then(() => {
29
- expect(isApple, 'isApple').to.be.false;
30
- expect(isMobile, 'isMobile').to.be.false;
31
- if (Cypress.isBrowser('firefox')) {
32
- expect(isFirefox, 'isFirefox').to.be.true;
33
- } else {
34
- expect(isFirefox, 'isFirefox').to.be.false;
35
- }
36
- expect(support3DTransform, 'support3DTransform').to.be.true;
37
- expect(supportAnimation, 'supportAnimation').to.be.true;
38
- expect(supportPassive, 'supportPassive').to.be.true;
39
- expect(supportTouch, 'supportTouch').to.be.false;
40
- expect(supportTransform, 'supportTransform').to.be.true;
41
- expect(supportTransition, 'supportTransition').to.be.true;
42
- });
43
- });
44
- });
@@ -1,28 +0,0 @@
1
- /// <reference types="cypress" />
2
- // @ts-nocheck
3
-
4
- // import SHORTY from '../../src/index';
5
- import * as SHORTY from '../../src/index';
6
-
7
- describe('Shorty Library Tests', () => {
8
- before(() => {
9
- cy.visit('cypress/test.html');
10
- });
11
-
12
- it('Test class folder', () => {
13
- const { addClass, hasClass, removeClass } = SHORTY;
14
- cy
15
- .get('.alert')
16
- .then($alert => {
17
- const alert = $alert[0];
18
-
19
- addClass(alert, 'to-be-removed');
20
- expect(hasClass(alert, 'to-be-removed')).to.be.true;
21
- removeClass(alert, 'show');
22
- expect(hasClass(alert, 'show')).to.be.false;
23
- })
24
- .wait(200)
25
- .get('.alert')
26
- .should('be.hidden');
27
- });
28
- });