diff --git a/.github/workflows/eslint.yml b/.github/workflows/eslint.yml deleted file mode 100644 index d7f3e41f..00000000 --- a/.github/workflows/eslint.yml +++ /dev/null @@ -1,47 +0,0 @@ -name: Eslint Check - -on: [pull_request] - -jobs: - eslint_check_upload: - runs-on: ubuntu-latest - name: ESLint Check and Report Upload - - steps: - - uses: actions/checkout@v3 - - name: Setup Node.js - uses: actions/setup-node@v1 - with: - node-version: 16.15.0 - registry-url: https://registry.npmjs.org - - name: Install - run: YARN_ENABLE_IMMUTABLE_INSTALLS=false yarn - - name: Build Packages - run: yarn build:all - - name: Test Code Linting - run: yarn turbo run lint - - name: Save Code Linting Report JSON - run: yarn lint:report - # Continue to the next step even if this fails - continue-on-error: true - - name: Upload ESLint report - uses: actions/upload-artifact@v3 - with: - name: eslint_report.json - path: eslint_report.json - - Annotation: - # Skip the annotation action in PRs from the forked repositories - if: github.event.pull_request.head.repo.full_name == 'rrweb-io/rrweb' - needs: eslint_check_upload - runs-on: ubuntu-latest - steps: - - uses: actions/checkout@v3 - - uses: actions/download-artifact@v3 - with: - name: eslint_report.json - - name: Annotate Code Linting Results - uses: ataylorme/eslint-annotate-action@v2 - with: - repo-token: '${{ secrets.GITHUB_TOKEN }}' - report-json: 'eslint_report.json' diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml deleted file mode 100644 index c477cf5a..00000000 --- a/.github/workflows/release.yml +++ /dev/null @@ -1,18 +0,0 @@ -name: Release Rrweb -on: push -jobs: - release: - runs-on: ubuntu-latest - steps: - - uses: actions/checkout@v3 - - name: Setup Node.js - uses: actions/setup-node@v1 - with: - node-version: 16.15.0 - registry-url: https://registry.npmjs.org - - name: Install - run: YARN_ENABLE_IMMUTABLE_INSTALLS=false yarn - - name: Build all - run: yarn build:all -# - name: Test all -# run: yarn test diff --git a/.github/workflows/style-check.yml b/.github/workflows/style-check.yml index 998e8087..d42668cf 100644 --- a/.github/workflows/style-check.yml +++ b/.github/workflows/style-check.yml @@ -5,15 +5,14 @@ on: [push, pull_request_target] jobs: eslint_check_upload: runs-on: ubuntu-latest - name: ESLint Check and Report Upload + name: Build & ESLint Check steps: - uses: actions/checkout@v3 - name: Setup Node.js - uses: actions/setup-node@v1 + uses: actions/setup-node@v3 with: - node-version: 16.15.0 - registry-url: https://registry.npmjs.org + node-version: 16 - name: Install run: YARN_ENABLE_IMMUTABLE_INSTALLS=false yarn - name: Build Packages @@ -48,16 +47,15 @@ jobs: prettier_check: # In the forked PR, it's hard to format code and push to the branch directly, so the action only check the format correctness. - if: github.event_name != 'push' && github.event.pull_request.head.repo.full_name != 'rrweb-io/rrweb' + if: github.event_name != 'push' runs-on: ubuntu-latest name: Format Check steps: - uses: actions/checkout@v3 - name: Setup Node.js - uses: actions/setup-node@v1 + uses: actions/setup-node@v3 with: - node-version: 16.15.0 - registry-url: https://registry.npmjs.org + node-version: 16 - name: Install run: YARN_ENABLE_IMMUTABLE_INSTALLS=false yarn - name: Prettier Check @@ -65,16 +63,15 @@ jobs: prettier: # Skip the format code action in forked PRs - if: github.event_name == 'push' || github.event.pull_request.head.repo.full_name == 'rrweb-io/rrweb' + if: github.event_name == 'push' runs-on: ubuntu-latest name: Format Code steps: - uses: actions/checkout@v3 - name: Setup Node.js - uses: actions/setup-node@v1 + uses: actions/setup-node@v3 with: - node-version: 16.15.0 - registry-url: https://registry.npmjs.org + node-version: 16 - name: Install run: YARN_ENABLE_IMMUTABLE_INSTALLS=false yarn - name: Prettify Code diff --git a/package.json b/package.json index a4a7dcea..9b5a3c2d 100644 --- a/package.json +++ b/package.json @@ -30,6 +30,7 @@ "eslint-plugin-tsdoc": "^0.2.16", "markdownlint": "^0.25.1", "markdownlint-cli": "^0.31.1", + "prettier": "^2.7.1", "turbo": "^1.2.4", "typescript": "^4.7.3" }, diff --git a/packages/rrdom-nodejs/src/document-nodejs.ts b/packages/rrdom-nodejs/src/document-nodejs.ts index 95a01ce4..13f5cf80 100644 --- a/packages/rrdom-nodejs/src/document-nodejs.ts +++ b/packages/rrdom-nodejs/src/document-nodejs.ts @@ -38,7 +38,7 @@ export class RRDocument extends BaseRRDocumentImpl(RRNode) implements IRRDocument { - readonly nodeName: '#document' = '#document'; + readonly nodeName = '#document' as const; private _nwsapi: NWSAPI; get nwsapi() { if (!this._nwsapi) { @@ -374,15 +374,15 @@ export class RRIFrameElement extends RRElement { } export class RRText extends BaseRRTextImpl(RRNode) { - readonly nodeName: '#text' = '#text'; + readonly nodeName = '#text' as const; } export class RRComment extends BaseRRCommentImpl(RRNode) { - readonly nodeName: '#comment' = '#comment'; + readonly nodeName = '#comment' as const; } export class RRCDATASection extends BaseRRCDATASectionImpl(RRNode) { - readonly nodeName: '#cdata-section' = '#cdata-section'; + readonly nodeName = '#cdata-section' as const; } interface RRElementTagNameMap { diff --git a/packages/rrdom/src/document.ts b/packages/rrdom/src/document.ts index 583e8911..c25aafed 100644 --- a/packages/rrdom/src/document.ts +++ b/packages/rrdom/src/document.ts @@ -199,7 +199,7 @@ export function BaseRRDocumentImpl< >(RRNodeClass: RRNode) { return class BaseRRDocument extends RRNodeClass implements IRRDocument { public readonly nodeType: number = NodeType.DOCUMENT_NODE; - public readonly nodeName: '#document' = '#document'; + public readonly nodeName = '#document' as const; public readonly compatMode: 'BackCompat' | 'CSS1Compat' = 'CSS1Compat'; public readonly RRNodeType = RRNodeType.Document; public textContent: string | null = null; @@ -604,7 +604,7 @@ export function BaseRRTextImpl>( // @ts-ignore return class BaseRRText extends RRNodeClass implements IRRText { public readonly nodeType: number = NodeType.TEXT_NODE; - public readonly nodeName: '#text' = '#text'; + public readonly nodeName = '#text' as const; public readonly RRNodeType = RRNodeType.Text; public data: string; @@ -634,7 +634,7 @@ export function BaseRRCommentImpl< // @ts-ignore return class BaseRRComment extends RRNodeClass implements IRRComment { public readonly nodeType: number = NodeType.COMMENT_NODE; - public readonly nodeName: '#comment' = '#comment'; + public readonly nodeName = '#comment' as const; public readonly RRNodeType = RRNodeType.Comment; public data: string; @@ -666,7 +666,7 @@ export function BaseRRCDATASectionImpl< extends RRNodeClass implements IRRCDATASection { - public readonly nodeName: '#cdata-section' = '#cdata-section'; + public readonly nodeName = '#cdata-section' as const; public readonly nodeType: number = NodeType.CDATA_SECTION_NODE; public readonly RRNodeType = RRNodeType.CDATA; public data: string; diff --git a/packages/rrdom/tsconfig.json b/packages/rrdom/tsconfig.json index 93047c6e..4cf4a46f 100644 --- a/packages/rrdom/tsconfig.json +++ b/packages/rrdom/tsconfig.json @@ -13,8 +13,7 @@ "lib": ["es6", "dom"], "skipLibCheck": true, "declaration": true, - "importsNotUsedAsValues": "error", - "composite": true + "importsNotUsedAsValues": "error" }, "references": [ { diff --git a/packages/rrweb-player/package.json b/packages/rrweb-player/package.json index 2123929f..9497bd69 100644 --- a/packages/rrweb-player/package.json +++ b/packages/rrweb-player/package.json @@ -3,7 +3,7 @@ "version": "1.0.1", "private": true, "devDependencies": { - "@rollup/plugin-commonjs": "^22.0.0", + "@rollup/plugin-commonjs": "22.0.0", "@rollup/plugin-node-resolve": "^13.2.1", "@types/offscreencanvas": "^2019.6.4", "eslint": "^8.23.1", diff --git a/packages/rrweb-player/typings/index.d.ts b/packages/rrweb-player/typings/index.d.ts deleted file mode 100644 index b01854ae..00000000 --- a/packages/rrweb-player/typings/index.d.ts +++ /dev/null @@ -1,76 +0,0 @@ -import { - eventWithTime, - playerConfig, -} from '@highlight-run/rrweb/typings/types'; -import { Replayer, mirror } from '@highlight-run/rrweb/typings'; -import { SvelteComponent } from 'svelte'; - -export type RRwebPlayerOptions = { - target: HTMLElement; - props: { - /** - * The events to replay. - * @default `[]` - */ - events: eventWithTime[]; - /** - * The width of the replayer - * @defaultValue `1024` - */ - width?: number; - /** - * The height of the replayer - * @defaultValue `576` - */ - height?: number; - /** - * The maximum scale of the replayer (1 = 100%). Set to 0 for unlimited - * @defaultValue `1` - */ - maxScale?: number; - /** - * Whether to autoplay - * @defaultValue `true` - */ - autoPlay?: boolean; - /** - * The default speed to play at - * @defaultValue `1` - */ - speed?: number; - /** - * Speed options in UI - * @defaultValue `[1, 2, 4, 8]` - */ - speedOption?: number[]; - /** - * Whether to show the controller UI - * @defaultValue `true` - */ - showController?: boolean; - /** - * Customize the custom events style with a key-value map - * @defaultValue `{}` - */ - tags?: Record; - } & Partial; -}; - -export default class rrwebPlayer extends SvelteComponent { - constructor(options: RRwebPlayerOptions); - - addEventListener(event: string, handler: (params: any) => unknown): void; - - addEvent(event: eventWithTime): void; - getMetaData: Replayer['getMetaData']; - getReplayer: () => Replayer; - getMirror: () => typeof mirror; - - toggle: () => void; - setSpeed: (speed: number) => void; - toggleSkipInactive: () => void; - triggerResize: () => void; - play: () => void; - pause: () => void; - goto: (timeOffset: number, play?: boolean) => void; -} diff --git a/packages/rrweb-snapshot/src/rebuild.ts b/packages/rrweb-snapshot/src/rebuild.ts index 6b733ee8..9ee16fb4 100644 --- a/packages/rrweb-snapshot/src/rebuild.ts +++ b/packages/rrweb-snapshot/src/rebuild.ts @@ -199,10 +199,10 @@ function buildNode( /** * Find all remote fonts in the style tag. * We need to find and replace the URLs with a proxy URL so we can bypass CORS. + * */ if (typeof value === 'string') { - const regex = - /url\(\"https:\/\/\S*(.eot|.woff2|.ttf|.woff)\S*\"\)/gm; + const regex = /url\("https:\/\/\S*(.eot|.woff2|.ttf|.woff)\S*"\)/gm; let m; const fontUrls: { originalUrl: string; proxyUrl: string }[] = []; diff --git a/packages/rrweb-snapshot/test/integration.test.ts b/packages/rrweb-snapshot/test/integration.test.ts index 6ee32f94..06ed8fd7 100644 --- a/packages/rrweb-snapshot/test/integration.test.ts +++ b/packages/rrweb-snapshot/test/integration.test.ts @@ -8,7 +8,7 @@ import * as typescript from 'rollup-plugin-typescript2'; import * as assert from 'assert'; import { waitForRAF } from './utils'; -const _typescript = (typescript as unknown) as () => rollup.Plugin; +const _typescript = typescript as unknown as () => rollup.Plugin; const htmlFolder = path.join(__dirname, 'html'); const htmls = fs.readdirSync(htmlFolder).map((filePath) => { diff --git a/packages/rrweb/src/replay/index.ts b/packages/rrweb/src/replay/index.ts index 0fb399bc..3d99f57e 100644 --- a/packages/rrweb/src/replay/index.ts +++ b/packages/rrweb/src/replay/index.ts @@ -449,20 +449,20 @@ export class Replayer { const currentInterval = userInteractionEvents[i - 1]; const _event = userInteractionEvents[i]; if ( - _event.timestamp! - currentInterval.timestamp! > + _event.timestamp - currentInterval.timestamp > SKIP_TIME_THRESHOLD ) { allIntervals.push({ - startTime: currentInterval.timestamp!, - endTime: _event.timestamp!, - duration: _event.timestamp! - currentInterval.timestamp!, + startTime: currentInterval.timestamp, + endTime: _event.timestamp, + duration: _event.timestamp - currentInterval.timestamp, active: false, }); } else { allIntervals.push({ - startTime: currentInterval.timestamp!, - endTime: _event.timestamp!, - duration: _event.timestamp! - currentInterval.timestamp!, + startTime: currentInterval.timestamp, + endTime: _event.timestamp, + duration: _event.timestamp - currentInterval.timestamp, active: true, }); } @@ -863,8 +863,8 @@ export class Replayer { if (this.config.skipInactive && !this.inactiveEndTimestamp) { for (const interval of this.getActivityIntervals()) { if ( - timestamp >= interval.startTime! && - timestamp < interval.endTime! && + timestamp >= interval.startTime && + timestamp < interval.endTime && !interval.active ) { this.inactiveEndTimestamp = interval.endTime; @@ -872,7 +872,7 @@ export class Replayer { } } if (this.inactiveEndTimestamp) { - const skipTime = this.inactiveEndTimestamp! - timestamp!; + const skipTime = this.inactiveEndTimestamp - timestamp; const payload = { speed: (skipTime / SKIP_DURATION_LIMIT) * this.config.inactiveSkipTime < diff --git a/packages/rrweb/test/events/style-sheet-rule-events.ts b/packages/rrweb/test/events/style-sheet-rule-events.ts index 19a80bbd..3147e31d 100644 --- a/packages/rrweb/test/events/style-sheet-rule-events.ts +++ b/packages/rrweb/test/events/style-sheet-rule-events.ts @@ -146,8 +146,7 @@ const events: eventWithTime[] = [ id: 101, adds: [ { - rule: - '.css-added-at-500-overwritten-at-3000 {border: 1px solid blue;}', + rule: '.css-added-at-500-overwritten-at-3000 {border: 1px solid blue;}', index: 1, }, ], @@ -162,8 +161,7 @@ const events: eventWithTime[] = [ id: 105, adds: [ { - rule: - '.css-added-at-1000-deleted-at-2500{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;min-width:60rem;min-height:100vh;color:blue;}', + rule: '.css-added-at-1000-deleted-at-2500{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;min-width:60rem;min-height:100vh;color:blue;}', index: 2, }, ], diff --git a/packages/rrweb/test/packer.test.ts b/packages/rrweb/test/packer.test.ts index 08b35c6c..f02c41e3 100644 --- a/packages/rrweb/test/packer.test.ts +++ b/packages/rrweb/test/packer.test.ts @@ -17,7 +17,7 @@ describe('pack', () => { describe('unpack', () => { it('is compatible with unpacked data 1', () => { - const result = unpack((event as unknown) as string); + const result = unpack(event as unknown as string); expect(result).toEqual(event); }); diff --git a/packages/rrweb/test/record.test.ts b/packages/rrweb/test/record.test.ts index e353559a..4b3ac24b 100644 --- a/packages/rrweb/test/record.test.ts +++ b/packages/rrweb/test/record.test.ts @@ -86,9 +86,9 @@ describe('record', function (this: ISuite) { it('will only have one full snapshot without checkout config', async () => { await ctx.page.evaluate(() => { - const { record } = ((window as unknown) as IWindow).rrweb; + const { record } = (window as unknown as IWindow).rrweb; record({ - emit: ((window as unknown) as IWindow).emit, + emit: (window as unknown as IWindow).emit, }); }); let count = 30; @@ -110,9 +110,9 @@ describe('record', function (this: ISuite) { it('can checkout full snapshot by count', async () => { await ctx.page.evaluate(() => { - const { record } = ((window as unknown) as IWindow).rrweb; + const { record } = (window as unknown as IWindow).rrweb; record({ - emit: ((window as unknown) as IWindow).emit, + emit: (window as unknown as IWindow).emit, checkoutEveryNth: 10, }); }); @@ -139,9 +139,9 @@ describe('record', function (this: ISuite) { it('can checkout full snapshot by time', async () => { await ctx.page.evaluate(() => { - const { record } = ((window as unknown) as IWindow).rrweb; + const { record } = (window as unknown as IWindow).rrweb; record({ - emit: ((window as unknown) as IWindow).emit, + emit: (window as unknown as IWindow).emit, checkoutEveryNms: 500, }); }); @@ -172,9 +172,9 @@ describe('record', function (this: ISuite) { it('is safe to checkout during async callbacks', async () => { await ctx.page.evaluate(() => { - const { record } = ((window as unknown) as IWindow).rrweb; + const { record } = (window as unknown as IWindow).rrweb; record({ - emit: ((window as unknown) as IWindow).emit, + emit: (window as unknown as IWindow).emit, checkoutEveryNth: 2, }); const p = document.createElement('p'); @@ -198,9 +198,9 @@ describe('record', function (this: ISuite) { it('should record scroll position', async () => { await ctx.page.evaluate(() => { - const { record } = ((window as unknown) as IWindow).rrweb; + const { record } = (window as unknown as IWindow).rrweb; record({ - emit: ((window as unknown) as IWindow).emit, + emit: (window as unknown as IWindow).emit, }); const p = document.createElement('p'); p.innerText = 'testtesttesttesttesttesttesttesttesttest'; @@ -215,9 +215,9 @@ describe('record', function (this: ISuite) { it('should record selection event', async () => { await ctx.page.evaluate(() => { - const { record } = ((window as unknown) as IWindow).rrweb; + const { record } = (window as unknown as IWindow).rrweb; record({ - emit: ((window as unknown) as IWindow).emit, + emit: (window as unknown as IWindow).emit, }); const startNode = document.createElement('p'); @@ -256,9 +256,9 @@ describe('record', function (this: ISuite) { it('can add custom event', async () => { await ctx.page.evaluate(() => { - const { record, addCustomEvent } = ((window as unknown) as IWindow).rrweb; + const { record, addCustomEvent } = (window as unknown as IWindow).rrweb; record({ - emit: ((window as unknown) as IWindow).emit, + emit: (window as unknown as IWindow).emit, }); addCustomEvent('tag1', 1); addCustomEvent<{ a: string }>('tag2', { @@ -271,10 +271,10 @@ describe('record', function (this: ISuite) { it('captures stylesheet rules', async () => { await ctx.page.evaluate(() => { - const { record } = ((window as unknown) as IWindow).rrweb; + const { record } = (window as unknown as IWindow).rrweb; record({ - emit: ((window as unknown) as IWindow).emit, + emit: (window as unknown as IWindow).emit, }); const styleElement = document.createElement('style'); @@ -321,10 +321,10 @@ describe('record', function (this: ISuite) { const captureNestedStylesheetRulesTest = async () => { await ctx.page.evaluate(() => { - const { record } = ((window as unknown) as IWindow).rrweb; + const { record } = (window as unknown as IWindow).rrweb; record({ - emit: ((window as unknown) as IWindow).emit, + emit: (window as unknown as IWindow).emit, }); const styleElement = document.createElement('style'); @@ -382,10 +382,10 @@ describe('record', function (this: ISuite) { it('captures style property changes', async () => { await ctx.page.evaluate(() => { - const { record } = ((window as unknown) as IWindow).rrweb; + const { record } = (window as unknown as IWindow).rrweb; record({ - emit: ((window as unknown) as IWindow).emit, + emit: (window as unknown as IWindow).emit, ignoreCSSAttributes: new Set(['color']), }); @@ -418,7 +418,7 @@ describe('record', function (this: ISuite) { it('captures inserted style text nodes correctly', async () => { await ctx.page.evaluate(() => { - const { record } = ((window as unknown) as IWindow).rrweb; + const { record } = (window as unknown as IWindow).rrweb; const styleEl = document.createElement(`style`); styleEl.append(document.createTextNode('div { color: red; }')); @@ -426,7 +426,7 @@ describe('record', function (this: ISuite) { document.head.appendChild(styleEl); record({ - emit: ((window as unknown) as IWindow).emit, + emit: (window as unknown as IWindow).emit, }); styleEl.append(document.createTextNode('span { color: orange; }')); @@ -452,11 +452,11 @@ describe('record', function (this: ISuite) { }); await waitForRAF(ctx.page); await ctx.page.evaluate(() => { - const { record } = ((window as unknown) as IWindow).rrweb; + const { record } = (window as unknown as IWindow).rrweb; record({ inlineStylesheet: true, - emit: ((window as unknown) as IWindow).emit, + emit: (window as unknown as IWindow).emit, }); }); await waitForRAF(ctx.page); @@ -476,16 +476,17 @@ describe('record', function (this: ISuite) { document.adoptedStyleSheets = [sheet]; const iframe = document.querySelector('iframe'); - const sheet2 = new (iframe!.contentWindow! as Window & - typeof globalThis).CSSStyleSheet(); + const sheet2 = new ( + iframe!.contentWindow! as Window & typeof globalThis + ).CSSStyleSheet(); // Add stylesheet to an IFrame document. iframe!.contentDocument!.adoptedStyleSheets = [sheet2]; iframe!.contentDocument!.body.innerHTML = '

h1 in iframe

'; - const { record } = ((window as unknown) as IWindow).rrweb; + const { record } = (window as unknown as IWindow).rrweb; record({ - emit: ((window as unknown) as IWindow).emit, + emit: (window as unknown as IWindow).emit, }); setTimeout(() => { @@ -549,9 +550,9 @@ describe('record', function (this: ISuite) { sheet2.replaceSync!('div {font-size: large;}'); shadowHost.shadowRoot!.adoptedStyleSheets = [sheet2]; - const { record } = ((window as unknown) as IWindow).rrweb; + const { record } = (window as unknown as IWindow).rrweb; record({ - emit: ((window as unknown) as IWindow).emit, + emit: (window as unknown as IWindow).emit, }); setTimeout(() => { @@ -591,11 +592,11 @@ describe('record', function (this: ISuite) { }); await waitForRAF(ctx.page); await ctx.page.evaluate(() => { - const { record } = ((window as unknown) as IWindow).rrweb; + const { record } = (window as unknown as IWindow).rrweb; record({ inlineStylesheet: true, - emit: ((window as unknown) as IWindow).emit, + emit: (window as unknown as IWindow).emit, }); }); await waitForRAF(ctx.page); @@ -604,11 +605,11 @@ describe('record', function (this: ISuite) { it('captures stylesheets that are still loading', async () => { await ctx.page.evaluate(() => { - const { record } = ((window as unknown) as IWindow).rrweb; + const { record } = (window as unknown as IWindow).rrweb; record({ inlineStylesheet: true, - emit: ((window as unknown) as IWindow).emit, + emit: (window as unknown as IWindow).emit, }); const link1 = document.createElement('link'); @@ -640,11 +641,11 @@ describe('record', function (this: ISuite) { document.body.appendChild(iframe); const iframeDoc = iframe.contentDocument!; - const { record } = ((window as unknown) as IWindow).rrweb; + const { record } = (window as unknown as IWindow).rrweb; record({ inlineStylesheet: true, - emit: ((window as unknown) as IWindow).emit, + emit: (window as unknown as IWindow).emit, }); const linkEl = document.createElement('link'); @@ -674,11 +675,11 @@ describe('record', function (this: ISuite) { // do not `await` the following function, otherwise `waitForResponse` _might_ not be called void ctx.page.evaluate((corsStylesheetURL) => { - const { record } = ((window as unknown) as IWindow).rrweb; + const { record } = (window as unknown as IWindow).rrweb; record({ inlineStylesheet: true, - emit: ((window as unknown) as IWindow).emit, + emit: (window as unknown as IWindow).emit, }); const link1 = document.createElement('link'); @@ -723,8 +724,9 @@ describe('record', function (this: ISuite) { // Add stylesheet to an IFrame document. const iframe = document.querySelector('iframe'); - const sheet3 = new (iframe!.contentWindow! as IWindow & - typeof globalThis).CSSStyleSheet(); + const sheet3 = new ( + iframe!.contentWindow! as IWindow & typeof globalThis + ).CSSStyleSheet(); sheet3.replaceSync!('h1 { color: blue; }'); iframe!.contentDocument!.adoptedStyleSheets = [sheet3]; @@ -733,8 +735,8 @@ describe('record', function (this: ISuite) { ele.innerText = 'h1 in iframe'; iframe!.contentDocument!.body.appendChild(ele); - ((window as unknown) as IWindow).rrweb.record({ - emit: ((window.top as unknown) as IWindow).emit, + (window as unknown as IWindow).rrweb.record({ + emit: (window.top as unknown as IWindow).emit, }); // Make incremental changes to shadow dom. @@ -749,8 +751,9 @@ describe('record', function (this: ISuite) { document.adoptedStyleSheets = [sheet4, sheet, sheet2]; - const sheet5 = new (iframe!.contentWindow! as IWindow & - typeof globalThis).CSSStyleSheet(); + const sheet5 = new ( + iframe!.contentWindow! as IWindow & typeof globalThis + ).CSSStyleSheet(); sheet5.replaceSync!('h2 { color: purple; }'); iframe!.contentDocument!.adoptedStyleSheets = [sheet5, sheet3]; }, 10); @@ -778,9 +781,9 @@ describe('record iframes', function (this: ISuite) { it('captures iframe content in correct order', async () => { await ctx.page.evaluate(() => { - const { record } = ((window as unknown) as IWindow).rrweb; + const { record } = (window as unknown as IWindow).rrweb; record({ - emit: ((window as unknown) as IWindow).emit, + emit: (window as unknown as IWindow).emit, }); }); await waitForRAF(ctx.page); @@ -802,10 +805,10 @@ describe('record iframes', function (this: ISuite) { it('captures stylesheet mutations in iframes', async () => { await ctx.page.evaluate(() => { - const { record } = ((window as unknown) as IWindow).rrweb; + const { record } = (window as unknown as IWindow).rrweb; record({ // need to reference window.top for when we are in an iframe! - emit: ((window.top as unknown) as IWindow).emit, + emit: (window.top as unknown as IWindow).emit, }); const iframe = document.querySelector('iframe'); diff --git a/packages/rrweb/test/record/webgl.test.ts b/packages/rrweb/test/record/webgl.test.ts index 4c17b5cf..26bf5c42 100644 --- a/packages/rrweb/test/record/webgl.test.ts +++ b/packages/rrweb/test/record/webgl.test.ts @@ -64,13 +64,13 @@ const setup = function ( ctx.page.on('console', (msg) => console.log('PAGE LOG:', msg.text())); await ctx.page.evaluate((canvasSample) => { - const { record } = ((window as unknown) as IWindow).rrweb; + const { record } = (window as unknown as IWindow).rrweb; record({ recordCanvas: true, sampling: { canvas: canvasSample, }, - emit: ((window as unknown) as IWindow).emit, + emit: (window as unknown as IWindow).emit, }); }, canvasSample); }); diff --git a/packages/rrweb/test/replay/webgl-mutation.test.ts b/packages/rrweb/test/replay/webgl-mutation.test.ts index 4f4ed752..42e780f8 100644 --- a/packages/rrweb/test/replay/webgl-mutation.test.ts +++ b/packages/rrweb/test/replay/webgl-mutation.test.ts @@ -22,9 +22,9 @@ describe('webglMutation', () => { const createShaderMock = jest.fn().mockImplementation(() => { return new WebGLShader(); }); - const context = ({ + const context = { createShader: createShaderMock, - } as unknown) as WebGLRenderingContext; + } as unknown as WebGLRenderingContext; jest.spyOn(canvas, 'getContext').mockImplementation(() => { return context; }); diff --git a/packages/rrweb/test/replayer.test.ts b/packages/rrweb/test/replayer.test.ts index 7bc09ae2..5f550119 100644 --- a/packages/rrweb/test/replayer.test.ts +++ b/packages/rrweb/test/replayer.test.ts @@ -592,7 +592,9 @@ describe('replayer', function () { expect( await iframeTwoDocument!.evaluate( (iframe) => (iframe as HTMLIFrameElement)!.contentDocument!.doctype, - (await iframeTwoDocument!.$$('iframe'))[1], + ( + await iframeTwoDocument!.$$('iframe') + )[1], ), ).not.toBeNull(); }); diff --git a/packages/rrweb/test/utils.ts b/packages/rrweb/test/utils.ts index ab68e741..598807b6 100644 --- a/packages/rrweb/test/utils.ts +++ b/packages/rrweb/test/utils.ts @@ -119,7 +119,8 @@ function stringifySnapshots(snapshots: eventWithTime[]): string { s.data.href = 'about:blank'; } // FIXME: travis coordinates seems different with my laptop - const coordinatesReg = /(bottom|top|left|right|width|height): \d+(\.\d+)?px/g; + const coordinatesReg = + /(bottom|top|left|right|width|height): \d+(\.\d+)?px/g; if ( s.type === EventType.IncrementalSnapshot && s.data.source === IncrementalSource.MouseInteraction @@ -178,10 +179,8 @@ function stringifySnapshots(snapshots: eventWithTime[]): string { add.node.attributes.rr_dataURL && typeof add.node.attributes.rr_dataURL === 'string' ) { - add.node.attributes.rr_dataURL = add.node.attributes.rr_dataURL.replace( - /,.+$/, - ',...', - ); + add.node.attributes.rr_dataURL = + add.node.attributes.rr_dataURL.replace(/,.+$/, ',...'); } } }); @@ -271,7 +270,7 @@ export function stripBase64(events: eventWithTime[]) { const base64Strings: string[] = []; function walk(obj: T): T { if (!obj || typeof obj !== 'object') return obj; - if (Array.isArray(obj)) return (obj.map((e) => walk(e)) as unknown) as T; + if (Array.isArray(obj)) return obj.map((e) => walk(e)) as unknown as T; const newObj: Partial = {}; for (const prop in obj) { const value = obj[prop]; diff --git a/turbo.json b/turbo.json index 3908cac7..80baecaa 100644 --- a/turbo.json +++ b/turbo.json @@ -2,6 +2,10 @@ "$schema": "https://turborepo.org/schema.json", "baseBranch": "origin/master", "pipeline": { + "typings": { + "dependsOn": ["^typings"], + "outputs": ["typings/**"] + }, "prepublish": { "dependsOn": ["^prepublish"], "outputs": ["lib/**", "es/**", "dist/**", "typings/**"] @@ -9,7 +13,10 @@ "test": {}, "test:watch": {}, "dev": {}, - "lint": {}, + "lint": { + "dependsOn": ["typings"], + "cache": false + }, "check-types": {} } }