diff --git a/guide.md b/guide.md index 8a44b28959..8932ba7a56 100644 --- a/guide.md +++ b/guide.md @@ -135,28 +135,29 @@ setInterval(save, 10 * 1000); The parameter of `rrweb.record` accepts the following options. -| key | default | description | -| ---------------- | ------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -| emit | required | the callback function to get emitted events | -| checkoutEveryNth | - | take a full snapshot after every N events
refer to the [checkout](#checkout) chapter | -| checkoutEveryNms | - | take a full snapshot after every N ms
refer to the [checkout](#checkout) chapter | -| blockClass | 'rr-block' | Use a string or RegExp to configure which elements should be blocked, refer to the [privacy](#privacy) chapter | -| blockSelector | null | Use a string to configure which selector should be blocked, refer to the [privacy](#privacy) chapter | -| ignoreClass | 'rr-ignore' | Use a string or RegExp to configure which elements should be ignored, refer to the [privacy](#privacy) chapter | -| maskTextClass | 'rr-mask' | Use a string or RegExp to configure which elements should be masked, refer to the [privacy](#privacy) chapter | -| maskTextSelector | null | Use a string to configure which selector should be masked, refer to the [privacy](#privacy) chapter | -| maskAllInputs | false | mask all input content as \* | -| maskInputOptions | { password: true } | mask some kinds of input \*
refer to the [list](https://github.com/rrweb-io/rrweb-snapshot/blob/0bb95f1ee77fef03166a68f75b959ad997171442/src/types.ts#L77-L95) | -| maskInputFn | - | customize mask input content recording logic | -| maskTextFn | - | customize mask text content recording logic | -| slimDOMOptions | {} | remove unnecessary parts of the DOM
refer to the [list](https://github.com/rrweb-io/rrweb-snapshot/blob/6728d12b3cddd96951c86d948578f99ada5749ff/src/types.ts#L91) | -| inlineStylesheet | true | whether to inline the stylesheet in the events | -| hooks | {} | hooks for events
refer to the [list](https://github.com/rrweb-io/rrweb/blob/9488deb6d54a5f04350c063d942da5e96ab74075/src/types.ts#L207) | -| packFn | - | refer to the [storage optimization recipe](./docs/recipes/optimize-storage.md) | -| sampling | - | refer to the [storage optimization recipe](./docs/recipes/optimize-storage.md) | -| recordCanvas | false | whether to record the canvas element | -| collectFonts | false | whether to collect fonts in the website | -| recordLog | false | whether to record console output, refer to the [console recipe](./docs/recipes/console.md) | +| key | default | description | +| -------------------- | ------------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| emit | required | the callback function to get emitted events | +| checkoutEveryNth | - | take a full snapshot after every N events
refer to the [checkout](#checkout) chapter | +| checkoutEveryNms | - | take a full snapshot after every N ms
refer to the [checkout](#checkout) chapter | +| blockClass | 'rr-block' | Use a string or RegExp to configure which elements should be blocked, refer to the [privacy](#privacy) chapter | +| blockSelector | null | Use a string to configure which selector should be blocked, refer to the [privacy](#privacy) chapter | +| ignoreClass | 'rr-ignore' | Use a string or RegExp to configure which elements should be ignored, refer to the [privacy](#privacy) chapter | +| maskTextClass | 'rr-mask' | Use a string or RegExp to configure which elements should be masked, refer to the [privacy](#privacy) chapter | +| maskTextSelector | null | Use a string to configure which selector should be masked, refer to the [privacy](#privacy) chapter | +| maskAllInputs | false | mask all input content as \* | +| maskInputOptions | { password: true } | mask some kinds of input \*
refer to the [list](https://github.com/rrweb-io/rrweb-snapshot/blob/0bb95f1ee77fef03166a68f75b959ad997171442/src/types.ts#L77-L95) | +| maskInputFn | - | customize mask input content recording logic | +| maskTextFn | - | customize mask text content recording logic | +| slimDOMOptions | {} | remove unnecessary parts of the DOM
refer to the [list](https://github.com/rrweb-io/rrweb-snapshot/blob/6728d12b3cddd96951c86d948578f99ada5749ff/src/types.ts#L91) | +| inlineStylesheet | true | whether to inline the stylesheet in the events | +| hooks | {} | hooks for events
refer to the [list](https://github.com/rrweb-io/rrweb/blob/9488deb6d54a5f04350c063d942da5e96ab74075/src/types.ts#L207) | +| packFn | - | refer to the [storage optimization recipe](./docs/recipes/optimize-storage.md) | +| sampling | - | refer to the [storage optimization recipe](./docs/recipes/optimize-storage.md) | +| recordCanvas | false | whether to record the canvas element | +| collectFonts | false | whether to collect fonts in the website | +| recordLog | false | whether to record console output, refer to the [console recipe](./docs/recipes/console.md) | +| userTriggeredOnInput | false | whether to add `userTriggered` on input events that indicates if this event was triggered directly by the user or not. [What is `userTriggered`?](https://github.com/rrweb-io/rrweb/pull/495) | #### Privacy diff --git a/guide.zh_CN.md b/guide.zh_CN.md index 87661f8b52..86f02b93a8 100644 --- a/guide.zh_CN.md +++ b/guide.zh_CN.md @@ -131,28 +131,29 @@ setInterval(save, 10 * 1000); `rrweb.record(config)` 的 config 部分接受以下参数 -| key | 默认值 | 功能 | -| ---------------- | ------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -| emit | 必填 | 获取当前录制的数据 | -| checkoutEveryNth | - | 每 N 次事件重新制作一次全量快照
详见[“重新制作快照”](#重新制作快照)章节 | -| checkoutEveryNms | - | 每 N 毫秒重新制作一次全量快照
详见[“重新制作快照”](#重新制作快照)章节 | -| blockClass | 'rr-block' | 字符串或正则表达式，可用于自定义屏蔽元素的类名，详见[“隐私”](#隐私)章节 | -| blockSelector | null | 所有 element.matches(blockSelector)为 true 的元素都不会被录制，回放时取而代之的是一个同等宽高的占位元素 | -| ignoreClass | 'rr-ignore' | 字符串或正则表达式，可用于自定义忽略元素的类名，详见[“隐私”](#隐私)章节 | -| maskTextClass | 'rr-mask' | 字符串或正则表达式，可用于自定义忽略元素 text 内容的类名，详见[“隐私”](#隐私)章节 | -| maskTextSelector | null | 所有 element.matches(maskTextSelector)为 true 的元素及其子元素的 text 内容将会被屏蔽 | -| maskAllInputs | false | 将所有输入内容记录为 \* | -| maskInputOptions | { password: true } | 选择将特定类型的输入框内容记录为 \*
类型详见[列表](https://github.com/rrweb-io/rrweb-snapshot/blob/0bb95f1ee77fef03166a68f75b959ad997171442/src/types.ts#L77-L95) | -| maskInputFn | - | 自定义特定类型的输入框内容记录逻辑 | -| maskTextFn | - | 自定义文字内容的记录逻辑 | -| slimDOMOptions | {} | 去除 DOM 中不必要的部分
类型详见[列表](https://github.com/rrweb-io/rrweb-snapshot/blob/6728d12b3cddd96951c86d948578f99ada5749ff/src/types.ts#L91) | -| inlineStylesheet | true | 是否将样式表内联 | -| hooks | {} | 各类事件的回调
类型详见[列表](https://github.com/rrweb-io/rrweb/blob/9488deb6d54a5f04350c063d942da5e96ab74075/src/types.ts#L207) | -| packFn | - | 数据压缩函数，详见[优化存储策略](./docs/recipes/optimize-storage.zh_CN.md) | -| sampling | - | 数据抽样策略，详见[优化存储策略](./docs/recipes/optimize-storage.zh_CN.md) | -| recordCanvas | false | 是否记录 canvas 内容 | -| collectFonts | false | 是否记录页面中的字体文件 | -| recordLog | false | 是否记录 console 输出，详见[console 录制和播放](./docs/recipes/console.zh_CN.md) | +| key | 默认值 | 功能 | +| -------------------- | ------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| emit | 必填 | 获取当前录制的数据 | +| checkoutEveryNth | - | 每 N 次事件重新制作一次全量快照
详见[“重新制作快照”](#重新制作快照)章节 | +| checkoutEveryNms | - | 每 N 毫秒重新制作一次全量快照
详见[“重新制作快照”](#重新制作快照)章节 | +| blockClass | 'rr-block' | 字符串或正则表达式，可用于自定义屏蔽元素的类名，详见[“隐私”](#隐私)章节 | +| blockSelector | null | 所有 element.matches(blockSelector)为 true 的元素都不会被录制，回放时取而代之的是一个同等宽高的占位元素 | +| ignoreClass | 'rr-ignore' | 字符串或正则表达式，可用于自定义忽略元素的类名，详见[“隐私”](#隐私)章节 | +| maskTextClass | 'rr-mask' | 字符串或正则表达式，可用于自定义忽略元素 text 内容的类名，详见[“隐私”](#隐私)章节 | +| maskTextSelector | null | 所有 element.matches(maskTextSelector)为 true 的元素及其子元素的 text 内容将会被屏蔽 | +| maskAllInputs | false | 将所有输入内容记录为 \* | +| maskInputOptions | { password: true } | 选择将特定类型的输入框内容记录为 \*
类型详见[列表](https://github.com/rrweb-io/rrweb-snapshot/blob/0bb95f1ee77fef03166a68f75b959ad997171442/src/types.ts#L77-L95) | +| maskInputFn | - | 自定义特定类型的输入框内容记录逻辑 | +| maskTextFn | - | 自定义文字内容的记录逻辑 | +| slimDOMOptions | {} | 去除 DOM 中不必要的部分
类型详见[列表](https://github.com/rrweb-io/rrweb-snapshot/blob/6728d12b3cddd96951c86d948578f99ada5749ff/src/types.ts#L91) | +| inlineStylesheet | true | 是否将样式表内联 | +| hooks | {} | 各类事件的回调
类型详见[列表](https://github.com/rrweb-io/rrweb/blob/9488deb6d54a5f04350c063d942da5e96ab74075/src/types.ts#L207) | +| packFn | - | 数据压缩函数，详见[优化存储策略](./docs/recipes/optimize-storage.zh_CN.md) | +| sampling | - | 数据抽样策略，详见[优化存储策略](./docs/recipes/optimize-storage.zh_CN.md) | +| recordCanvas | false | 是否记录 canvas 内容 | +| collectFonts | false | 是否记录页面中的字体文件 | +| recordLog | false | 是否记录 console 输出，详见[console 录制和播放](./docs/recipes/console.zh_CN.md) | +| userTriggeredOnInput | false | [什么是 `userTriggered`](https://github.com/rrweb-io/rrweb/pull/495) | #### 隐私 diff --git a/src/record/index.ts b/src/record/index.ts index df225ea39d..d99097c383 100644 --- a/src/record/index.ts +++ b/src/record/index.ts @@ -57,6 +57,7 @@ function record( sampling = {}, mousemoveWait, recordCanvas = false, + userTriggeredOnInput = false, collectFonts = false, plugins, keepIframeSrcFn = () => false, @@ -379,6 +380,7 @@ function record( inlineStylesheet, sampling, recordCanvas, + userTriggeredOnInput, collectFonts, doc, maskInputFn, diff --git a/src/record/observer.ts b/src/record/observer.ts index 7abcb77957..2c96c8f768 100644 --- a/src/record/observer.ts +++ b/src/record/observer.ts @@ -337,6 +337,15 @@ function initViewportResizeObserver( return on('resize', updateDimension, window); } +function wrapEventWithUserTriggeredFlag( + v: inputValue, + enable: boolean, +): inputValue { + const value = { ...v }; + if (!enable) delete value.userTriggered; + return value; +} + export const INPUT_TAGS = ['INPUT', 'TEXTAREA', 'SELECT']; const lastInputValueMap: WeakMap = new WeakMap(); function initInputObserver( @@ -348,9 +357,11 @@ function initInputObserver( maskInputOptions: MaskInputOptions, maskInputFn: MaskInputFn | undefined, sampling: SamplingStrategy, + userTriggeredOnInput: boolean, ): listenerHandler { function eventHandler(event: Event) { const target = getEventTarget(event); + const userTriggered = event.isTrusted; if ( !target || !(target as Element).tagName || @@ -381,7 +392,13 @@ function initInputObserver( maskInputFn, }); } - cbWithDedup(target, { text, isChecked }); + cbWithDedup( + target, + wrapEventWithUserTriggeredFlag( + { text, isChecked, userTriggered }, + userTriggeredOnInput, + ), + ); // if a radio was checked // the other radios with the same name attribute will be unchecked. const name: string | undefined = (target as HTMLInputElement).name; @@ -390,10 +407,17 @@ function initInputObserver( .querySelectorAll(`input[type="radio"][name="${name}"]`) .forEach((el) => { if (el !== target) { - cbWithDedup(el, { - text: (el as HTMLInputElement).value, - isChecked: !isChecked, - }); + cbWithDedup( + el, + wrapEventWithUserTriggeredFlag( + { + text: (el as HTMLInputElement).value, + isChecked: !isChecked, + userTriggered: false, + }, + userTriggeredOnInput, + ), + ); } }); } @@ -763,6 +787,7 @@ export function initObservers( o.maskInputOptions, o.maskInputFn, o.sampling, + o.userTriggeredOnInput, ); const mediaInteractionHandler = initMediaInteractionObserver( o.mediaInteractionCb, diff --git a/src/replay/index.ts b/src/replay/index.ts index b411acf612..67531c6136 100644 --- a/src/replay/index.ts +++ b/src/replay/index.ts @@ -115,6 +115,7 @@ export class Replayer { triggerFocus: true, UNSAFE_replayCanvas: false, pauseAnimation: true, + userTriggeredOnInput: true, mouseTail: defaultMouseTailConfig, }; this.config = Object.assign({}, defaultConfig, config); @@ -501,10 +502,7 @@ export class Replayer { // events are kept sorted by timestamp, check if this is the last event let last_index = this.service.state.context.events.length - 1; - if ( - event === - this.service.state.context.events[last_index] - ) { + if (event === this.service.state.context.events[last_index]) { const finish = () => { if (last_index < this.service.state.context.events.length - 1) { // more events have been added since the setTimeout diff --git a/src/types.ts b/src/types.ts index 10ee8b313e..d90ea4f845 100644 --- a/src/types.ts +++ b/src/types.ts @@ -218,6 +218,7 @@ export type recordOptions = { packFn?: PackFn; sampling?: SamplingStrategy; recordCanvas?: boolean; + userTriggeredOnInput?: boolean; collectFonts?: boolean; plugins?: RecordPlugin[]; // departed, please use sampling options @@ -247,6 +248,7 @@ export type observerParam = { fontCb: fontCallback; sampling: SamplingStrategy; recordCanvas: boolean; + userTriggeredOnInput: boolean; collectFonts: boolean; slimDOMOptions: SlimDOMOptions; doc: Document; @@ -419,6 +421,12 @@ export type viewportResizeCallback = (d: viewportResizeDimension) => void; export type inputValue = { text: string; isChecked: boolean; + + // `userTriggered` indicates if this event was triggered directly by user (userTriggered: true) + // or was triggered indirectly (userTriggered: false) + // Example of `userTriggered` in action: + // User clicks on radio element (userTriggered: true) which triggers the other radio element to change (userTriggered: false) + userTriggered?: boolean; }; export type inputCallback = (v: inputValue & { id: number }) => void; @@ -484,6 +492,7 @@ export type playerConfig = { triggerFocus: boolean; UNSAFE_replayCanvas: boolean; pauseAnimation?: boolean; + userTriggeredOnInput: boolean; mouseTail: | boolean | { diff --git a/test/__snapshots__/integration.test.ts.snap b/test/__snapshots__/integration.test.ts.snap index ea136c2a1a..35294f80f4 100644 --- a/test/__snapshots__/integration.test.ts.snap +++ b/test/__snapshots__/integration.test.ts.snap @@ -917,7 +917,7 @@ exports[`form 1`] = ` \\"childNodes\\": [ { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 5 }, { @@ -931,7 +931,7 @@ exports[`form 1`] = ` }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 7 }, { @@ -946,7 +946,7 @@ exports[`form 1`] = ` }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 9 }, { @@ -961,7 +961,7 @@ exports[`form 1`] = ` }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 11 }, { @@ -979,7 +979,7 @@ exports[`form 1`] = ` }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n\\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 14 } ], @@ -987,7 +987,7 @@ exports[`form 1`] = ` }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n\\\\n\\", + \\"textContent\\": \\"\\\\n\\\\n \\", \\"id\\": 15 }, { @@ -997,7 +997,7 @@ exports[`form 1`] = ` \\"childNodes\\": [ { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 17 }, { @@ -1007,7 +1007,7 @@ exports[`form 1`] = ` \\"childNodes\\": [ { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 19 }, { @@ -1019,7 +1019,7 @@ exports[`form 1`] = ` \\"childNodes\\": [ { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 21 }, { @@ -1033,7 +1033,7 @@ exports[`form 1`] = ` }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 23 } ], @@ -1041,33 +1041,33 @@ exports[`form 1`] = ` }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 24 }, { \\"type\\": 2, \\"tagName\\": \\"label\\", - \\"attributes\\": { - \\"for\\": \\"radio\\" - }, + \\"attributes\\": {}, \\"childNodes\\": [ { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 26 }, { \\"type\\": 2, \\"tagName\\": \\"input\\", \\"attributes\\": { - \\"type\\": \\"radio\\" + \\"type\\": \\"radio\\", + \\"name\\": \\"toggle\\", + \\"value\\": \\"on\\" }, \\"childNodes\\": [], \\"id\\": 27 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 28 } ], @@ -1075,33 +1075,34 @@ exports[`form 1`] = ` }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 29 }, { \\"type\\": 2, \\"tagName\\": \\"label\\", - \\"attributes\\": { - \\"for\\": \\"checkbox\\" - }, + \\"attributes\\": {}, \\"childNodes\\": [ { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 31 }, { \\"type\\": 2, \\"tagName\\": \\"input\\", \\"attributes\\": { - \\"type\\": \\"checkbox\\" + \\"type\\": \\"radio\\", + \\"name\\": \\"toggle\\", + \\"value\\": \\"off\\", + \\"checked\\": true }, \\"childNodes\\": [], \\"id\\": 32 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 33 } ], @@ -1109,21 +1110,55 @@ exports[`form 1`] = ` }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 34 }, { \\"type\\": 2, \\"tagName\\": \\"label\\", \\"attributes\\": { - \\"for\\": \\"textarea\\" + \\"for\\": \\"checkbox\\" }, \\"childNodes\\": [ { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 36 }, + { + \\"type\\": 2, + \\"tagName\\": \\"input\\", + \\"attributes\\": { + \\"type\\": \\"checkbox\\" + }, + \\"childNodes\\": [], + \\"id\\": 37 + }, + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 38 + } + ], + \\"id\\": 35 + }, + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 39 + }, + { + \\"type\\": 2, + \\"tagName\\": \\"label\\", + \\"attributes\\": { + \\"for\\": \\"textarea\\" + }, + \\"childNodes\\": [ + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 41 + }, { \\"type\\": 2, \\"tagName\\": \\"textarea\\", @@ -1134,20 +1169,20 @@ exports[`form 1`] = ` \\"rows\\": \\"10\\" }, \\"childNodes\\": [], - \\"id\\": 37 + \\"id\\": 42 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", - \\"id\\": 38 + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 43 } ], - \\"id\\": 35 + \\"id\\": 40 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", - \\"id\\": 39 + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 44 }, { \\"type\\": 2, @@ -1158,8 +1193,8 @@ exports[`form 1`] = ` \\"childNodes\\": [ { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", - \\"id\\": 41 + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 46 }, { \\"type\\": 2, @@ -1172,8 +1207,8 @@ exports[`form 1`] = ` \\"childNodes\\": [ { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", - \\"id\\": 43 + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 48 }, { \\"type\\": 2, @@ -1186,15 +1221,15 @@ exports[`form 1`] = ` { \\"type\\": 3, \\"textContent\\": \\"1\\", - \\"id\\": 45 + \\"id\\": 50 } ], - \\"id\\": 44 + \\"id\\": 49 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", - \\"id\\": 46 + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 51 }, { \\"type\\": 2, @@ -1206,31 +1241,31 @@ exports[`form 1`] = ` { \\"type\\": 3, \\"textContent\\": \\"2\\", - \\"id\\": 48 + \\"id\\": 53 } ], - \\"id\\": 47 + \\"id\\": 52 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", - \\"id\\": 49 + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 54 } ], - \\"id\\": 42 + \\"id\\": 47 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", - \\"id\\": 50 + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 55 } ], - \\"id\\": 40 + \\"id\\": 45 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", - \\"id\\": 51 + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 56 }, { \\"type\\": 2, @@ -1241,8 +1276,8 @@ exports[`form 1`] = ` \\"childNodes\\": [ { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", - \\"id\\": 53 + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 58 }, { \\"type\\": 2, @@ -1251,28 +1286,28 @@ exports[`form 1`] = ` \\"type\\": \\"password\\" }, \\"childNodes\\": [], - \\"id\\": 54 + \\"id\\": 59 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", - \\"id\\": 55 + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 60 } ], - \\"id\\": 52 + \\"id\\": 57 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", - \\"id\\": 56 + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 61 } ], \\"id\\": 18 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n\\\\n \\", - \\"id\\": 57 + \\"textContent\\": \\"\\\\n \\\\n \\", + \\"id\\": 62 }, { \\"type\\": 2, @@ -1282,15 +1317,15 @@ exports[`form 1`] = ` { \\"type\\": 3, \\"textContent\\": \\"SCRIPT_PLACEHOLDER\\", - \\"id\\": 59 + \\"id\\": 64 } ], - \\"id\\": 58 + \\"id\\": 63 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\\\n \\\\n\\\\n\\\\n\\", - \\"id\\": 60 + \\"textContent\\": \\"\\\\n \\\\n \\\\n\\\\n\\", + \\"id\\": 65 } ], \\"id\\": 16 @@ -1400,12 +1435,21 @@ exports[`form 1`] = ` \\"id\\": 27 } }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 5, + \\"text\\": \\"off\\", + \\"isChecked\\": false, + \\"id\\": 32 + } + }, { \\"type\\": 3, \\"data\\": { \\"source\\": 2, \\"type\\": 1, - \\"id\\": 32 + \\"id\\": 37 } }, { @@ -1421,7 +1465,7 @@ exports[`form 1`] = ` \\"data\\": { \\"source\\": 2, \\"type\\": 5, - \\"id\\": 32 + \\"id\\": 37 } }, { @@ -1429,7 +1473,7 @@ exports[`form 1`] = ` \\"data\\": { \\"source\\": 2, \\"type\\": 0, - \\"id\\": 32 + \\"id\\": 37 } }, { @@ -1437,7 +1481,7 @@ exports[`form 1`] = ` \\"data\\": { \\"source\\": 2, \\"type\\": 2, - \\"id\\": 32 + \\"id\\": 37 } }, { @@ -1446,7 +1490,7 @@ exports[`form 1`] = ` \\"source\\": 5, \\"text\\": \\"on\\", \\"isChecked\\": true, - \\"id\\": 32 + \\"id\\": 37 } }, { @@ -1454,7 +1498,7 @@ exports[`form 1`] = ` \\"data\\": { \\"source\\": 2, \\"type\\": 6, - \\"id\\": 32 + \\"id\\": 37 } }, { @@ -1462,7 +1506,7 @@ exports[`form 1`] = ` \\"data\\": { \\"source\\": 2, \\"type\\": 5, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -1471,7 +1515,7 @@ exports[`form 1`] = ` \\"source\\": 5, \\"text\\": \\"t\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -1480,7 +1524,7 @@ exports[`form 1`] = ` \\"source\\": 5, \\"text\\": \\"te\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -1489,7 +1533,7 @@ exports[`form 1`] = ` \\"source\\": 5, \\"text\\": \\"tex\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -1498,7 +1542,7 @@ exports[`form 1`] = ` \\"source\\": 5, \\"text\\": \\"text\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -1507,7 +1551,7 @@ exports[`form 1`] = ` \\"source\\": 5, \\"text\\": \\"texta\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -1516,7 +1560,7 @@ exports[`form 1`] = ` \\"source\\": 5, \\"text\\": \\"textar\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -1525,7 +1569,7 @@ exports[`form 1`] = ` \\"source\\": 5, \\"text\\": \\"textare\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -1534,7 +1578,7 @@ exports[`form 1`] = ` \\"source\\": 5, \\"text\\": \\"textarea\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -1543,7 +1587,7 @@ exports[`form 1`] = ` \\"source\\": 5, \\"text\\": \\"textarea \\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -1552,7 +1596,7 @@ exports[`form 1`] = ` \\"source\\": 5, \\"text\\": \\"textarea t\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -1561,7 +1605,7 @@ exports[`form 1`] = ` \\"source\\": 5, \\"text\\": \\"textarea te\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -1570,7 +1614,7 @@ exports[`form 1`] = ` \\"source\\": 5, \\"text\\": \\"textarea tes\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -1579,7 +1623,7 @@ exports[`form 1`] = ` \\"source\\": 5, \\"text\\": \\"textarea test\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -1588,7 +1632,7 @@ exports[`form 1`] = ` \\"source\\": 5, \\"text\\": \\"1\\", \\"isChecked\\": false, - \\"id\\": 42 + \\"id\\": 47 } } ]" @@ -3146,7 +3190,7 @@ exports[`mask 1`] = ` \\"childNodes\\": [ { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 5 }, { @@ -3160,7 +3204,7 @@ exports[`mask 1`] = ` }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 7 }, { @@ -3175,7 +3219,7 @@ exports[`mask 1`] = ` }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 9 }, { @@ -3190,7 +3234,7 @@ exports[`mask 1`] = ` }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 11 }, { @@ -3208,7 +3252,7 @@ exports[`mask 1`] = ` }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n\\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 14 } ], @@ -3216,7 +3260,7 @@ exports[`mask 1`] = ` }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n\\\\n\\", + \\"textContent\\": \\"\\\\n\\\\n \\", \\"id\\": 15 }, { @@ -3226,7 +3270,7 @@ exports[`mask 1`] = ` \\"childNodes\\": [ { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 17 }, { @@ -3236,7 +3280,7 @@ exports[`mask 1`] = ` \\"childNodes\\": [ { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 19 }, { @@ -3248,7 +3292,7 @@ exports[`mask 1`] = ` \\"childNodes\\": [ { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 21 }, { @@ -3262,7 +3306,7 @@ exports[`mask 1`] = ` }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 23 } ], @@ -3270,33 +3314,33 @@ exports[`mask 1`] = ` }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 24 }, { \\"type\\": 2, \\"tagName\\": \\"label\\", - \\"attributes\\": { - \\"for\\": \\"radio\\" - }, + \\"attributes\\": {}, \\"childNodes\\": [ { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 26 }, { \\"type\\": 2, \\"tagName\\": \\"input\\", \\"attributes\\": { - \\"type\\": \\"radio\\" + \\"type\\": \\"radio\\", + \\"name\\": \\"toggle\\", + \\"value\\": \\"on\\" }, \\"childNodes\\": [], \\"id\\": 27 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 28 } ], @@ -3304,33 +3348,34 @@ exports[`mask 1`] = ` }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 29 }, { \\"type\\": 2, \\"tagName\\": \\"label\\", - \\"attributes\\": { - \\"for\\": \\"checkbox\\" - }, + \\"attributes\\": {}, \\"childNodes\\": [ { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 31 }, { \\"type\\": 2, \\"tagName\\": \\"input\\", \\"attributes\\": { - \\"type\\": \\"checkbox\\" + \\"type\\": \\"radio\\", + \\"name\\": \\"toggle\\", + \\"value\\": \\"off\\", + \\"checked\\": true }, \\"childNodes\\": [], \\"id\\": 32 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 33 } ], @@ -3338,36 +3383,33 @@ exports[`mask 1`] = ` }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 34 }, { \\"type\\": 2, \\"tagName\\": \\"label\\", \\"attributes\\": { - \\"for\\": \\"textarea\\" + \\"for\\": \\"checkbox\\" }, \\"childNodes\\": [ { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 36 }, { \\"type\\": 2, - \\"tagName\\": \\"textarea\\", + \\"tagName\\": \\"input\\", \\"attributes\\": { - \\"name\\": \\"\\", - \\"id\\": \\"\\", - \\"cols\\": \\"30\\", - \\"rows\\": \\"10\\" + \\"type\\": \\"checkbox\\" }, \\"childNodes\\": [], \\"id\\": 37 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 38 } ], @@ -3375,55 +3417,92 @@ exports[`mask 1`] = ` }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 39 }, { \\"type\\": 2, \\"tagName\\": \\"label\\", \\"attributes\\": { - \\"for\\": \\"select\\" + \\"for\\": \\"textarea\\" }, \\"childNodes\\": [ { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 41 }, { \\"type\\": 2, - \\"tagName\\": \\"select\\", + \\"tagName\\": \\"textarea\\", \\"attributes\\": { \\"name\\": \\"\\", \\"id\\": \\"\\", - \\"value\\": \\"*\\" + \\"cols\\": \\"30\\", + \\"rows\\": \\"10\\" }, - \\"childNodes\\": [ - { - \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", - \\"id\\": 43 - }, - { - \\"type\\": 2, - \\"tagName\\": \\"option\\", - \\"attributes\\": { - \\"value\\": \\"1\\", - \\"selected\\": true - }, - \\"childNodes\\": [ - { - \\"type\\": 3, - \\"textContent\\": \\"1\\", - \\"id\\": 45 - } - ], - \\"id\\": 44 - }, - { - \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", - \\"id\\": 46 + \\"childNodes\\": [], + \\"id\\": 42 + }, + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 43 + } + ], + \\"id\\": 40 + }, + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 44 + }, + { + \\"type\\": 2, + \\"tagName\\": \\"label\\", + \\"attributes\\": { + \\"for\\": \\"select\\" + }, + \\"childNodes\\": [ + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 46 + }, + { + \\"type\\": 2, + \\"tagName\\": \\"select\\", + \\"attributes\\": { + \\"name\\": \\"\\", + \\"id\\": \\"\\", + \\"value\\": \\"*\\" + }, + \\"childNodes\\": [ + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 48 + }, + { + \\"type\\": 2, + \\"tagName\\": \\"option\\", + \\"attributes\\": { + \\"value\\": \\"1\\", + \\"selected\\": true + }, + \\"childNodes\\": [ + { + \\"type\\": 3, + \\"textContent\\": \\"1\\", + \\"id\\": 50 + } + ], + \\"id\\": 49 + }, + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 51 }, { \\"type\\": 2, @@ -3435,31 +3514,31 @@ exports[`mask 1`] = ` { \\"type\\": 3, \\"textContent\\": \\"2\\", - \\"id\\": 48 + \\"id\\": 53 } ], - \\"id\\": 47 + \\"id\\": 52 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", - \\"id\\": 49 + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 54 } ], - \\"id\\": 42 + \\"id\\": 47 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", - \\"id\\": 50 + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 55 } ], - \\"id\\": 40 + \\"id\\": 45 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", - \\"id\\": 51 + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 56 }, { \\"type\\": 2, @@ -3470,8 +3549,8 @@ exports[`mask 1`] = ` \\"childNodes\\": [ { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", - \\"id\\": 53 + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 58 }, { \\"type\\": 2, @@ -3480,28 +3559,28 @@ exports[`mask 1`] = ` \\"type\\": \\"password\\" }, \\"childNodes\\": [], - \\"id\\": 54 + \\"id\\": 59 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", - \\"id\\": 55 + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 60 } ], - \\"id\\": 52 + \\"id\\": 57 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", - \\"id\\": 56 + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 61 } ], \\"id\\": 18 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n\\\\n \\", - \\"id\\": 57 + \\"textContent\\": \\"\\\\n \\\\n \\", + \\"id\\": 62 }, { \\"type\\": 2, @@ -3511,15 +3590,15 @@ exports[`mask 1`] = ` { \\"type\\": 3, \\"textContent\\": \\"SCRIPT_PLACEHOLDER\\", - \\"id\\": 59 + \\"id\\": 64 } ], - \\"id\\": 58 + \\"id\\": 63 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\\\n \\\\n\\\\n\\\\n\\", - \\"id\\": 60 + \\"textContent\\": \\"\\\\n \\\\n \\\\n\\\\n\\", + \\"id\\": 65 } ], \\"id\\": 16 @@ -3629,12 +3708,21 @@ exports[`mask 1`] = ` \\"id\\": 27 } }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 5, + \\"text\\": \\"off\\", + \\"isChecked\\": false, + \\"id\\": 32 + } + }, { \\"type\\": 3, \\"data\\": { \\"source\\": 2, \\"type\\": 1, - \\"id\\": 32 + \\"id\\": 37 } }, { @@ -3650,7 +3738,7 @@ exports[`mask 1`] = ` \\"data\\": { \\"source\\": 2, \\"type\\": 5, - \\"id\\": 32 + \\"id\\": 37 } }, { @@ -3658,7 +3746,7 @@ exports[`mask 1`] = ` \\"data\\": { \\"source\\": 2, \\"type\\": 0, - \\"id\\": 32 + \\"id\\": 37 } }, { @@ -3666,7 +3754,7 @@ exports[`mask 1`] = ` \\"data\\": { \\"source\\": 2, \\"type\\": 2, - \\"id\\": 32 + \\"id\\": 37 } }, { @@ -3675,7 +3763,7 @@ exports[`mask 1`] = ` \\"source\\": 5, \\"text\\": \\"on\\", \\"isChecked\\": true, - \\"id\\": 32 + \\"id\\": 37 } }, { @@ -3683,7 +3771,7 @@ exports[`mask 1`] = ` \\"data\\": { \\"source\\": 2, \\"type\\": 6, - \\"id\\": 32 + \\"id\\": 37 } }, { @@ -3691,7 +3779,7 @@ exports[`mask 1`] = ` \\"data\\": { \\"source\\": 2, \\"type\\": 5, - \\"id\\": 54 + \\"id\\": 59 } }, { @@ -3700,7 +3788,7 @@ exports[`mask 1`] = ` \\"source\\": 5, \\"text\\": \\"*\\", \\"isChecked\\": false, - \\"id\\": 54 + \\"id\\": 59 } }, { @@ -3709,7 +3797,7 @@ exports[`mask 1`] = ` \\"source\\": 5, \\"text\\": \\"**\\", \\"isChecked\\": false, - \\"id\\": 54 + \\"id\\": 59 } }, { @@ -3718,7 +3806,7 @@ exports[`mask 1`] = ` \\"source\\": 5, \\"text\\": \\"***\\", \\"isChecked\\": false, - \\"id\\": 54 + \\"id\\": 59 } }, { @@ -3727,7 +3815,7 @@ exports[`mask 1`] = ` \\"source\\": 5, \\"text\\": \\"****\\", \\"isChecked\\": false, - \\"id\\": 54 + \\"id\\": 59 } }, { @@ -3736,7 +3824,7 @@ exports[`mask 1`] = ` \\"source\\": 5, \\"text\\": \\"*****\\", \\"isChecked\\": false, - \\"id\\": 54 + \\"id\\": 59 } }, { @@ -3745,7 +3833,7 @@ exports[`mask 1`] = ` \\"source\\": 5, \\"text\\": \\"******\\", \\"isChecked\\": false, - \\"id\\": 54 + \\"id\\": 59 } }, { @@ -3754,7 +3842,7 @@ exports[`mask 1`] = ` \\"source\\": 5, \\"text\\": \\"*******\\", \\"isChecked\\": false, - \\"id\\": 54 + \\"id\\": 59 } }, { @@ -3763,7 +3851,7 @@ exports[`mask 1`] = ` \\"source\\": 5, \\"text\\": \\"********\\", \\"isChecked\\": false, - \\"id\\": 54 + \\"id\\": 59 } }, { @@ -3771,7 +3859,7 @@ exports[`mask 1`] = ` \\"data\\": { \\"source\\": 2, \\"type\\": 6, - \\"id\\": 54 + \\"id\\": 59 } }, { @@ -3779,7 +3867,7 @@ exports[`mask 1`] = ` \\"data\\": { \\"source\\": 2, \\"type\\": 5, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -3788,7 +3876,7 @@ exports[`mask 1`] = ` \\"source\\": 5, \\"text\\": \\"*\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -3797,7 +3885,7 @@ exports[`mask 1`] = ` \\"source\\": 5, \\"text\\": \\"**\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -3806,7 +3894,7 @@ exports[`mask 1`] = ` \\"source\\": 5, \\"text\\": \\"***\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -3815,7 +3903,7 @@ exports[`mask 1`] = ` \\"source\\": 5, \\"text\\": \\"****\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -3824,7 +3912,7 @@ exports[`mask 1`] = ` \\"source\\": 5, \\"text\\": \\"*****\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -3833,7 +3921,7 @@ exports[`mask 1`] = ` \\"source\\": 5, \\"text\\": \\"******\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -3842,7 +3930,7 @@ exports[`mask 1`] = ` \\"source\\": 5, \\"text\\": \\"*******\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -3851,7 +3939,7 @@ exports[`mask 1`] = ` \\"source\\": 5, \\"text\\": \\"********\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -3860,7 +3948,7 @@ exports[`mask 1`] = ` \\"source\\": 5, \\"text\\": \\"*********\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -3869,7 +3957,7 @@ exports[`mask 1`] = ` \\"source\\": 5, \\"text\\": \\"**********\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -3878,7 +3966,7 @@ exports[`mask 1`] = ` \\"source\\": 5, \\"text\\": \\"***********\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -3887,7 +3975,7 @@ exports[`mask 1`] = ` \\"source\\": 5, \\"text\\": \\"************\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -3896,7 +3984,7 @@ exports[`mask 1`] = ` \\"source\\": 5, \\"text\\": \\"*************\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -3905,7 +3993,7 @@ exports[`mask 1`] = ` \\"source\\": 5, \\"text\\": \\"*\\", \\"isChecked\\": false, - \\"id\\": 42 + \\"id\\": 47 } } ]" @@ -4696,7 +4784,7 @@ exports[`maskInputOptions 1`] = ` \\"childNodes\\": [ { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 5 }, { @@ -4710,7 +4798,7 @@ exports[`maskInputOptions 1`] = ` }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 7 }, { @@ -4725,7 +4813,7 @@ exports[`maskInputOptions 1`] = ` }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 9 }, { @@ -4740,7 +4828,7 @@ exports[`maskInputOptions 1`] = ` }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 11 }, { @@ -4758,7 +4846,7 @@ exports[`maskInputOptions 1`] = ` }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n\\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 14 } ], @@ -4766,7 +4854,7 @@ exports[`maskInputOptions 1`] = ` }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n\\\\n\\", + \\"textContent\\": \\"\\\\n\\\\n \\", \\"id\\": 15 }, { @@ -4776,7 +4864,7 @@ exports[`maskInputOptions 1`] = ` \\"childNodes\\": [ { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 17 }, { @@ -4786,7 +4874,7 @@ exports[`maskInputOptions 1`] = ` \\"childNodes\\": [ { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 19 }, { @@ -4798,7 +4886,7 @@ exports[`maskInputOptions 1`] = ` \\"childNodes\\": [ { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 21 }, { @@ -4812,7 +4900,7 @@ exports[`maskInputOptions 1`] = ` }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 23 } ], @@ -4820,33 +4908,33 @@ exports[`maskInputOptions 1`] = ` }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 24 }, { \\"type\\": 2, \\"tagName\\": \\"label\\", - \\"attributes\\": { - \\"for\\": \\"radio\\" - }, + \\"attributes\\": {}, \\"childNodes\\": [ { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 26 }, { \\"type\\": 2, \\"tagName\\": \\"input\\", \\"attributes\\": { - \\"type\\": \\"radio\\" + \\"type\\": \\"radio\\", + \\"name\\": \\"toggle\\", + \\"value\\": \\"on\\" }, \\"childNodes\\": [], \\"id\\": 27 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 28 } ], @@ -4854,33 +4942,34 @@ exports[`maskInputOptions 1`] = ` }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 29 }, { \\"type\\": 2, \\"tagName\\": \\"label\\", - \\"attributes\\": { - \\"for\\": \\"checkbox\\" - }, + \\"attributes\\": {}, \\"childNodes\\": [ { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 31 }, { \\"type\\": 2, \\"tagName\\": \\"input\\", \\"attributes\\": { - \\"type\\": \\"checkbox\\" + \\"type\\": \\"radio\\", + \\"name\\": \\"toggle\\", + \\"value\\": \\"off\\", + \\"checked\\": true }, \\"childNodes\\": [], \\"id\\": 32 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 33 } ], @@ -4888,21 +4977,55 @@ exports[`maskInputOptions 1`] = ` }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 34 }, { \\"type\\": 2, \\"tagName\\": \\"label\\", \\"attributes\\": { - \\"for\\": \\"textarea\\" + \\"for\\": \\"checkbox\\" }, \\"childNodes\\": [ { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", + \\"textContent\\": \\"\\\\n \\", \\"id\\": 36 }, + { + \\"type\\": 2, + \\"tagName\\": \\"input\\", + \\"attributes\\": { + \\"type\\": \\"checkbox\\" + }, + \\"childNodes\\": [], + \\"id\\": 37 + }, + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 38 + } + ], + \\"id\\": 35 + }, + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 39 + }, + { + \\"type\\": 2, + \\"tagName\\": \\"label\\", + \\"attributes\\": { + \\"for\\": \\"textarea\\" + }, + \\"childNodes\\": [ + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 41 + }, { \\"type\\": 2, \\"tagName\\": \\"textarea\\", @@ -4913,20 +5036,20 @@ exports[`maskInputOptions 1`] = ` \\"rows\\": \\"10\\" }, \\"childNodes\\": [], - \\"id\\": 37 + \\"id\\": 42 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", - \\"id\\": 38 + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 43 } ], - \\"id\\": 35 + \\"id\\": 40 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", - \\"id\\": 39 + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 44 }, { \\"type\\": 2, @@ -4937,8 +5060,8 @@ exports[`maskInputOptions 1`] = ` \\"childNodes\\": [ { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", - \\"id\\": 41 + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 46 }, { \\"type\\": 2, @@ -4951,8 +5074,8 @@ exports[`maskInputOptions 1`] = ` \\"childNodes\\": [ { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", - \\"id\\": 43 + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 48 }, { \\"type\\": 2, @@ -4965,15 +5088,15 @@ exports[`maskInputOptions 1`] = ` { \\"type\\": 3, \\"textContent\\": \\"1\\", - \\"id\\": 45 + \\"id\\": 50 } ], - \\"id\\": 44 + \\"id\\": 49 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", - \\"id\\": 46 + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 51 }, { \\"type\\": 2, @@ -4985,31 +5108,31 @@ exports[`maskInputOptions 1`] = ` { \\"type\\": 3, \\"textContent\\": \\"2\\", - \\"id\\": 48 + \\"id\\": 53 } ], - \\"id\\": 47 + \\"id\\": 52 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", - \\"id\\": 49 + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 54 } ], - \\"id\\": 42 + \\"id\\": 47 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", - \\"id\\": 50 + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 55 } ], - \\"id\\": 40 + \\"id\\": 45 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", - \\"id\\": 51 + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 56 }, { \\"type\\": 2, @@ -5020,8 +5143,8 @@ exports[`maskInputOptions 1`] = ` \\"childNodes\\": [ { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", - \\"id\\": 53 + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 58 }, { \\"type\\": 2, @@ -5030,28 +5153,28 @@ exports[`maskInputOptions 1`] = ` \\"type\\": \\"password\\" }, \\"childNodes\\": [], - \\"id\\": 54 + \\"id\\": 59 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", - \\"id\\": 55 + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 60 } ], - \\"id\\": 52 + \\"id\\": 57 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\", - \\"id\\": 56 + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 61 } ], \\"id\\": 18 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n\\\\n \\", - \\"id\\": 57 + \\"textContent\\": \\"\\\\n \\\\n \\", + \\"id\\": 62 }, { \\"type\\": 2, @@ -5061,15 +5184,15 @@ exports[`maskInputOptions 1`] = ` { \\"type\\": 3, \\"textContent\\": \\"SCRIPT_PLACEHOLDER\\", - \\"id\\": 59 + \\"id\\": 64 } ], - \\"id\\": 58 + \\"id\\": 63 }, { \\"type\\": 3, - \\"textContent\\": \\"\\\\n \\\\n \\\\n\\\\n\\\\n\\", - \\"id\\": 60 + \\"textContent\\": \\"\\\\n \\\\n \\\\n\\\\n\\", + \\"id\\": 65 } ], \\"id\\": 16 @@ -5179,12 +5302,21 @@ exports[`maskInputOptions 1`] = ` \\"id\\": 27 } }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 5, + \\"text\\": \\"off\\", + \\"isChecked\\": false, + \\"id\\": 32 + } + }, { \\"type\\": 3, \\"data\\": { \\"source\\": 2, \\"type\\": 1, - \\"id\\": 32 + \\"id\\": 37 } }, { @@ -5200,7 +5332,7 @@ exports[`maskInputOptions 1`] = ` \\"data\\": { \\"source\\": 2, \\"type\\": 5, - \\"id\\": 32 + \\"id\\": 37 } }, { @@ -5208,7 +5340,7 @@ exports[`maskInputOptions 1`] = ` \\"data\\": { \\"source\\": 2, \\"type\\": 0, - \\"id\\": 32 + \\"id\\": 37 } }, { @@ -5216,7 +5348,7 @@ exports[`maskInputOptions 1`] = ` \\"data\\": { \\"source\\": 2, \\"type\\": 2, - \\"id\\": 32 + \\"id\\": 37 } }, { @@ -5225,7 +5357,7 @@ exports[`maskInputOptions 1`] = ` \\"source\\": 5, \\"text\\": \\"on\\", \\"isChecked\\": true, - \\"id\\": 32 + \\"id\\": 37 } }, { @@ -5233,7 +5365,7 @@ exports[`maskInputOptions 1`] = ` \\"data\\": { \\"source\\": 2, \\"type\\": 6, - \\"id\\": 32 + \\"id\\": 37 } }, { @@ -5241,7 +5373,7 @@ exports[`maskInputOptions 1`] = ` \\"data\\": { \\"source\\": 2, \\"type\\": 5, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -5250,7 +5382,7 @@ exports[`maskInputOptions 1`] = ` \\"source\\": 5, \\"text\\": \\"t\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -5259,7 +5391,7 @@ exports[`maskInputOptions 1`] = ` \\"source\\": 5, \\"text\\": \\"te\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -5268,7 +5400,7 @@ exports[`maskInputOptions 1`] = ` \\"source\\": 5, \\"text\\": \\"tex\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -5277,7 +5409,7 @@ exports[`maskInputOptions 1`] = ` \\"source\\": 5, \\"text\\": \\"text\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -5286,7 +5418,7 @@ exports[`maskInputOptions 1`] = ` \\"source\\": 5, \\"text\\": \\"texta\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -5295,7 +5427,7 @@ exports[`maskInputOptions 1`] = ` \\"source\\": 5, \\"text\\": \\"textar\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -5304,7 +5436,7 @@ exports[`maskInputOptions 1`] = ` \\"source\\": 5, \\"text\\": \\"textare\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -5313,7 +5445,7 @@ exports[`maskInputOptions 1`] = ` \\"source\\": 5, \\"text\\": \\"textarea\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -5322,7 +5454,7 @@ exports[`maskInputOptions 1`] = ` \\"source\\": 5, \\"text\\": \\"textarea \\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -5331,7 +5463,7 @@ exports[`maskInputOptions 1`] = ` \\"source\\": 5, \\"text\\": \\"textarea t\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -5340,7 +5472,7 @@ exports[`maskInputOptions 1`] = ` \\"source\\": 5, \\"text\\": \\"textarea te\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -5349,7 +5481,7 @@ exports[`maskInputOptions 1`] = ` \\"source\\": 5, \\"text\\": \\"textarea tes\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -5358,7 +5490,7 @@ exports[`maskInputOptions 1`] = ` \\"source\\": 5, \\"text\\": \\"textarea test\\", \\"isChecked\\": false, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -5366,7 +5498,7 @@ exports[`maskInputOptions 1`] = ` \\"data\\": { \\"source\\": 2, \\"type\\": 6, - \\"id\\": 37 + \\"id\\": 42 } }, { @@ -5374,7 +5506,7 @@ exports[`maskInputOptions 1`] = ` \\"data\\": { \\"source\\": 2, \\"type\\": 5, - \\"id\\": 54 + \\"id\\": 59 } }, { @@ -5383,7 +5515,7 @@ exports[`maskInputOptions 1`] = ` \\"source\\": 5, \\"text\\": \\"*\\", \\"isChecked\\": false, - \\"id\\": 54 + \\"id\\": 59 } }, { @@ -5392,7 +5524,7 @@ exports[`maskInputOptions 1`] = ` \\"source\\": 5, \\"text\\": \\"**\\", \\"isChecked\\": false, - \\"id\\": 54 + \\"id\\": 59 } }, { @@ -5401,7 +5533,7 @@ exports[`maskInputOptions 1`] = ` \\"source\\": 5, \\"text\\": \\"***\\", \\"isChecked\\": false, - \\"id\\": 54 + \\"id\\": 59 } }, { @@ -5410,7 +5542,7 @@ exports[`maskInputOptions 1`] = ` \\"source\\": 5, \\"text\\": \\"****\\", \\"isChecked\\": false, - \\"id\\": 54 + \\"id\\": 59 } }, { @@ -5419,7 +5551,7 @@ exports[`maskInputOptions 1`] = ` \\"source\\": 5, \\"text\\": \\"*****\\", \\"isChecked\\": false, - \\"id\\": 54 + \\"id\\": 59 } }, { @@ -5428,7 +5560,7 @@ exports[`maskInputOptions 1`] = ` \\"source\\": 5, \\"text\\": \\"******\\", \\"isChecked\\": false, - \\"id\\": 54 + \\"id\\": 59 } }, { @@ -5437,7 +5569,7 @@ exports[`maskInputOptions 1`] = ` \\"source\\": 5, \\"text\\": \\"*******\\", \\"isChecked\\": false, - \\"id\\": 54 + \\"id\\": 59 } }, { @@ -5446,7 +5578,7 @@ exports[`maskInputOptions 1`] = ` \\"source\\": 5, \\"text\\": \\"********\\", \\"isChecked\\": false, - \\"id\\": 54 + \\"id\\": 59 } }, { @@ -5455,7 +5587,7 @@ exports[`maskInputOptions 1`] = ` \\"source\\": 5, \\"text\\": \\"1\\", \\"isChecked\\": false, - \\"id\\": 42 + \\"id\\": 47 } } ]" @@ -8301,3 +8433,886 @@ exports[`shadow-dom 1`] = ` } ]" `; + +exports[`userTriggered 1`] = ` +"[ + { + \\"type\\": 0, + \\"data\\": {} + }, + { + \\"type\\": 1, + \\"data\\": {} + }, + { + \\"type\\": 4, + \\"data\\": { + \\"href\\": \\"about:blank\\", + \\"width\\": 1920, + \\"height\\": 1080 + } + }, + { + \\"type\\": 2, + \\"data\\": { + \\"node\\": { + \\"type\\": 0, + \\"childNodes\\": [ + { + \\"type\\": 1, + \\"name\\": \\"html\\", + \\"publicId\\": \\"\\", + \\"systemId\\": \\"\\", + \\"id\\": 2 + }, + { + \\"type\\": 2, + \\"tagName\\": \\"html\\", + \\"attributes\\": { + \\"lang\\": \\"en\\" + }, + \\"childNodes\\": [ + { + \\"type\\": 2, + \\"tagName\\": \\"head\\", + \\"attributes\\": {}, + \\"childNodes\\": [ + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 5 + }, + { + \\"type\\": 2, + \\"tagName\\": \\"meta\\", + \\"attributes\\": { + \\"charset\\": \\"UTF-8\\" + }, + \\"childNodes\\": [], + \\"id\\": 6 + }, + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 7 + }, + { + \\"type\\": 2, + \\"tagName\\": \\"meta\\", + \\"attributes\\": { + \\"name\\": \\"viewport\\", + \\"content\\": \\"width=device-width, initial-scale=1.0\\" + }, + \\"childNodes\\": [], + \\"id\\": 8 + }, + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 9 + }, + { + \\"type\\": 2, + \\"tagName\\": \\"meta\\", + \\"attributes\\": { + \\"http-equiv\\": \\"X-UA-Compatible\\", + \\"content\\": \\"ie=edge\\" + }, + \\"childNodes\\": [], + \\"id\\": 10 + }, + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 11 + }, + { + \\"type\\": 2, + \\"tagName\\": \\"title\\", + \\"attributes\\": {}, + \\"childNodes\\": [ + { + \\"type\\": 3, + \\"textContent\\": \\"form fields\\", + \\"id\\": 13 + } + ], + \\"id\\": 12 + }, + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 14 + } + ], + \\"id\\": 4 + }, + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n\\\\n \\", + \\"id\\": 15 + }, + { + \\"type\\": 2, + \\"tagName\\": \\"body\\", + \\"attributes\\": {}, + \\"childNodes\\": [ + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 17 + }, + { + \\"type\\": 2, + \\"tagName\\": \\"form\\", + \\"attributes\\": {}, + \\"childNodes\\": [ + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 19 + }, + { + \\"type\\": 2, + \\"tagName\\": \\"label\\", + \\"attributes\\": { + \\"for\\": \\"text\\" + }, + \\"childNodes\\": [ + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 21 + }, + { + \\"type\\": 2, + \\"tagName\\": \\"input\\", + \\"attributes\\": { + \\"type\\": \\"text\\" + }, + \\"childNodes\\": [], + \\"id\\": 22 + }, + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 23 + } + ], + \\"id\\": 20 + }, + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 24 + }, + { + \\"type\\": 2, + \\"tagName\\": \\"label\\", + \\"attributes\\": {}, + \\"childNodes\\": [ + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 26 + }, + { + \\"type\\": 2, + \\"tagName\\": \\"input\\", + \\"attributes\\": { + \\"type\\": \\"radio\\", + \\"name\\": \\"toggle\\", + \\"value\\": \\"on\\" + }, + \\"childNodes\\": [], + \\"id\\": 27 + }, + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 28 + } + ], + \\"id\\": 25 + }, + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 29 + }, + { + \\"type\\": 2, + \\"tagName\\": \\"label\\", + \\"attributes\\": {}, + \\"childNodes\\": [ + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 31 + }, + { + \\"type\\": 2, + \\"tagName\\": \\"input\\", + \\"attributes\\": { + \\"type\\": \\"radio\\", + \\"name\\": \\"toggle\\", + \\"value\\": \\"off\\", + \\"checked\\": true + }, + \\"childNodes\\": [], + \\"id\\": 32 + }, + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 33 + } + ], + \\"id\\": 30 + }, + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 34 + }, + { + \\"type\\": 2, + \\"tagName\\": \\"label\\", + \\"attributes\\": { + \\"for\\": \\"checkbox\\" + }, + \\"childNodes\\": [ + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 36 + }, + { + \\"type\\": 2, + \\"tagName\\": \\"input\\", + \\"attributes\\": { + \\"type\\": \\"checkbox\\" + }, + \\"childNodes\\": [], + \\"id\\": 37 + }, + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 38 + } + ], + \\"id\\": 35 + }, + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 39 + }, + { + \\"type\\": 2, + \\"tagName\\": \\"label\\", + \\"attributes\\": { + \\"for\\": \\"textarea\\" + }, + \\"childNodes\\": [ + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 41 + }, + { + \\"type\\": 2, + \\"tagName\\": \\"textarea\\", + \\"attributes\\": { + \\"name\\": \\"\\", + \\"id\\": \\"\\", + \\"cols\\": \\"30\\", + \\"rows\\": \\"10\\" + }, + \\"childNodes\\": [], + \\"id\\": 42 + }, + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 43 + } + ], + \\"id\\": 40 + }, + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 44 + }, + { + \\"type\\": 2, + \\"tagName\\": \\"label\\", + \\"attributes\\": { + \\"for\\": \\"select\\" + }, + \\"childNodes\\": [ + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 46 + }, + { + \\"type\\": 2, + \\"tagName\\": \\"select\\", + \\"attributes\\": { + \\"name\\": \\"\\", + \\"id\\": \\"\\", + \\"value\\": \\"1\\" + }, + \\"childNodes\\": [ + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 48 + }, + { + \\"type\\": 2, + \\"tagName\\": \\"option\\", + \\"attributes\\": { + \\"value\\": \\"1\\", + \\"selected\\": true + }, + \\"childNodes\\": [ + { + \\"type\\": 3, + \\"textContent\\": \\"1\\", + \\"id\\": 50 + } + ], + \\"id\\": 49 + }, + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 51 + }, + { + \\"type\\": 2, + \\"tagName\\": \\"option\\", + \\"attributes\\": { + \\"value\\": \\"2\\" + }, + \\"childNodes\\": [ + { + \\"type\\": 3, + \\"textContent\\": \\"2\\", + \\"id\\": 53 + } + ], + \\"id\\": 52 + }, + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 54 + } + ], + \\"id\\": 47 + }, + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 55 + } + ], + \\"id\\": 45 + }, + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 56 + }, + { + \\"type\\": 2, + \\"tagName\\": \\"label\\", + \\"attributes\\": { + \\"for\\": \\"password\\" + }, + \\"childNodes\\": [ + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 58 + }, + { + \\"type\\": 2, + \\"tagName\\": \\"input\\", + \\"attributes\\": { + \\"type\\": \\"password\\" + }, + \\"childNodes\\": [], + \\"id\\": 59 + }, + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 60 + } + ], + \\"id\\": 57 + }, + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\", + \\"id\\": 61 + } + ], + \\"id\\": 18 + }, + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\\\n \\", + \\"id\\": 62 + }, + { + \\"type\\": 2, + \\"tagName\\": \\"script\\", + \\"attributes\\": {}, + \\"childNodes\\": [ + { + \\"type\\": 3, + \\"textContent\\": \\"SCRIPT_PLACEHOLDER\\", + \\"id\\": 64 + } + ], + \\"id\\": 63 + }, + { + \\"type\\": 3, + \\"textContent\\": \\"\\\\n \\\\n \\\\n\\\\n\\", + \\"id\\": 65 + } + ], + \\"id\\": 16 + } + ], + \\"id\\": 3 + } + ], + \\"id\\": 1 + }, + \\"initialOffset\\": { + \\"left\\": 0, + \\"top\\": 0 + } + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 2, + \\"type\\": 5, + \\"id\\": 22 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 5, + \\"text\\": \\"t\\", + \\"isChecked\\": false, + \\"userTriggered\\": true, + \\"id\\": 22 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 5, + \\"text\\": \\"te\\", + \\"isChecked\\": false, + \\"userTriggered\\": true, + \\"id\\": 22 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 5, + \\"text\\": \\"tes\\", + \\"isChecked\\": false, + \\"userTriggered\\": true, + \\"id\\": 22 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 5, + \\"text\\": \\"test\\", + \\"isChecked\\": false, + \\"userTriggered\\": true, + \\"id\\": 22 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 2, + \\"type\\": 1, + \\"id\\": 27 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 2, + \\"type\\": 6, + \\"id\\": 22 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 2, + \\"type\\": 5, + \\"id\\": 27 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 2, + \\"type\\": 0, + \\"id\\": 27 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 2, + \\"type\\": 2, + \\"id\\": 27 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 5, + \\"text\\": \\"on\\", + \\"isChecked\\": true, + \\"userTriggered\\": true, + \\"id\\": 27 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 5, + \\"text\\": \\"off\\", + \\"isChecked\\": false, + \\"userTriggered\\": false, + \\"id\\": 32 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 2, + \\"type\\": 1, + \\"id\\": 37 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 2, + \\"type\\": 6, + \\"id\\": 27 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 2, + \\"type\\": 5, + \\"id\\": 37 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 2, + \\"type\\": 0, + \\"id\\": 37 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 2, + \\"type\\": 2, + \\"id\\": 37 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 5, + \\"text\\": \\"on\\", + \\"isChecked\\": true, + \\"userTriggered\\": true, + \\"id\\": 37 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 2, + \\"type\\": 6, + \\"id\\": 37 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 2, + \\"type\\": 5, + \\"id\\": 59 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 5, + \\"text\\": \\"*\\", + \\"isChecked\\": false, + \\"userTriggered\\": true, + \\"id\\": 59 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 5, + \\"text\\": \\"**\\", + \\"isChecked\\": false, + \\"userTriggered\\": true, + \\"id\\": 59 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 5, + \\"text\\": \\"***\\", + \\"isChecked\\": false, + \\"userTriggered\\": true, + \\"id\\": 59 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 5, + \\"text\\": \\"****\\", + \\"isChecked\\": false, + \\"userTriggered\\": true, + \\"id\\": 59 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 5, + \\"text\\": \\"*****\\", + \\"isChecked\\": false, + \\"userTriggered\\": true, + \\"id\\": 59 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 5, + \\"text\\": \\"******\\", + \\"isChecked\\": false, + \\"userTriggered\\": true, + \\"id\\": 59 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 5, + \\"text\\": \\"*******\\", + \\"isChecked\\": false, + \\"userTriggered\\": true, + \\"id\\": 59 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 5, + \\"text\\": \\"********\\", + \\"isChecked\\": false, + \\"userTriggered\\": true, + \\"id\\": 59 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 2, + \\"type\\": 6, + \\"id\\": 59 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 2, + \\"type\\": 5, + \\"id\\": 42 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 5, + \\"text\\": \\"t\\", + \\"isChecked\\": false, + \\"userTriggered\\": true, + \\"id\\": 42 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 5, + \\"text\\": \\"te\\", + \\"isChecked\\": false, + \\"userTriggered\\": true, + \\"id\\": 42 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 5, + \\"text\\": \\"tex\\", + \\"isChecked\\": false, + \\"userTriggered\\": true, + \\"id\\": 42 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 5, + \\"text\\": \\"text\\", + \\"isChecked\\": false, + \\"userTriggered\\": true, + \\"id\\": 42 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 5, + \\"text\\": \\"texta\\", + \\"isChecked\\": false, + \\"userTriggered\\": true, + \\"id\\": 42 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 5, + \\"text\\": \\"textar\\", + \\"isChecked\\": false, + \\"userTriggered\\": true, + \\"id\\": 42 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 5, + \\"text\\": \\"textare\\", + \\"isChecked\\": false, + \\"userTriggered\\": true, + \\"id\\": 42 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 5, + \\"text\\": \\"textarea\\", + \\"isChecked\\": false, + \\"userTriggered\\": true, + \\"id\\": 42 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 5, + \\"text\\": \\"textarea \\", + \\"isChecked\\": false, + \\"userTriggered\\": true, + \\"id\\": 42 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 5, + \\"text\\": \\"textarea t\\", + \\"isChecked\\": false, + \\"userTriggered\\": true, + \\"id\\": 42 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 5, + \\"text\\": \\"textarea te\\", + \\"isChecked\\": false, + \\"userTriggered\\": true, + \\"id\\": 42 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 5, + \\"text\\": \\"textarea tes\\", + \\"isChecked\\": false, + \\"userTriggered\\": true, + \\"id\\": 42 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 5, + \\"text\\": \\"textarea test\\", + \\"isChecked\\": false, + \\"userTriggered\\": true, + \\"id\\": 42 + } + }, + { + \\"type\\": 3, + \\"data\\": { + \\"source\\": 5, + \\"text\\": \\"1\\", + \\"isChecked\\": false, + \\"userTriggered\\": false, + \\"id\\": 47 + } + } +]" +`; diff --git a/test/html/form.html b/test/html/form.html index 9d4a0c7116..a89f11ff74 100644 --- a/test/html/form.html +++ b/test/html/form.html @@ -1,37 +1,38 @@ + + + + + form fields + - - - - - form fields - - - -
- - - - - - -
- - + +
+ + + + + + + +
+ diff --git a/test/integration.test.ts b/test/integration.test.ts index a851fcf565..9c0c52c867 100644 --- a/test/integration.test.ts +++ b/test/integration.test.ts @@ -75,6 +75,7 @@ describe('record integration tests', function (this: ISuite) { maskTextSelector: ${JSON.stringify(options.maskTextSelector)}, maskAllInputs: ${options.maskAllInputs}, maskInputOptions: ${JSON.stringify(options.maskAllInputs)}, + userTriggeredOnInput: ${options.userTriggeredOnInput}, maskTextFn: ${options.maskTextFn}, recordCanvas: ${options.recordCanvas}, plugins: ${options.plugins} @@ -284,6 +285,24 @@ describe('record integration tests', function (this: ISuite) { assertSnapshot(snapshots, __filename, 'maskPassword'); }); + it('should record input userTriggered values if userTriggeredOnInput is enabled', async () => { + const page: puppeteer.Page = await this.browser.newPage(); + await page.goto('about:blank'); + await page.setContent( + getHtml.call(this, 'form.html', { userTriggeredOnInput: true }), + ); + + await page.type('input[type="text"]', 'test'); + await page.click('input[type="radio"]'); + await page.click('input[type="checkbox"]'); + await page.type('input[type="password"]', 'password'); + await page.type('textarea', 'textarea test'); + await page.select('select', '1'); + + const snapshots = await page.evaluate('window.snapshots'); + assertSnapshot(snapshots, __filename, 'userTriggered'); + }); + it('should not record blocked elements and its child nodes', async () => { const page: puppeteer.Page = await this.browser.newPage(); await page.goto('about:blank');