@thednp/shorty 2.0.2 → 2.0.4

package/test/get.test.ts

@@ -0,0 +1,150 @@
+import { expect, it, describe, afterEach } from 'vitest';
+import { getExampleDOM } from './fixtures/getExampleDom';
+import * as SHORTY from '../src/index';
+import CustomElem from './fixtures/custom-elem';
+import "./fixtures/style.css";
+
+describe('Shorty Library Tests - GET', () => {
+  const wrapper = document.createElement('div');
+  document.body.append(wrapper);
+  afterEach(() => {
+    wrapper.innerHTML = '';
+  });
+
+  it('Test get folder', async () => {
+    const container = getExampleDOM();
+    wrapper.append(container);
+
+    const {
+      getBoundingClientRect,
+      getDocument,
+      getDocumentBody,
+      getDocumentElement,
+      getDocumentHead,
+      getElementAnimationDelay,
+      getElementAnimationDuration,
+      getElementTransitionDelay,
+      getElementTransitionDuration,
+      getElementStyle,
+      getNodeScroll,
+      getParentNode,
+      getRectRelativeToOffsetParent,
+      getUID,
+      getWindow,
+      ObjectValues,
+      querySelector
+    } = SHORTY;
+    const element = querySelector('.alert', container);
+    // console.log(element)
+
+    if (!element) return;
+
+    // Object.assign(element.style, {width: '860px', height: '110px', top: '85', left: '60' });
+    element.style.transform = 'scale(1.01)';
+    const win = getWindow(element);
+    const CE = new CustomElem();
+    CE.className = 'btn btn-outline-primary';
+    container.append(CE);
+
+    // we round values so all browsers return same values
+    let { x, y, top, left, right, bottom, width, height } = getBoundingClientRect(
+      element,
+      true,
+    );
+    expect(
+      ObjectValues([x, y, top, left, right, bottom, width, height] as any).map(Math.round)
+      // ).to.deep.equal([63, 87, 87, 63, 927, 204, 864, 117]);
+    ).to.not.deep.equal([0, 0, 0, 0, 0, 0, 0, 0]);
+    element.style.transform = '';
+
+    expect(getWindow()).toBeDefined(); // root WINDOW
+    expect(getWindow(element.ownerDocument)).toBeDefined();
+    expect(getWindow(CE)).toBeDefined();
+    expect(getWindow(CE.shadowRoot as Node)).toBeDefined();
+    expect(getWindow(win.top as unknown as Node)).toBeDefined();
+
+    expect(getDocument()).toBeDefined();
+    expect(getDocument(element)).toBeDefined();
+    expect(getDocument(win.document as unknown as Document)).toBeDefined();
+    expect(getDocument(win as any)).toBeDefined();
+
+    expect(getDocumentBody(element)).toBeDefined();
+    expect(getDocumentElement(element)).toBeDefined();
+    expect(getDocumentHead(element)).toBeDefined();
+
+    expect(getElementAnimationDelay(element)).to.equal(0);
+    expect(getElementAnimationDuration(element)).to.equal(0);
+
+    CE.style.animation = 'animate-me 1s ease 0.5s';
+    expect(getElementAnimationDelay(CE)).to.equal(500);
+    expect(getElementAnimationDuration(CE)).to.equal(1000);
+
+    CE.style.animation = 'animate-me 1200ms ease 400ms';
+    expect(getElementAnimationDelay(CE)).to.equal(400);
+
+    expect(getElementAnimationDuration(CE)).to.equal(1200);
+
+    element.style.transition = 'opacity .145s linear .1s';
+    expect(getElementTransitionDelay(element)).to.equal(100);
+    expect(getElementTransitionDuration(element)).to.equal(145);
+
+    element.style.transition = 'opacity 140ms linear 10ms';
+    expect(
+      getElementTransitionDelay(element),
+    ).to.equal(10);
+
+    expect(
+      getElementTransitionDuration(element),
+    ).to.equal(140);
+
+    element.style.transition = '';
+
+    expect(getElementStyle(element, 'color'), 'getElementStyle(color)').to.equal(
+      'rgb(102, 77, 3)',
+    );
+
+    expect(getNodeScroll(win)).to.deep.equal({ x: 0, y: 0 });
+    expect(getNodeScroll(element), 'getNodeScroll(element)').to.deep.equal({ x: 0, y: 0 });
+    expect(
+      getNodeScroll(element.offsetParent as HTMLElement),
+      'getNodeScroll(element.offsetParent)',
+    ).to.deep.equal({ x: 0, y: 0 });
+    expect(getNodeScroll(getDocumentBody(element)), 'getNodeScroll(body)').to.deep.equal({
+      x: 0,
+      y: 0,
+    });
+
+    expect(getParentNode(getDocumentElement())).to.be.instanceOf(
+      HTMLHtmlElement,
+    ); // root HTML
+    expect(getParentNode(win as any)).to.be.instanceOf(HTMLHtmlElement);
+    expect(getParentNode(getDocumentBody(element))).to.be.instanceOf(
+      HTMLHtmlElement,
+    );
+    expect(getParentNode(element), 'getParentNode(node)').toBeDefined();
+    expect(getParentNode(CE), 'getParentNode(CustomElement)').to.be.instanceOf(
+      HTMLDivElement,
+    );
+    expect(
+      getParentNode(CE.shadowRoot!),
+      'getParentNode(CustomElement.shadowRoot)',
+    ).to.be.instanceOf(CustomElem);
+
+    ({ x, y, width, height } = getRectRelativeToOffsetParent(
+      element,
+      getDocumentElement(win),
+      getNodeScroll(getDocumentElement(win)),
+    ));
+
+    expect(
+      [x, y, width, height].map(Math.round),
+      'getRectRelativeToOffsetParent',
+    ).to.not.deep.equal([0, 0, 0, 0]);
+
+    expect(getUID(element), 'getUID()').to.eq(0);
+    expect(getUID(element, 'Alert'), 'getUID(key) - set & returns').to.eq(0);
+    expect(getUID(element, 'Alert'), 'getUID(key) - returns').to.eq(0);
+    expect(getUID(win.document.body, 'Alert'), 'getUID(key) - set & returns').to.eq(1);
+    expect(getUID(win.document.body, 'Alert'), 'getUID(key) - returns').to.eq(1);
+  });
+});

package/{cypress/e2e/is.cy.ts → test/is.test.ts}

@@ -1,17 +1,22 @@
-/// <reference types="cypress" />
-// @ts-nocheck
-
-// import SHORTY from '../../src/index';
-import * as SHORTY from '../../src/index';
-
-import CustomElem from '../fixtures/custom-elem';
-
-describe('Shorty Library Tests', () => {
-  before(() => {
-    cy.visit('cypress/test.html');
+import { expect, it, describe, vi, afterEach } from 'vitest';
+import { getExampleDOM } from './fixtures/getExampleDom';
+import * as SHORTY from '../src/index';
+import "./fixtures/style.css";
+
+import CustomElem from './fixtures/custom-elem';
+
+describe('Shorty Library Tests - IS', () => {
+  const wrapper = document.createElement('div');
+  document.body.append(wrapper);
+  afterEach(async () => {
+    wrapper.innerHTML = '';
   });
 
   it('Test is folder', () => {
+    const container = getExampleDOM();
+    wrapper.append(container);
+    const win = container.ownerDocument.defaultView!;
+
     const {
       isArray,
       isCustomElement,
@@ -45,78 +50,75 @@ describe('Shorty Library Tests', () => {
       // getElementsByTagName,
     } = SHORTY;
 
-    cy.get('div').then($element => {
-      // const win = getWindow($element[0]);
-      const CE = new CustomElem();
-      CE.className = 'btn btn-outline-primary';
-      CE.style.transform = 'scale(1.01)';
-      getWindow($element[0]).document.body.append(CE);
-    })
-    .wait(100)
-    .get('.alert').then($element => {
-      const element = $element[0];
-      const win = getWindow(element);
-      const CE = querySelector('custom-elem', win.document);
-      // CE.className = 'btn btn-outline-primary';
-      // CE.style.transform = 'scale(1.01)';
-      // win.document.body.append(CE);
-      const img = querySelector('img', element);
-      const svg = querySelector('svg', element);
-      const path = querySelector('path', element);
-      const table = querySelector('table', win.document);
-
-      expect(isArray(new Float32Array(0, 'a')), 'isArray(Float32Array)').to.be.false;
+    // const win = getWindow($element[0]);
+    const CE1 = new CustomElem();
+    CE1.className = 'btn btn-outline-primary';
+    CE1.style.transform = 'scale(1.01)';
+    document.body.append(CE1);
+
+    const element = querySelector('.alert', container)!;
+    const CE = querySelector('custom-elem', document) as HTMLElement;
+    CE.className = 'btn btn-outline-primary';
+    // CE.style.transform = 'scale(1.01)';
+    // win.document.body.append(CE);
+    const img = querySelector('img', element);
+    const svg = querySelector('svg', element);
+    const path = querySelector('path', element);
+    const table = querySelector('table', document);
+
+    vi.waitFor(() => {
+      expect(isArray(new Float32Array(0 as any, 'a' as any))).to.be.false;
       expect(isArray(), 'isArray()').to.be.false;
       expect(isArray(element), 'isArray(node)').to.be.false;
       expect(isArray([0, 'a']), 'isArray([0, 1]])').to.be.true;
-      expect(isArray(new Array(0, 'a')), 'isArray(new Array(0, 1)])').to.be.true;
-
+      expect(isArray(new Array(<any>0, 'a')), 'isArray(new Array(0, 1)])').to.be.true;
+  
       expect(isDocument(), 'isDocument()').to.be.false;
       expect(isDocument(win), 'isDocument(document)').to.be.false;
       expect(isDocument(document), 'isDocument(document)').to.be.true;
       expect(isDocument(win.document), 'isDocument(document)').to.be.true;
-
+  
       expect(isElement(), 'isElement()').to.be.false;
       expect(isElement(win.document), 'isElement(document)').to.be.false;
       expect(isElement(win), 'isElement(window)').to.be.false;
       expect(isElement(element), 'isElement(node)').to.be.true;
       expect(isElement(win.document.body), 'isElement(body)').to.be.true;
-
+  
       expect(isElementsArray(), 'isElementsArray()').to.be.false;
       expect(isElementsArray(win), 'isElementsArray(window)').to.be.false;
       expect(isElementsArray([0, 1]), 'isElementsArray(window)').to.be.false;
       expect(isElementsArray([...element.children]), 'isElementsArray(expected)').to.be.true;
-
+  
       expect(isFunction(), 'isFunction()').to.be.false;
       expect(isFunction(element), 'isFunction(node)').to.be.false;
       expect(isFunction(element.addEventListener), 'isFunction(function)').to.be.true;
-
+  
       expect(isObject(), 'isObject()').to.be.false;
       expect(isObject(element), 'isObject(node)').to.be.true;
       expect(isObject({ a: 2 }), 'isObject(object)').to.be.true;
       expect(isObject(element.addEventListener), 'isObject(function)').to.be.false;
-
+  
       expect(isHTMLCollection(), 'isHTMLCollection()').to.be.false;
       expect(isHTMLCollection([...element.children]), 'isHTMLCollection(array)').to.be.false;
       expect(isHTMLCollection(element.children), 'isHTMLCollection(expected)').to.be.true;
-
+  
       expect(isHTMLElement(), 'isHTMLElement()').to.be.false;
       expect(isHTMLElement(element), 'isHTMLElement(element)').to.be.true;
       expect(isHTMLElement(win), 'isHTMLElement(window)').to.be.false;
       expect(isHTMLElement(win.document.body), 'isHTMLElement(body)').to.be.true;
       expect(isHTMLElement(win.document.head), 'isHTMLElement(head)').to.be.true;
       expect(isHTMLElement(CE), 'isHTMLElement(CustomElement)').to.be.true;
-      expect(isHTMLElement(CE.shadowRoot), 'isHTMLElement(CustomElement)').to.be.false;
+      expect(isHTMLElement(CE!.shadowRoot), 'isHTMLElement(CustomElement)').to.be.false;
       expect(isHTMLElement([...element.children]), 'isHTMLElement(array)').to.be.false;
       expect(isHTMLElement(win.document), 'isHTMLElement(document)').to.be.false;
-
+  
       expect(isHTMLImageElement(), 'isHTMLImageElement()').to.be.false;
       expect(isHTMLImageElement(win.document), 'isHTMLImageElement(document)').to.be.false;
       expect(isHTMLImageElement(win), 'isHTMLImageElement(window)').to.be.false;
       expect(isHTMLImageElement(img), 'isHTMLImageElement(image)').to.be.true;
       expect(isHTMLImageElement(svg), 'isHTMLImageElement(svg)').to.be.false;
       expect(isHTMLImageElement(path), 'isHTMLImageElement(path)').to.be.false;
-
+  
       expect(isMedia(), 'isMedia()').to.be.false;
       expect(isMedia(win.document), 'isMedia(document)').to.be.false;
       expect(isMedia(win), 'isMedia(window)').to.be.false;
@@ -124,7 +126,7 @@ describe('Shorty Library Tests', () => {
       expect(isMedia(img), 'isMedia(image)').to.be.true;
       expect(isMedia(svg), 'isMedia(svg)').to.be.true;
       expect(isMedia(path), 'isMedia(path)').to.be.true;
-
+  
       expect(isCanvas(), 'isCanvas()').to.be.false;
       expect(isCanvas(win.document), 'isCanvas(document)').to.be.false;
       expect(isCanvas(win), 'isCanvas(window)').to.be.false;
@@ -132,34 +134,34 @@ describe('Shorty Library Tests', () => {
       expect(isCanvas(img), 'isCanvas(image)').to.be.false;
       expect(isCanvas(svg), 'isCanvas(svg)').to.be.false;
       expect(isCanvas(win.document.createElement('canvas')), 'isCanvas(canvas)').to.be.true;
-
+  
       expect(isJSON(), 'isJSON()').to.be.false;
-      expect(isJSON(win.document), 'isJSON(document)').to.be.false;
-      expect(isJSON(win), 'isJSON(window)').to.be.false;
+      expect(isJSON(win.document as any), 'isJSON(document)').to.be.false;
+      expect(isJSON(win as any), 'isJSON(window)').to.be.false;
       expect(isJSON('some string'), 'isJSON(JSON)').to.be.false;
       expect(isJSON('{"a":1,"b":2}'), 'isJSON(JSON)').to.be.true;
       expect(isJSON('["a",2]'), 'isJSON(JSON)').to.be.true;
-
+  
       expect(isMap(), 'isMap()').to.be.false;
       expect(isMap(win.document), 'isMap(document)').to.be.false;
       expect(isMap(win), 'isMap(window)').to.be.false;
       expect(isMap(new Map()), 'isMap(Map)').to.be.true;
-
+  
       expect(isWeakMap(), 'isWeakMap()').to.be.false;
       expect(isWeakMap(win.document), 'isWeakMap(document)').to.be.false;
       expect(isWeakMap(win), 'isWeakMap(window)').to.be.false;
       expect(isWeakMap(new WeakMap()), 'isWeakMap(WeakMap)').to.be.true;
-
+  
       expect(isElementInScrollRange(), 'isElementInScrollRange()').to.be.false;
-      expect(isElementInScrollRange(win), 'isElementInScrollRange(window)').to.be.false;
-      expect(isElementInScrollRange(CE), 'isElementInScrollRange(CustomElement)').to.be.true;
+      expect(isElementInScrollRange(win as any), 'isElementInScrollRange(window)').to.be.false;
+      expect(isElementInScrollRange(CE!), 'isElementInScrollRange(CustomElement)').to.be.true;
       expect(isElementInScrollRange(element), 'isElementInScrollRange(node)').to.be.true;
-
+  
       expect(isElementInViewport(), 'isElementInScrollRange()').to.be.false;
-      expect(isElementInViewport(win), 'isElementInScrollRange(window)').to.be.false;
-      expect(isElementInViewport(CE), 'isElementInScrollRange(CustomElement)').to.be.true;
+      expect(isElementInViewport(win as any), 'isElementInScrollRange(window)').to.be.false;
+      expect(isElementInViewport(CE!), 'isElementInViewport(CustomElement)').to.be.false;
       expect(isElementInViewport(element), 'isElementInScrollRange(node)').to.be.true;
-
+  
       expect(isNode(), 'isNode()').to.be.false;
       expect(isNode(img), 'isNode(image)').to.be.true;
       expect(isNode(svg), 'isNode(svg)').to.be.true;
@@ -167,22 +169,22 @@ describe('Shorty Library Tests', () => {
       expect(isNode(win.document), 'isNode(document)').to.be.true;
       expect(isNode(win), 'isNode(window)').to.be.false;
       expect(isNode(CE), 'isNode(CustomElement)').to.be.true;
-
+  
       expect(isNodeList(), 'isNodeList()').to.be.false;
       expect(isNodeList(element), 'isNodeList(node)').to.be.false;
       expect(isNodeList(element.children), 'isNodeList(HTMLCollection)').to.be.false;
       expect(isNodeList(element.querySelectorAll('*')), 'isNodeList(expected)').to.be.true;
-
+  
       expect(isRTL(), 'isRTL()').to.be.false;
       expect(isRTL(element), 'isRTL(node)').to.be.false;
       expect(isRTL(win.document), 'isRTL(document)').to.be.false;
-
+  
       expect(isScaledElement(), 'isScaledElement()').to.be.false;
       expect(isScaledElement(element), 'isScaledElement(node)').to.be.false;
-      expect(isScaledElement(win), 'isScaledElement(window)').to.be.false;
-      expect(isScaledElement(win.document), 'isScaledElement(document)').to.be.false;
-      expect(isScaledElement(CE), 'isScaledElement(expected)').to.be.true;
-
+      expect(isScaledElement(win as any), 'isScaledElement(window)').to.be.false;
+      expect(isScaledElement(win.document as any), 'isScaledElement(document)').to.be.false;
+      expect(isScaledElement(CE!), 'isScaledElement(expected)').to.be.true;
+  
       expect(isSVGElement(), 'isSVGElement()').to.be.false;
       expect(isSVGElement(element), 'isSVGElement(node)').to.be.false;
       expect(isSVGElement(win), 'isSVGElement(window)').to.be.false;
@@ -190,36 +192,36 @@ describe('Shorty Library Tests', () => {
       expect(isSVGElement(CE), 'isSVGElement(CustomElement)').to.be.false;
       expect(isSVGElement(svg), 'isSVGElement(svg)').to.be.true;
       expect(isSVGElement(path), 'isSVGElement(path)').to.be.true;
-
+  
       expect(isString(), 'isString()').to.be.false;
       expect(isString(element), 'isString(node)').to.be.false;
       expect(isString(element.nodeName), 'isString(nodeName)').to.be.true;
       expect(isString(element.nodeType), 'isString(number)').to.be.false;
-
+  
       expect(isNumber(), 'isNumber()').to.be.false;
       expect(isNumber(element), 'isNumber(node)').to.be.false;
       expect(isNumber(element.nodeName), 'isNumber(nodeName)').to.be.false;
       expect(isNumber(element.nodeType), 'isNumber(nodeType)').to.be.true;
       expect(isNumber(0.55), 'isNumber(number)').to.be.true;
       expect(isNumber(-Infinity), 'isNumber(Infinity)').to.be.true;
-
+  
       expect(isTableElement(), 'isTableElement()').to.be.false;
       expect(isTableElement(element), 'isTableElement(node)').to.be.false;
       expect(isTableElement(win), 'isTableElement(window)').to.be.false;
       expect(isTableElement(win.document), 'isTableElement(document)').to.be.false;
       expect(isTableElement(CE), 'isTableElement(CustomElement)').to.be.false;
       expect(isTableElement(table), 'isTableElement(table)').to.be.true;
-      expect(isTableElement(querySelector('td', table)), 'isTableElement(TD)').to.be.true;
-      expect(isTableElement(querySelector('th', table)), 'isTableElement(TH)').to.be.true;
-
+      expect(isTableElement(querySelector('td', table!)), 'isTableElement(TD)').to.be.true;
+      expect(isTableElement(querySelector('th', table!)), 'isTableElement(TH)').to.be.true;
+  
       expect(isWindow(), 'isWindow()').to.be.false;
       expect(isWindow(win.document), 'isWindow(document)').to.be.false;
       expect(isWindow(document), 'isWindow(document)').to.be.false;
-      expect(isWindow(win), 'isDocument(window)').to.be.true;
-      expect(isWindow(win.top), 'isDocument(window)').to.be.true;
+      expect(isWindow(win), 'isWindow(window)').to.be.true;
+      expect(isWindow(win.top), 'isWindow(window)').to.be.true;
       expect(isWindow(window), 'isDocument(window)').to.be.true;
       expect(isWindow(window.top), 'isDocument(window)').to.be.true;
-
+  
       expect(isCustomElement(), 'isCustomElement()').to.be.false;
       expect(isCustomElement(element), 'isCustomElement(node)').to.be.false;
       expect(isCustomElement(CE), 'isCustomElement(CustomElement)').to.be.true;
@@ -227,7 +229,8 @@ describe('Shorty Library Tests', () => {
       expect(isShadowRoot(), 'isShadowRoot()').to.be.false;
       expect(isShadowRoot(element), 'isShadowRoot(element)').to.be.false;
       expect(isShadowRoot(document), 'isShadowRoot(document)').to.be.false;
-      expect(isShadowRoot(CE.shadowRoot), 'isShadowRoot(CustomElement.shadowRoot)').to.be.true;
-    });
+      expect(isShadowRoot(CE!.shadowRoot), 'isShadowRoot(CustomElement.shadowRoot)').to.be.true;  
+
+    }, { timeout: 150 })
   });
 });