diff --git a/.gitignore b/.gitignore index 9724a7cf..8b30d6c1 100644 --- a/.gitignore +++ b/.gitignore @@ -1,6 +1,7 @@ .vscode node_modules package-lock.json +yarn.lock build dist es diff --git a/src/replay/index.ts b/src/replay/index.ts index 2554845c..6752cfb1 100644 --- a/src/replay/index.ts +++ b/src/replay/index.ts @@ -22,7 +22,7 @@ import { Emitter, } from '../types'; import { mirror } from '../utils'; -import getInjectStyleRules from './styles/inject-style'; +import getInjectStyleRules from './styles/inject-style'; import './styles/style.css'; const SKIP_TIME_THRESHOLD = 10 * 1000; @@ -72,6 +72,7 @@ export class Replayer { showDebug: false, blockClass: 'rr-block', liveMode: false, + insertStyleRules: [], }; this.config = Object.assign({}, defaultConfig, config); @@ -286,9 +287,9 @@ export class Replayer { const styleEl = document.createElement('style'); const { documentElement, head } = this.iframe.contentDocument!; documentElement!.insertBefore(styleEl, head); - const injectStyleRules = getInjectStyleRules(this.config.blockClass); - for (let idx = 0; idx < injectStyleRules.length; idx++) { - (styleEl.sheet! as CSSStyleSheet).insertRule(injectStyleRules[idx], idx); + const injectStylesRules = getInjectStyleRules(this.config.blockClass).concat(this.config.insertStyleRules); + for (let idx = 0; idx < injectStylesRules.length; idx++) { + (styleEl.sheet! as CSSStyleSheet).insertRule(injectStylesRules[idx], idx); } this.emitter.emit(ReplayerEvents.FullsnapshotRebuilded); this.waitForStylesheetLoad(); diff --git a/src/types.ts b/src/types.ts index b69d9e45..ff1c1e89 100644 --- a/src/types.ts +++ b/src/types.ts @@ -244,6 +244,7 @@ export type playerConfig = { showDebug: boolean; blockClass: string; liveMode: boolean; + insertStyleRules: string[]; }; export type playerMetaData = { diff --git a/typings/types.d.ts b/typings/types.d.ts index c38ced3a..e653d694 100644 --- a/typings/types.d.ts +++ b/typings/types.d.ts @@ -195,6 +195,7 @@ export declare type playerConfig = { showDebug: boolean; blockClass: string; liveMode: boolean; + insertStyleRules: string[]; }; export declare type playerMetaData = { totalTime: number;