* create rrdom package * test(rrdom): add unit tests for polyfill.ts * fix(rrweb snapshot): type check errors Errors are caused by the declaration similarity of @types/mocha and @types/jest if we install both of them in the whole project. * Set tagNames to upper case by default This mirrors the `Element.tagName` implementation: ``` For DOM trees which represent HTML documents, the returned tag name is always in the canonical upper-case form. For example, tagName called on a <div> element returns "DIV". ``` https://developer.mozilla.org/en-US/docs/Web/API/Element/tagName * Add workspace file * VSCode settings for rrdom tests * Add basic test for RRDocument * Only setup jest tests for rrdom * mock Node type and Event type for nodejs environment * test(rrdom): add snapshot for document.test.ts * fix issue of nwsapi import and add unit tests for rrdom * fix: querySelectorAll returns nothing when querying elements with ids and classNames * fix: error of unit test for Event polyfill Since Event class is built in nodejs after v15.0.0 * add a dummy implementation of canvas * add style element support * add unit test for style element Co-authored-by: Justin Halsall <Juice10@users.noreply.github.com>
84 lines
2.5 KiB
TypeScript
84 lines
2.5 KiB
TypeScript
import { RRDocument, RRNode } from '../src/document-nodejs';
|
|
import {
|
|
polyfillPerformance,
|
|
polyfillRAF,
|
|
polyfillEvent,
|
|
polyfillNode,
|
|
polyfillDocument,
|
|
} from '../src/polyfill';
|
|
|
|
describe('polyfill for nodejs', () => {
|
|
it('should polyfill performance api', () => {
|
|
expect(global.performance).toBeUndefined();
|
|
polyfillPerformance();
|
|
expect(global.performance).toBeDefined();
|
|
expect(performance).toBeDefined();
|
|
expect(performance.now).toBeDefined();
|
|
expect(performance.now()).toBeCloseTo(
|
|
require('perf_hooks').performance.now(),
|
|
1e-10,
|
|
);
|
|
});
|
|
|
|
it('should polyfill requestAnimationFrame', () => {
|
|
expect(global.requestAnimationFrame).toBeUndefined();
|
|
expect(global.cancelAnimationFrame).toBeUndefined();
|
|
polyfillRAF();
|
|
expect(global.requestAnimationFrame).toBeDefined();
|
|
expect(global.cancelAnimationFrame).toBeDefined();
|
|
expect(requestAnimationFrame).toBeDefined();
|
|
expect(cancelAnimationFrame).toBeDefined();
|
|
|
|
jest.useFakeTimers();
|
|
const AnimationTime = 1_000; // target animation time(unit: ms)
|
|
const startTime = Date.now();
|
|
let frameCount = 0;
|
|
const rafCallback1 = () => {
|
|
const currentTime = Date.now();
|
|
frameCount++;
|
|
if (currentTime - startTime < AnimationTime) {
|
|
requestAnimationFrame(rafCallback1);
|
|
} else {
|
|
expect(frameCount).toBeGreaterThanOrEqual(55);
|
|
expect(frameCount).toBeLessThanOrEqual(65);
|
|
}
|
|
};
|
|
requestAnimationFrame(rafCallback1);
|
|
// Fast-forward until all timers have been executed
|
|
jest.runAllTimers();
|
|
|
|
let rafHandle;
|
|
const rafCallback2 = () => {
|
|
rafHandle = requestAnimationFrame(rafCallback2);
|
|
};
|
|
rafHandle = requestAnimationFrame(rafCallback2);
|
|
|
|
// If this function doesn't work, recursive function will never end.
|
|
cancelAnimationFrame(rafHandle);
|
|
jest.runAllTimers();
|
|
jest.useRealTimers();
|
|
});
|
|
|
|
it('should polyfill Event type', () => {
|
|
polyfillEvent();
|
|
expect(global.Event).toBeDefined();
|
|
expect(Event).toBeDefined();
|
|
});
|
|
|
|
it('should polyfill Node type', () => {
|
|
expect(global.Node).toBeUndefined();
|
|
polyfillNode();
|
|
expect(global.Node).toBeDefined();
|
|
expect(Node).toBeDefined();
|
|
expect(Node).toEqual(RRNode);
|
|
});
|
|
|
|
it('should polyfill document object', () => {
|
|
expect(global.document).toBeUndefined();
|
|
polyfillDocument();
|
|
expect(global.document).toBeDefined();
|
|
expect(document).toBeDefined();
|
|
expect(document).toBeInstanceOf(RRDocument);
|
|
});
|
|
});
|