* Upgrade jest to 29 and puppeteer to 16 in rrweb * Apply formatting changes * Upgrade rrweb's puppeteer to v20 * Apply formatting changes * Canvas: Reduce flickering and capturing of empty canvas elements Turn on `preserveDrawingBuffer` by default for canvas FPS recording. Has some negative performance implications, but really helps when capturing canvas. * Apply formatting changes * Include all test image snapshots in ci * Apply formatting changes * Allow more flexibility when capturing hover * Apply formatting changes * Create tiny-chairs-build.md * Apply formatting changes * Update hover.test.ts * Apply formatting changes * Document snapshotFormat jest config * Freeze `yarn.lock` in ci for reproducible dependencies * Apply formatting changes * Apply formatting changes * Revert to old style of puppeteer evaluation script notation * Apply formatting changes * Make test less flaky * Apply formatting changes * Apply formatting changes * Make tests less flaky * Apply formatting changes * Make test more robust * Apply formatting changes * Apply formatting changes * Add debugging code for test * Apply formatting changes * Also test not ignored input * Apply formatting changes * Apply formatting changes * Apply formatting changes * escape ignoreSelector * Apply formatting changes * Apply formatting changes
74 lines
1.8 KiB
TypeScript
74 lines
1.8 KiB
TypeScript
import * as fs from 'fs';
|
|
import * as path from 'path';
|
|
import { launchPuppeteer, waitForRAF } from '../utils';
|
|
import { toMatchImageSnapshot } from 'jest-image-snapshot';
|
|
import type * as puppeteer from 'puppeteer';
|
|
import events from '../events/hover';
|
|
|
|
interface ISuite {
|
|
code: string;
|
|
styles: string;
|
|
browser: puppeteer.Browser;
|
|
page: puppeteer.Page;
|
|
}
|
|
|
|
expect.extend({ toMatchImageSnapshot });
|
|
|
|
describe('replayer', function () {
|
|
jest.setTimeout(10_000);
|
|
|
|
let code: ISuite['code'];
|
|
let styles: ISuite['styles'];
|
|
let browser: ISuite['browser'];
|
|
let page: ISuite['page'];
|
|
|
|
beforeAll(async () => {
|
|
browser = await launchPuppeteer({ devtools: true });
|
|
|
|
const bundlePath = path.resolve(__dirname, '../../dist/rrweb.js');
|
|
const stylePath = path.resolve(
|
|
__dirname,
|
|
'../../src/replay/styles/style.css',
|
|
);
|
|
code = fs.readFileSync(bundlePath, 'utf8');
|
|
styles = fs.readFileSync(stylePath, 'utf8');
|
|
});
|
|
|
|
beforeEach(async () => {
|
|
page = await browser.newPage();
|
|
await page.goto('about:blank');
|
|
await page.addStyleTag({
|
|
content: styles,
|
|
});
|
|
await page.evaluate(code);
|
|
await page.evaluate(`let events = ${JSON.stringify(events)}`);
|
|
|
|
page.on('console', (msg) => console.log('PAGE LOG:', msg.text()));
|
|
});
|
|
|
|
afterEach(async () => {
|
|
await page.close();
|
|
});
|
|
|
|
afterAll(async () => {
|
|
await browser.close();
|
|
});
|
|
|
|
describe('hover', () => {
|
|
it('should trigger hover on mouseDown', async () => {
|
|
await page.evaluate(`
|
|
const { Replayer } = rrweb;
|
|
const replayer = new Replayer(events);
|
|
replayer.pause(110); // mouseDown event is at 100
|
|
`);
|
|
|
|
await waitForRAF(page);
|
|
|
|
const image = await page.screenshot();
|
|
expect(image).toMatchImageSnapshot({
|
|
failureThreshold: 40,
|
|
});
|
|
});
|
|
});
|
|
});
|