rrweb
rrweb copied to clipboard
[Bug]: Error: Evaluation failed: Error: Replayer need at least 2 events.
Preflight Checklist
- [X] I have searched the issue tracker for a bug report that matches the one I want to file, without success.
What package is this bug report for?
rrweb
Expected Behavior
背景:我在puppeteer中使用了new rrweb.Replayer来回放之前记录的events
(我自己检查了 events是数组类型 并且也有值)
Actual Behavior
但一直报错:Error: Evaluation failed: Error: Replayer need at least 2 events.
Testcase Gist URL
No response
Additional Information
这里贴下代码: const isFinish = await this.page.evaluate(() => new Promise(resolve => { const replayer = new rrweb.Replayer(events, { mouseTail: false }); replayer.play() this.log("录制开始") replayer.on('finish', () => { this.log("录制结束") resolve(true) }) })) this.log("isFinish",isFinish) if(isFinish) { const wrapperEl = await this.page.$(".replayer-wrapper"); baseScreen = await wrapperEl.screenshot({ // fullpage: true, }); }
核心功能是想在回放结束,使用puppeteer做截图
Can you share the contents of your events
variable?
like this:[{"type":4,"data":{"href":"http://h5.ares.fws.qa.nt.ctripcorp.com/AIO/crnweb/rn_flight_postservice/20220513154935/rebookReset.html?CRNModuleName=flight_postservice&initialPage=fltRebook&CRNType=1&oid=18060335050&from=orderlist&isCucumber=1&isMockLink=1","width":414,"height":896},"timestamp":1654638102012},{"type":2,"data":{"node":{"type":0,"childNodes":[{"type":1,"name":"html","publicId":"","systemId":"","id":2},{"type":2,"tagName":"html","attributes":{},"childNodes":[{"type":2,"tagName":"head","attributes":{},"childNodes":[{"type":2,"tagName":"script","attributes":{},"childNodes":[{"type":3,"textContent":"SCRIPT_PLACEHOLDER","id":6}],"id":5},{"type":2,"tagName":"script","attributes":{"type":""},"childNodes":[{"type":3,"textContent":"SCRIPT_PLACEHOLDER","id":8}],"id":7},{"type":3,"textContent":" ","id":9},{"type":2,"tagName":"meta","attributes":{"charset":"UTF-8"},"childNodes":[],"id":10},{"type":3,"textContent":" ","id":11},{"type":2,"tagName":"title","attributes":{},"childNodes":[{"type":3,"textContent":"","id":13}],"id":12},{"type":3,"textContent":" ","id":14},{"type":2,"tagName":"meta","attributes":{"name":"viewport","content":"width=device-width,initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no,minimal-ui,viewport-fit=cover"},"childNodes":[],"id":15},{"type":3,"textContent":" ","id":16},{"type":2,"tagName":"meta","attributes":{"http-equiv":"X-UA-Compatible","content":"IE=edge,chrome=1"},"childNodes":[],"id":17},{"type":3,"textContent":" ","id":18},{"type":2,"tagName":"meta","attributes":{"name":"format-detection","content":"telephone=no"},"childNodes":[],"id":19},{"type":3,"textContent":" ","id":20},{"type":2,"tagName":"link","attributes":{"href":"https://www.trip.com/favicon.ico","mce_href":"https://www.trip.com/favicon.ico","rel":"shortcut icon","type":"image/x-icon"},"childNodes":[],"id":21},{"type":3,"textContent":" ","id":22},{"type":2,"tagName":"link","attributes":{"rel":"dns-prefetch","href":"http://webresource.c-ctrip.com/"},"childNodes":[],"id":23},{"type":3,"textContent":"\n\t\t","id":24},{"type":2,"tagName":"link","attributes":{"rel":"dns-prefetch","href":"http://pic.c-ctrip.com/"},"childNodes":[],"id":25},{"type":3,"textContent":"\n\t\t","id":26},{"type":2,"tagName":"link","attributes":{"rel":"dns-prefetch","href":"http://www.google-analytics.com/"},"childNodes":[],"id":27},{"type":3,"textContent":" ","id":28},{"type":5,"textContent":"{{cw_href_rewrite}}","id":29},{"type":3,"textContent":" ","id":30},{"type":2,"tagName":"script","attributes":{},"childNodes":[{"type":3,"textContent":"SCRIPT_PLACEHOLDER","id":32}],"id":31},{"type":3,"textContent":"\n ","id":33},{"type":2,"tagName":"script","attributes":{},"childNodes":[{"type":3,"textContent":"SCRIPT_PLACEHOLDER","id":35}],"id":34},{"type":3,"textContent":" ","id":36},{"type":5,"textContent":"{{ibuIconFont}}","id":37},{"type":3,"textContent":" ","id":38},{"type":2,"tagName":"style","attributes":{},"childNodes":[{"type":3,"textContent":"@font-face { font-family: ct_font_common; src: url(\"//pic.c-ctrip.com/platform/h5/common/ct_font_common/ct_font_common.ttf\") format(\"truetype\"); }","isStyle":true,"id":40}],"id":39},{"type":3,"textContent":" ","id":41},{"type":2,"tagName":"style","attributes":{},"childNodes":[{"type":3,"textContent":"@font-face { font-family: crn_font_orderservice; src: url(\"//h5resource.ares.fws.qa.nt.ctripcorp.com/AIO/crnweb/rn_flight_postservice/20220513154935/fonts/crn_font_orderservice.ttf?h=8eea3718\") format(\"truetype\"); }","isStyle":true,"id":43}],"id":42},{"type":3,"textContent":"\n","id":44},{"type":2,"tagName":"style","attributes":{},"childNodes":[{"type":3,"textContent":"@font-face { font-family: crn_font_IBU_postservice; src: url(\"//h5resource.ares.fws.qa.nt.ctripcorp.com/AIO/crnweb/rn_flight_postservice/20220513154935/fonts/crn_font_IBU_postservice.ttf?h=e8c34006\") format(\"truetype\"); }","isStyle":true,"id":46}],"id":45},{"type":3,"textContent":"\n","id":47},{"type":2,"tagName":"style","attributes":{},"childNodes":[{"type":3,"textContent":"@font-face { font-family: crn_font_postservice_policy; src: url(\"//h5resource.ares.fws.qa.nt.ctripcorp.com/AIO/crnweb/rn_flight_postservice/20220513154935/fonts/crn_font_postservice_policy.ttf?h=94bd5e95\") format(\"truetype\"); }","isStyle":true,"id":49}],"id":48},{"type":3,"textContent":" ","id":50},{"type":5,"textContent":"{{scriptl10n}}","id":51},{"type":3,"textContent":" ","id":52},{"type":5,"textContent":"{{scriptI18n}}","id":53},{"type":3,"textContent":" ","id":54},{"type":2,"tagName":"script","attributes":{"type":"text/javascript","crossorigin":"anonymous"},"childNodes":[{"type":3,"textContent":"SCRIPT_PLACEHOLDER","id":56}],"id":55},{"type":3,"textContent":" ","id":57},{"type":2,"tagName":"script","attributes":{"type":"text/javascript","crossorigin":"anonymous"},"childNodes":[{"type":3,"textContent":"SCRIPT_PLACEHOLDER","id":59}],"id":58},{"type":3,"textContent":" ","id":60},{"type":2,"tagName":"style","attributes":{},"childNodes":[{"type":3,"textContent":"html { font-size: 100px; overflow: hidden; height: 100%; font-family: -apple-system, \"Segoe UI\", Roboto, \"Open Sans\", \"Helvetica Neue\", sans-serif; }body { margin: 0px; height: 100%; line-height: 1.2; text-size-adjust: 100% !important; }.rn-view, .rn-flex { position: relative; flex: 0 0 auto; box-sizing: border-box; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; }.root-tag { width: 100%; position: relative; z-index: 1; display: flex; flex: 1 1 0%; height: 100%; }.rn-root { position: absolute; inset: 0px; box-sizing: border-box; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; }.rn-global-compontent { position: absolute; inset: 0px; box-sizing: border-box; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; }div, span, img { border-width: 0px; border-style: solid; font-size: 0.14rem; }span { box-sizing: border-box; }div, span, img { outline: none; -webkit-tap-highlight-color: transparent; }input:focus { outline: 0px; }input::-webkit-input-placeholder { color: rgb(212, 212, 212); font-weight: 300; }.rn-hidden { display: none; }.pointer-events-none { pointer-events: none; }.pointer-events-auto { pointer-events: auto; }.pointer-events-box-none { pointer-events: none; }.pointer-events-box-none * { pointer-events: auto; }.pointer-events-box-only { pointer-events: auto; }.pointer-events-box-only * { pointer-events: none; }.rn-text > .rn-view { display: inline-block; }.rn-text > .rn-text { display: inline; font-size: inherit; }.resize-triggers { visibility: hidden; opacity: 0; z-index: -1; }.resize-triggers, .expand-trigger, .contract-trigger, .contract-trigger::before { content: \" \"; display: block; position: absolute; top: 0px; left: 0px; height: 100%; width: 100%; overflow: hidden; }.contract-trigger::before { width: 200%; height: 200%; }.rn-scroller-vert { will-change: transform, -webkit-transform; min-height: 100%; width: 100%; }.rn-scroller-hori { will-change: transform, -webkit-transform; min-width: 100%; flex: 1 1 0%; }.crnweb-mask { background-color: rgba(0, 0, 0, 0.5); }.rn-scroller-hori > * { flex-shrink: 0; }@keyframes slideleftin { \n 0% { transform: translateX(-50%); opacity: 0; }\n 100% { transform: translateX(0px); opacity: 1; }\n}@-webkit-keyframes slideleftin { \n 0% { transform: translateX(-50%); opacity: 0; }\n 100% { transform: translateX(0px); opacity: 1; }\n}@keyframes sliderightin { \n 0% { transform: translateX(50%); opacity: 0; }\n 100% { transform: translateX(0px); opacity: 1; }\n}@-webkit-keyframes sliderightin { \n 0% { transform: translateX(50%); opacity: 0; }\n 100% { transform: translateX(0px); opacity: 1; }\n}.slideleftin { animation: 350ms ease-in-out 0s 1 normal none running slideleftin; }.sliderightin { animation: 350ms ease-in-out 0s 1 normal none running sliderightin; }@keyframes slidedownin { \n 0% { transform: translateY(50%); opacity: 0; }\n 100% { transform: translateY(0px); opacity: 1; }\n}@-webkit-keyframes slidedownin { \n 0% { transform: translateY(50%); opacity: 0; }\n 100% { transform: translateY(0px); opacity: 1; }\n}@keyframes slideupin { \n 0% { transform: translateY(50%); opacity: 0; }\n 100% { transform: translateY(0px); opacity: 1; }\n}@-webkit-keyframes slideupin { \n 0% { transform: translateY(-50%); opacity: 0; }\n 100% { transform: translateY(0px); opacity: 1; }\n}.slidedownin { animation: 350ms ease-in-out 0s 1 normal none running slidedownin; }.slideupin { animation: 350ms ease-in-out 0s 1 normal none running slideupin; }.animatestart { position: absolute; top: 0px; left: 0px; z-index: 9999; width: 100%; height: 100%; overflow-x: hidden; }.animationComponent { will-change: opacity, left, top; }","isStyle":true,"id":62}],"id":61},{"type":2,"tagName":"style","attributes":{},"childNodes":[{"type":3,"textContent":".cui_cldweek { position: relative; z-index: 2; left: 0px; height: auto; overflow: hidden; font: 400 0.12rem / 0.24rem verdana; border-bottom: 0.01rem solid rgb(200, 200, 200); background: rgb(247, 247, 247); padding-left: 0rem; right: 0px; top: 0px; margin: 0px; }.cui_cldweek li { float: left; width: 14%; text-align: center; list-style-type: none; }.cui_cldweek li:first-child, .cui_cldweek li:last-child { width: 15%; color: rgb(255, 0, 0); }.cui_cldmonth { height: 0.4rem; text-align: center; font: 400 0.16rem / 0.5rem verdana; background: rgb(255, 255, 255); }.cui_cldunit { margin-bottom: 0.14rem; }.cui_cld_daybox { background: rgb(255, 255, 255); padding-left: 0rem; list-style-type: none; }.cui_cld_daybox li { float: left; width: 14%; height: 0.59rem; padding: 0.05rem 0px; font: 400 0.14rem verdana; text-align: center; position: relative; }.cui_cld_daybox li.selectedDate { background-color: rgb(222, 241, 252); color: rgb(255, 255, 255) !important; }.cui_cld_daybox li.endpoint { background-color: rgb(9, 159, 222); color: rgb(255, 255, 255) !important; }.cui_cld_daybox li.cui_cld_day_hint { color: rgb(6, 162, 208); }.cui_cld_daybox li:nth-of-type(7n), .cui_cld_daybox li:nth-of-type(7n+1) { width: 15%; color: rgb(255, 0, 0); }.cui_cld_daybox li.calendar-holiday { color: rgb(255, 0, 0); }.cui_cld_daybox li.calendar-work { color: rgb(0, 0, 0); }.cui_cld_dayfuture { background: rgb(255, 255, 255); }.cui_cld_day_nocrtmonth { visibility: hidden; }.cui_cld_day_havetxt em, .cui_cld_nopro em, .cui_cld_haspro em, .cui_cld_daycrt em { display: block; line-height: 0.17rem; font-size: 0.17rem; padding-bottom: 0.04rem; }.cui_cld_day_havetxt i, .cui_cld_nopro i, .cui_cld_haspro i, .cui_cld_daycrt i { display: block; line-height: 0.1rem; font-size: 0.1rem; font-style: normal; }em { font-style: normal; }.cui_cld_daycrt.cui_cld_daycrt_sl em { line-height: inherit; }.cui_cld_daybox li.cui_cld_daypass { color: rgb(207, 207, 207) !important; }.cui_cld_daycrt { background: rgb(6, 162, 208); color: rgb(255, 255, 255) !important; }.cm-calendar-ft { font-size: 0.125rem; border-top: 0.01rem solid rgb(219, 219, 219); background-color: rgb(239, 239, 239); position: fixed; left: 0px; right: 0px; bottom: 0px; padding: 0.05rem 0px; overflow-x: auto; }.cm-calendar-ft li { display: inline-block; line-height: 0.3rem; padding: 0px 0.1rem; border-radius: 0.04rem; text-align: center; background-color: rgb(204, 204, 204); margin: 0px 0.05rem; }.cm-calendar-quick-nav { white-space: nowrap; margin: 0px; padding: 0px; }.cm-calendar { padding-top: 0px; padding-bottom: 0.7rem; background: rgb(255, 255, 255); }.cm-calendar .cm-calendar-ft li.active { background-color: rgb(9, 159, 222); color: rgb(255, 255, 255); }.cm-calendar .cm-calendar-ft li .selectedDate { background-color: rgb(9, 159, 222); color: rgb(255, 255, 255); }.cm-calendar .calendarComponent-bubble-wrap { position: absolute; top: 0px; left: 50%; z-index: 1010; transform: translate(-50%, -100%); padding-bottom: 7px; }.cm-calendar .calendarComponent-bubble-wrap .calendarComponent-bubble { border-radius: 4px; padding: 9px 10px; background: rgba(34, 34, 34, 0.85); font-size: 12px; color: rgb(255, 255, 255); display: block; width: auto; white-space: nowrap; margin: 0px; }.cm-calendar .calendarComponent-bubble-wrap .calendarComponent-bubble::after { content: \"\"; display: block; border-top: 7px solid rgba(34, 34, 34, 0.85); border-left: 8px solid transparent; border-right: 8px solid transparent; position: absolute; bottom: 0px; left: 50%; margin-left: -8px; }.calendarComponent-toast { background: rgba(0, 0, 0, 0.75); border-radius: 6px; font-size: 15px; color: rgb(255, 255, 255); padding: 10px 26px; min-width: 150px; box-sizing: border-box; text-align: center; position: absolute; left: 0px; top: 50%; z-index: 1011; transform: translate(-100%, -50%); transition: all 0.2s linear 0s; }.calendarComponent-toast.calendarComponent-toast_show { left: 50%; transform: translate(-50%, -50%); }.calendarComponent-toast.calendarComponent-date_back { bottom: 115px; top: initial; transform: translate(-100%, 0px); }.calendarComponent-toast.calendarComponent-date_back.calendarComponent-toast_show { left: 50%; transform: translate(-50%, 0px); }@keyframes myfirst { \n 0% { background: rgb(255, 255, 255); }\n 100% { background: rgb(9, 159, 222); color: white; }\n}","isStyle":true,"id":64}],"id":63},{"type":2,"tagName":"style","attributes":{},"childNodes":[{"type":3,"textContent":".cp-h5-main { position: absolute; inset: 0px; height: 100%; width: 100%; }#cp-h5-text { margin: 0px; padding: 0px; line-height: 1.5; font-family: Arial, \"Lucida Grande\", Verdana, \"Microsoft YaHei\", hei; }.loading-layer2 { background: rgba(255, 255, 255, 0.95); width: 0.6rem; height: 0.18rem; padding-top: 0.42rem; border-radius: 0.08rem; z-index: 10000; position: fixed; left: 50%; top: 50%; margin-left: -0.3rem; color: rgb(102, 102, 102); font-size: 0.1rem; text-align: center; margin-top: -0.3rem; }.loading-layer2 .close { position: absolute; background: rgba(0, 0, 0, 0.5); height: 0.16rem; width: 0.16rem; right: -0.06rem; top: -0.04rem; border-radius: 50%; }.loading-layer2 .close::before, .loading-layer2 .close::after { content: \"\"; height: 0.08rem; width: 0.01rem; position: absolute; top: 0.04rem; left: 0.07rem; background-color: rgb(255, 255, 255); }.loading-layer2 .close::before { transform: rotate(45deg); }.loading-layer2 .close::after { transform: rotate(-45deg); }.smileLoading { width: 0.32rem; height: 0.32rem; position: absolute; top: 0.08rem; left: 0.14rem; }.smileLoading svg { width: 100%; height: 100%; }#circle { transform-origin: 50% 50%; animation: 4s ease 0s infinite normal none running circleWrap; will-change: auto; }@keyframes circleWrap { \n 0% { transform: rotate(0deg); stroke-dasharray: 9.41rem; }\n 30%, 50% { transform: rotate(420deg); stroke-dasharray: 3.1rem, 6.41rem; }\n 56% { transform: rotate(650deg); stroke-dasharray: 2rem, 7.41rem; }\n 80%, 100% { transform: rotate(1036deg); stroke-dasharray: 9.41rem; }\n}@-webkit-keyframes circleWrap { \n 0% { transform: rotate(0deg); stroke-dasharray: 9.41rem; }\n 30%, 50% { transform: rotate(420deg); stroke-dasharray: 3.1rem, 6.41rem; }\n 56% { transform: rotate(650deg); stroke-dasharray: 2rem, 7.41rem; }\n 80%, 100% { transform: rotate(1036deg); stroke-dasharray: 9.41rem; }\n}#leftEye, #rightEye { opacity: 0; animation: 4s ease 0.5s infinite normal none running showEye; will-change: auto; }@keyframes showEye { \n 0%, 45%, 100% { opacity: 0; }\n 5%, 40% { opacity: 1; }\n}@-webkit-keyframes showEye { \n 0%, 45%, 100% { opacity: 0; }\n 5%, 40% { opacity: 1; }\n}#rightEye { animation-delay: 0.7s; }#rightEye path { transform: translate3d(-0.04rem, 0px, 0px); }#mapGroup { transform: translate3d(0px, -20%, 0px); animation: 4s ease 2s infinite normal none running mapMove; will-change: auto; }#mapGroup .map { fill: none; stroke-dasharray: 9rem; stroke-dashoffset: 9rem; animation: 4s ease 2s infinite normal none running mapStroke; will-change: auto; }@keyframes mapMove { \n 0%, 50%, 79% { transform: translate3d(0px, -20%, 0px); }\n 78% { transform: translate3d(-100%, 0px, 0px); }\n}@-webkit-keyframes mapMove { \n 0%, 50%, 79% { transform: translate3d(0px, -20%, 0px); }\n 78% { transform: translate3d(-100%, 0px, 0px); }\n}@keyframes mapStroke { \n 0%, 78% { stroke-dasharray: 9rem; stroke-dashoffset: 9rem; }\n 40%, 60% { stroke-dasharray: 9rem; stroke-dashoffset: 0; }\n}@-webkit-keyframes mapStroke { \n 0%, 78% { stroke-dasharray: 9rem; stroke-dashoffset: 9rem; }\n 40%, 60% { stroke-dasharray: 9rem; stroke-dashoffset: 0; }\n}","isStyle":true,"id":66}],"id":65},{"type":2,"tagName":"style","attributes":{},"childNodes":[{"type":3,"textContent":".rn-picker { position: relative; overflow: hidden; width: 100%; }.rn-picker-scroller { border-width: 0px; will-change: transform; }.rn-picker-item { width: 100%; text-align: center; justify-content: center; }.rn-picker-mask { left: 0px; top: 0px; width: 100%; background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0)), -webkit-linear-gradient(0deg, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0.9)); margin: 0px auto; background-repeat: no-repeat; background-position: left top, left bottom; position: absolute !important; }.rn-picker-mask-bottom { left: 0px; bottom: 0px; width: 100%; background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.9)), -webkit-linear-gradient(0deg, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.3)); margin: 0px auto; background-repeat: no-repeat; background-position: left top, left bottom; position: absolute !important; }.rn-picker-window { width: 100%; left: 0px; top: 50%; z-index: 3; border-color: rgb(204, 204, 204); border-style: solid; border-bottom-width: 1px; background-size: 100% 1px; background-position: center top, center bottom; background-repeat: no-repeat; position: absolute !important; }","isStyle":true,"id":68}],"id":67},{"type":2,"tagName":"style","attributes":{},"childNodes":[{"type":3,"textContent":"@-webkit-keyframes fade { \n 0% { opacity: 0; }\n 100% { opacity: 1; }\n}@keyframes fade { \n 0% { opacity: 0; }\n 100% { opacity: 1; }\n}@-webkit-keyframes slideFromBottom { \n 0% { transform: translate3d(0px, 200%, 0px); visibility: visible; }\n 100% { transform: translate3d(0px, 0px, 0px); }\n}@keyframes slideFromBottom { \n 0% { transform: translate3d(0px, 200%, 0px); visibility: visible; }\n 100% { transform: translate3d(0px, 0px, 0px); }\n}@-webkit-keyframes slideFromLeft { \n 0% { transform: translate3d(-100%, 0px, 0px); visibility: visible; }\n 100% { transform: translate3d(0px, 0px, 0px); }\n}@keyframes slideFromLeft { \n 0% { transform: translate3d(-100%, 0px, 0px); visibility: visible; }\n 100% { transform: translate3d(0px, 0px, 0px); }\n}@-webkit-keyframes slideFromRight { \n 0% { transform: translate3d(100%, 0px, 0px); visibility: visible; }\n 100% { transform: translate3d(0px, 0px, 0px); }\n}@keyframes slideFromRight { \n 0% { transform: translate3d(100%, 0px, 0px); visibility: visible; }\n 100% { transform: translate3d(0px, 0px, 0px); }\n}@-webkit-keyframes slideFromTop { \n 0% { transform: translate3d(0px, -200%, 0px); visibility: visible; }\n 100% { transform: translate3d(0px, 0px, 0px); }\n}@keyframes slideFromTop { \n 0% { transform: translate3d(0px, -200%, 0px); visibility: visible; }\n 100% { transform: translate3d(0px, 0px, 0px); }\n}@keyframes darken { \n 0% { background-color: rgba(0, 0, 0, 0); }\n}@-webkit-keyframes darken { \n 0% { background-color: rgba(0, 0, 0, 0); }\n}.rn-modal-wrapper { animation: 0.3s linear 0s 1 normal none running darken; }.rn-modal-animated { animation-duration: 0.3s; animation-timing-function: ease-out; animation-fill-mode: both; animation-play-state: paused; }","isStyle":true,"id":70}],"id":69},{"type":2,"tagName":"style","attributes":{},"childNodes":[{"type":3,"textContent":".cp-h5-main { position: absolute; inset: 0px; }.cp-h5-main .loadFailed-box p { font-size: 0.15rem; color: rgb(102, 102, 102); }.cp-h5-main .loadFailed-box { padding-top: 0.75rem; text-align: center; }.cp-h5-main .loadFailed-box .loadFailed-animate { background-image: url(\"//h5resource.ares.fws.qa.nt.ctripcorp.com/AIO/crnweb/rn_flight_postservice/20220513154935/loadingfailed_fc57d644.png\"); background-size: 0.8rem; position: relative; top: 0px; margin: 0px auto 0.4rem; width: 0.8rem; height: 0.8rem; background-repeat: no-repeat; background-position: center center; }.cp-h5-main .loadFailed-box .btn-call { display: block; margin: 0px 0.35rem; background-color: rgb(255, 255, 255); height: 0.44rem; line-height: 0.44rem; border-radius: 0.05rem; color: rgb(9, 159, 222); font-size: 0.2rem; position: relative; }.cp-h5-main .loadFailed-box .line-spacing { display: block; height: 0.01rem; margin: 0.2rem 0.35rem; background-color: rgb(188, 188, 188); position: relative; }.cp-h5-main .loadFailed-box .line-spacing::before { content: \"或\"; background-color: rgb(245, 245, 245); width: 0.3rem; text-align: center; position: absolute; top: -0.1rem; left: 50%; margin-left: -0.15rem; color: rgb(188, 188, 188); }.cp-h5-main .loadFailed-box .btn-clicked::before { content: \"\"; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; border-radius: 0.05rem; background-color: rgba(0, 0, 0, 0.3); }","isStyle":true,"id":72}],"id":71},{"type":2,"tagName":"script","attributes":{"charset":"utf-8","src":"http://h5resource.ares.fws.qa.nt.ctripcorp.com/AIO/crnweb/rn_flight_postservice/20220513154935/cw_index~PerferedFlig~72985c40.b4d568b4.js"},"childNodes":[],"id":73},{"type":2,"tagName":"script","attributes":{"charset":"utf-8","src":"http://h5resource.ares.fws.qa.nt.ctripcorp.com/AIO/crnweb/rn_flight_postservice/20220513154935/rebookBackupFlights-p~c52c4bb0.a34b5a8c.js"},"childNodes":[],"id":74},{"type":2,"tagName":"script","attributes":{"charset":"utf-8","src":"http://h5resource.ares.fws.qa.nt.ctripcorp.com/AIO/crnweb/rn_flight_postservice/20220513154935/rebookEntry-page.aeb34bee.js"},"childNodes":[],"id":75},{"type":2,"tagName":"script","attributes":{"charset":"utf-8","src":"http://h5resource.ares.fws.qa.nt.ctripcorp.com/AIO/crnweb/rn_flight_postservice/20220513154935/common~rebookReset-pa~fe0b317d.a47adf9b.js"},"childNodes":[],"id":76},{"type":2,"tagName":"script","attributes":{"charset":"utf-8","src":"http://h5resource.ares.fws.qa.nt.ctripcorp.com/AIO/crnweb/rn_flight_postservice/20220513154935/rebookReset-page.319d668a.js"},"childNodes":[],"id":77},{"type":2,"tagName":"script","attributes":{"type":""},"childNodes":[{"type":3,"textContent":"SCRIPT_PLACEHOLDER","id":79}],"id":78}],"id":4},{"type":3,"textContent":" ","id":80},{"type":2,"tagName":"body","attributes":{"style":"font: 400 0.7rem/1.5 -apple-system, Helvetica, Arial, Tahoma, sans-serif;color: #333;"},"childNodes":[{"type":3,"textContent":" ","id":82},{"type":2,"tagName":"div","attributes":{"id":"rootTag","class":"root-tag"},"childNodes":[{"type":2,"tagName":"div","attributes":{"id":"crnweb_viewport_1654638100737","page-url":"/AIO/crnweb/rn_flight_postservice/20220513154935/rebook.html","style":"display: none; height: 100%; width: 100%; flex: 1 1 0%;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"name":"Scene","class":"rn-flex rn-view","style":"flex: 1 1 0%; display: flex; width: 100%; height: 100%;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"id":"main","backgroundcolor":"#EEF1F6","class":"rn-flex rn-view","style":"flex: 1 1 0%; height: 100%;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-view","style":"padding-top: 0rem; background-color: rgb(255, 255, 255);"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-flex rn-view","style":"flex-direction: row; width: 100%; height: 0.44rem; padding-top: 0rem; background-color: rgb(255, 255, 255); align-items: center;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-view","style":"width: 0.44rem; height: 0.44rem;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"accessible":"true","accessibilityrole":"button","testid":"改签申请_headerLeft","tabindex":"1","class":"animationComponent rn-flex rn-view","style":"user-select: none; width: 0.44rem; height: 0.44rem; align-items: center; justify-content: center; opacity: 1;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-text","style":"font-family: crn_font_orderservice; font-size: 0.24rem; color: rgb(51, 51, 51); white-space: pre-wrap; overflow-wrap: break-word; word-break: break-word;"},"childNodes":[{"type":3,"textContent":"","id":92}],"id":91}],"id":90}],"id":89},{"type":2,"tagName":"div","attributes":{"class":"rn-flex rn-view","style":"flex: 1 1 0%; height: 0.44rem; align-items: center; justify-content: center;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-flex rn-view","style":"flex: 1 1 0%; align-items: center; justify-content: center;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-text","style":"font-size: 0.17rem; font-weight: 500; color: rgb(51, 51, 51); line-height: 0.22rem; white-space: pre-wrap; overflow-wrap: break-word; word-break: break-word;"},"childNodes":[{"type":3,"textContent":"改签申请","id":96}],"id":95}],"id":94}],"id":93},{"type":2,"tagName":"div","attributes":{"class":"rn-view","style":"width: 0.44rem; height: 0.44rem;"},"childNodes":[],"id":97}],"id":88}],"id":87}],"id":86}],"id":85}],"id":84},{"type":2,"tagName":"div","attributes":{"id":"crnweb_viewport_1654638101992","page-url":"/AIO/crnweb/rn_flight_postservice/20220513154935/rebookReset.html","style":"display: flex; height: 100%; width: 100%; flex: 1 1 0%;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"name":"Scene","class":"rn-flex rn-view","style":"flex: 1 1 0%; display: flex; width: 100%; height: 100%;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"id":"main","backgroundcolor":"#EEF1F6","class":"rn-flex rn-view","style":"flex: 1 1 0%; height: 100%;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-view","style":"padding-top: 0rem; background-color: rgb(255, 255, 255);"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-flex rn-view","style":"flex-direction: row; width: 100%; height: 0.44rem; padding-top: 0rem; background-color: rgb(255, 255, 255); align-items: center;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-view","style":"width: 0.44rem; height: 0.44rem;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"accessible":"true","accessibilityrole":"button","testid":"改签申请_headerLeft","tabindex":"1","class":"animationComponent rn-flex rn-view","style":"user-select: none; width: 0.44rem; height: 0.44rem; align-items: center; justify-content: center; opacity: 1;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-text","style":"font-family: crn_font_orderservice; font-size: 0.24rem; color: rgb(51, 51, 51); white-space: pre-wrap; overflow-wrap: break-word; word-break: break-word;"},"childNodes":[{"type":3,"textContent":"","id":106}],"id":105}],"id":104}],"id":103},{"type":2,"tagName":"div","attributes":{"class":"rn-flex rn-view","style":"flex: 1 1 0%; height: 0.44rem; align-items: center; justify-content: center;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-flex rn-view","style":"flex: 1 1 0%; align-items: center; justify-content: center;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-text","style":"font-size: 0.17rem; font-weight: 500; color: rgb(51, 51, 51); line-height: 0.22rem; white-space: pre-wrap; overflow-wrap: break-word; word-break: break-word;"},"childNodes":[{"type":3,"textContent":"改签申请","id":110}],"id":109}],"id":108}],"id":107},{"type":2,"tagName":"div","attributes":{"class":"rn-view","style":"width: 0.44rem; height: 0.44rem;"},"childNodes":[],"id":111}],"id":102}],"id":101},{"type":2,"tagName":"div","attributes":{"class":"rn-flex rn-view","style":"flex: 1 1 0%; background-color: rgb(238, 241, 246); overflow: hidden;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"who":"1654638101992","scrolleventthrottle":"32","contentinset":"[object Object]","keyboarddismissmode":"none","decelerationrate":"normal","class":"rn-flex rn-view","style":"position: relative; flex: 1 1 auto; max-height: 100%; overflow: hidden; transform-style: preserve-3d; touch-action: none; z-index: 0;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-scroller-vert rn-view","style":"transition-property: transform; transform: translate(0px, 0px) translateZ(0px); position: relative; transition-duration: 0ms;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-view"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-view","style":"background-color: rgb(242, 251, 248); width: 100%; position: relative; padding: 0.16rem;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-view"},"childNodes":[],"id":117},{"type":2,"tagName":"div","attributes":{"class":"rn-view"},"childNodes":[{"type":2,"tagName":"div","attributes":{"accessible":"true","accessibilityrole":"button","testid":"resetPolicy","tabindex":"1","class":"animationComponent rn-view","style":"user-select: none; opacity: 1;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-flex rn-view","style":"flex-direction: row; align-items: center;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-text","style":"font-size: 0.13rem; color: rgb(102, 102, 102); line-height: 0.18rem; white-space: pre-wrap; overflow-wrap: break-word; word-break: break-word;"},"childNodes":[{"type":3,"textContent":"查看退改签政策","id":122}],"id":121},{"type":2,"tagName":"div","attributes":{"class":"rn-view","style":"margin-left: 0.03rem; margin-top: 0.01rem; height: 0.1rem;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-view","style":"width: 0.1rem; height: 0.1rem; margin-top: -0.04rem;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-text","style":"font-family: crn_font_orderservice; font-size: 0.1rem; color: rgb(102, 102, 102); white-space: pre-wrap; overflow-wrap: break-word; word-break: break-word;"},"childNodes":[{"type":2,"tagName":"span","attributes":{"style":"height: 100%; font-size: 0.115rem; display: inline-flex; align-items: baseline; transform: scale(0.83333); transform-origin: 0rem center;"},"childNodes":[{"type":3,"textContent":"","id":127}],"id":126}],"id":125}],"id":124}],"id":123}],"id":120}],"id":119}],"id":118},{"type":2,"tagName":"div","attributes":{"source":"[object Object]","style":"position: absolute; overflow: hidden; width: 0.66rem; height: 0.66rem; bottom: 0rem; right: 0rem; background-size: cover; background-repeat: no-repeat; background-position: 50% center; background-image: url(\"https://pic.c-ctrip.com/AssetCatalog/react-native/orderService/insurance.png\"); display: inline-flex;"},"childNodes":[],"id":128}],"id":116},{"type":2,"tagName":"div","attributes":{"class":"rn-view","style":"background-color: rgb(255, 255, 255);"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-view","style":"padding-right: 0.16rem; padding-left: 0.16rem;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-view","style":"padding-bottom: 0.2rem; padding-top: 0.2rem; border-style: solid; border-bottom-width: 0.01rem; border-color: rgb(228, 228, 228);"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-flex rn-view","style":"flex-direction: row; align-items: center;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-text","style":"font-family: crn_font_orderservice; font-size: 0.15rem; margin-top: 0.02rem; margin-right: 0.05rem; white-space: pre-wrap; overflow-wrap: break-word; word-break: break-word;"},"childNodes":[{"type":3,"textContent":"","id":134}],"id":133},{"type":2,"tagName":"div","attributes":{"class":"rn-text","style":"font-size: 0.15rem; font-weight: bold; line-height: 0.2rem; color: rgb(51, 51, 51); white-space: pre-wrap; overflow-wrap: break-word; word-break: break-word;"},"childNodes":[{"type":3,"textContent":"选择改签的乘客","id":136}],"id":135}],"id":132}],"id":131}],"id":130},{"type":2,"tagName":"div","attributes":{"class":"rn-view","style":"display: flex; flex: 1 1 0%; padding-right: 0.16rem; padding-left: 0.16rem;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-view","style":"padding-bottom: 0.2rem; padding-top: 0.2rem; border-style: solid; border-bottom-width: 0.01rem; border-color: rgb(228, 228, 228);"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-flex rn-view","style":"flex-direction: row; align-items: center;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-text","style":"font-family: crn_font_orderservice; font-size: 0.15rem; margin-top: 0.02rem; margin-right: 0.05rem; white-space: pre-wrap; overflow-wrap: break-word; word-break: break-word;"},"childNodes":[{"type":3,"textContent":"","id":141}],"id":140},{"type":2,"tagName":"div","attributes":{"class":"rn-text","style":"font-size: 0.15rem; font-weight: bold; line-height: 0.2rem; color: rgb(51, 51, 51); white-space: pre-wrap; overflow-wrap: break-word; word-break: break-word;"},"childNodes":[{"type":3,"textContent":"选择改签的行程","id":143}],"id":142}],"id":139}],"id":138}],"id":137},{"type":2,"tagName":"div","attributes":{"class":"rn-view","style":"display: flex; flex: 1 1 0%; padding-right: 0.16rem; padding-left: 0.16rem;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-view","style":"padding-top: 0.2rem; padding-bottom: 0.28rem;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-flex rn-view","style":"flex-direction: row; align-items: center;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-text","style":"font-family: crn_font_orderservice; font-size: 0.15rem; margin-top: 0.02rem; margin-right: 0.05rem; white-space: pre-wrap; overflow-wrap: break-word; word-break: break-word;"},"childNodes":[{"type":3,"textContent":"","id":148}],"id":147},{"type":2,"tagName":"div","attributes":{"class":"rn-text","style":"font-size: 0.15rem; font-weight: bold; line-height: 0.2rem; color: rgb(51, 51, 51); white-space: pre-wrap; overflow-wrap: break-word; word-break: break-word;"},"childNodes":[{"type":3,"textContent":"选择改签的日期","id":150}],"id":149},{"type":2,"tagName":"div","attributes":{"class":"rn-text","style":"font-size: 0.15rem; line-height: 0.2rem; color: rgb(51, 51, 51); white-space: pre-wrap; overflow-wrap: break-word; word-break: break-word;"},"childNodes":[{"type":3,"textContent":"(当地时间)","id":152}],"id":151}],"id":146},{"type":2,"tagName":"div","attributes":{"class":"rn-flex rn-view","style":"flex: 1 1 0%; margin-left: 0.22rem; flex-flow: row wrap; align-items: stretch;"},"childNodes":[],"id":153}],"id":145}],"id":144}],"id":129}],"id":115},{"type":2,"tagName":"div","attributes":{"class":"resize-triggers"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"expand-trigger"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"expand-child"},"childNodes":[],"id":156}],"id":155},{"type":2,"tagName":"div","attributes":{"class":"contract-trigger"},"childNodes":[],"id":157}],"id":154}],"id":114},{"type":2,"tagName":"div","attributes":{"class":"resize-triggers"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"expand-trigger"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"expand-child"},"childNodes":[],"id":160}],"id":159},{"type":2,"tagName":"div","attributes":{"class":"contract-trigger"},"childNodes":[],"id":161}],"id":158}],"id":113},{"type":2,"tagName":"div","attributes":{"class":"rn-flex rn-view","style":"padding: 0.23rem 0.16rem; flex-shrink: 0; flex-direction: row;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"accessible":"true","accessibilityrole":"button","testid":"选择改签航班","tabindex":"1","class":"animationComponent rn-flex rn-view","style":"user-select: none; flex: 1 1 0%; border-radius: 0.04rem; width: 3.43rem; padding-bottom: 0.11rem; padding-top: 0.11rem; align-items: center; background-color: rgb(228, 228, 228); opacity: 1;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-text","style":"width: 2.31rem; font-size: 0.17rem; text-align: center; line-height: 0.21rem; color: rgb(153, 153, 153); white-space: pre-wrap; overflow-wrap: break-word; word-break: break-word;"},"childNodes":[{"type":3,"textContent":"查看可改签航班","id":165}],"id":164}],"id":163}],"id":162}],"id":112}],"id":100}],"id":99}],"id":98}],"id":83},{"type":3,"textContent":" ","id":166},{"type":2,"tagName":"div","attributes":{"id":"globalComponentRoot","class":"rn-flex rn-global-compontent","style":"z-index: -1;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-root"},"childNodes":[],"id":168}],"id":167},{"type":3,"textContent":" ","id":169},{"type":2,"tagName":"div","attributes":{"id":"globalLoading","class":"rn-flex rn-global-compontent crnweb-mask","style":"z-index:11;display:none"},"childNodes":[],"id":170},{"type":3,"textContent":" ","id":171},{"type":2,"tagName":"div","attributes":{"id":"LoginTag","class":"rn-flex rn-global-compontent rn-hidden","style":"z-index:-1"},"childNodes":[],"id":172},{"type":3,"textContent":" ","id":173},{"type":2,"tagName":"div","attributes":{"id":"mainMock","style":"display:none"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"RootView rn-view"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-flex rn-view","style":"flex: 1 1 0%; position: relative;"},"childNodes":[{"type":2,"tagName":"div","attributes":{"class":"rn-view"},"childNodes":[],"id":177}],"id":176}],"id":175}],"id":174},{"type":3,"textContent":" ","id":178},{"type":2,"tagName":"input","attributes":{"type":"hidden","id":"page_id","value":"wait"},"childNodes":[],"id":179},{"type":3,"textContent":" ","id":180},{"type":2,"tagName":"input","attributes":{"id":"cw_superInput","value":"","style":"position:absolute;top:-10000px;left:-10000px"},"childNodes":[],"id":181},{"type":3,"textContent":" ","id":182},{"type":2,"tagName":"script","attributes":{"type":"text/html","id":"noSupportTemplate"},"childNodes":[{"type":3,"textContent":"SCRIPT_PLACEHOLDER","id":184}],"id":183},{"type":3,"textContent":" ","id":185},{"type":2,"tagName":"script","attributes":{"type":"text/javascript"},"childNodes":[{"type":3,"textContent":"SCRIPT_PLACEHOLDER","id":187}],"id":186},{"type":3,"textContent":" ","id":188},{"type":5,"textContent":"{{scriptProxyVersion}}","id":189},{"type":3,"textContent":" ","id":190},{"type":5,"textContent":"{{scriptBodyBegin}}","id":191},{"type":3,"textContent":" ","id":192},{"type":2,"tagName":"script","attributes":{"type":"text/javascript","src":"http://h5resource.ares.fws.qa.nt.ctripcorp.com/AIO/crnweb/rn_flight_postservice/20220513154935/cw_libs.195ef801.js","crossorigin":"anonymous"},"childNodes":[],"id":193},{"type":3,"textContent":" ","id":194},{"type":2,"tagName":"script","attributes":{"type":"text/javascript","src":"http://h5resource.ares.fws.qa.nt.ctripcorp.com/AIO/crnweb/rn_flight_postservice/20220513154935/cw_index.ebf6ec62.js","crossorigin":"anonymous"},"childNodes":[],"id":195},{"type":2,"tagName":"div","attributes":{"id":"globalComponentRoot-modal","class":"rn-flex rn-global-compontent"},"childNodes":[],"id":196},{"type":3,"textContent":" ","id":197},{"type":5,"textContent":"{{scriptPageAsset}}","id":198},{"type":3,"textContent":" ","id":199},{"type":5,"textContent":"{{scriptCaptcha}}","id":200},{"type":3,"textContent":" ","id":201},{"type":5,"textContent":"{{scriptPWA}}","id":202},{"type":3,"textContent":" ","id":203},{"type":2,"tagName":"script","attributes":{"type":"text/javascript","src":"http://h5resource.ares.fws.qa.nt.ctripcorp.com/AIO/crnweb/rn_flight_postservice/20220513154935/bodymovin_light.min.js"},"childNodes":[],"id":204},{"type":3,"textContent":" ","id":205},{"type":2,"tagName":"script","attributes":{"src":"http://webresource.c-ctrip.com/code/ubt/_mubt.min.js?1652428431311","type":"text/javascript","charset":"utf-8","async":""},"childNodes":[],"id":206},{"type":3,"textContent":" ","id":207},{"type":5,"textContent":"{{scriptBodyEnd}}","id":208},{"type":3,"textContent":" ","id":209},{"type":2,"tagName":"script","attributes":{"crossorigin":"anonymous","async":"","src":"https://webresource.c-ctrip.com/ares2/fx/nfesHybrid/0.0.11/default/webvitals.es5.js"},"childNodes":[],"id":210},{"type":3,"textContent":" ","id":211}],"id":81}],"id":3}],"id":1},"initialOffset":{"left":0,"top":0}},"timestamp":1654638102012},{"type":3,"data":{"source":0,"texts":[],"attributes":[],"removes":[],"adds":[{"parentId":117,"nextId":null,"node":{"type":2,"tagName":"div","attributes":{"class":"rn-text","style":"font-size: 0.13rem; color: rgb(0, 184, 122); margin-bottom: 0.08rem; letter-spacing: -0.002rem; line-height: 0.18rem; white-space: pre-wrap; overflow-wrap: break-word; word-break: break-word;"},"childNodes":[],"id":212}},{"parentId":212,"nextId":null,"node":{"type":3,"textContent":"携程不加收任何退改服务费, 具体按产品提供方规定收取!","id":213}},{"parentId":131,"nextId":null,"node":{"type":2,"tagName":"div","attributes":{"testid":"reset_选人","class":"rn-flex rn-view","style":"flex: 1 1 0%; margin-top: 0.2rem; margin-left: 0.24rem; flex-direction: column;"},"childNodes":[],"id":214}},{"parentId":214,"nextId":null,"node":{"type":2,"tagName":"div","attributes":{"class":"rn-flex rn-view","style":"flex-direction: row; align-items: flex-start;"},"childNodes":[],"id":215}},{"parentId":215,"nextId":null,"node":{"type":2,"tagName":"div","attributes":{"class":"rn-flex rn-view","style":"flex-direction: row; align-items: center; flex: 1 1 0%;"},"childNodes":[],"id":216}},{"parentId":216,"nextId":null,"node":{"type":2,"tagName":"div","attributes":{"class":"rn-text","style":"font-size: 0.15rem; line-height: 0.2rem; color: rgb(51, 51, 51); white-space: pre-wrap; overflow-wrap: break-word; word-break: break-word;"},"childNodes":[],"id":217}},{"parentId":217,"nextId":null,"node":{"type":3,"textContent":"张振锋","id":218}},{"parentId":138,"nextId":null,"node":{"type":2,"tagName":"div","attributes":{"class":"rn-flex rn-view","style":"flex-direction: column; margin-top: 0.2rem; flex: 1 1 0%; margin-left: 0.24rem;"},"childNodes":[],"id":219}},{"parentId":219,"nextId":null,"node":{"type":2,"tagName":"div","attributes":{"class":"rn-flex rn-view","style":"flex-direction: row; align-items: flex-start;"},"childNodes":[],"id":220}},{"parentId":220,"nextId":null,"node":{"type":2,"tagName":"div","attributes":{"testid":"可选行程","class":"rn-flex rn-view","style":"flex-flow: row wrap; flex: 1 1 0%; align-items: flex-start;"},"childNodes":[],"id":221}},{"parentId":221,"nextId":null,"node":{"type":2,"tagName":"div","attributes":{"class":"rn-text","style":"margin-right: 0.04rem; margin-left: 0.04rem; font-size: 0.15rem; line-height: 0.2rem; color: rgb(51, 51, 51); white-space: pre-wrap; overflow-wrap: break-word; word-break: break-word;"},"childNodes":[],"id":222}},{"parentId":222,"nextId":null,"node":{"type":3,"textContent":"赤峰","id":223}},{"parentId":153,"nextId":null,"node":{"type":2,"tagName":"div","attributes":{"accessible":"true","accessibilityrole":"button","testid":"resetEnableCalendar_0","tabindex":"1","class":"animationComponent rn-flex rn-view","style":"user-select: none; flex-direction: row; align-items: flex-start; margin-top: 0.2rem; opacity: 1;"},"childNodes":[],"id":224}},{"parentId":224,"nextId":null,"node":{"type":2,"tagName":"div","attributes":{"class":"rn-flex rn-view","style":"width: 1.46rem; padding-bottom: 0.1rem; padding-top: 0.1rem; border-radius: 0.04rem; justify-content: center; flex-direction: row; align-items: center; background-color: rgb(242, 248, 254);"},"childNodes":[],"id":225}},{"parentId":225,"nextId":null,"node":{"type":2,"tagName":"div","attributes":{"class":"rn-text","style":"font-family: crn_font_orderservice; font-size: 0.17rem; margin-top: 0.01rem; color: rgb(0, 134, 246); white-space: pre-wrap; overflow-wrap: break-word; word-break: break-word;"},"childNodes":[],"id":226}},{"parentId":226,"nextId":null,"node":{"type":3,"textContent":"","id":227}},{"parentId":215,"nextId":216,"node":{"type":2,"tagName":"div","attributes":{"class":"rn-view","style":"margin-top: 0.01rem; margin-right: 0.06rem;"},"childNodes":[],"id":228}},{"parentId":228,"nextId":null,"node":{"type":2,"tagName":"div","attributes":{"accessible":"true","accessibilityrole":"button","tabindex":"1","class":"animationComponent rn-view","style":"user-select: none; flex-shrink: 0; opacity: 1;"},"childNodes":[],"id":229}},{"parentId":229,"nextId":null,"node":{"type":2,"tagName":"div","attributes":{"source":"[object Object]","style":"position: relative; overflow: hidden; width: 0.18rem; height: 0.18rem; background-size: cover; background-repeat: no-repeat; background-position: 50% center; background-image: url(\"https://pic.c-ctrip.com/AssetCatalog/react-native/common/Checkbox-on.png\"); display: inline-flex;"},"childNodes":[],"id":230}},{"parentId":220,"nextId":221,"node":{"type":2,"tagName":"div","attributes":{"class":"rn-flex rn-view","style":"margin-right: 0.06rem; flex-direction: column; align-self: flex-start;"},"childNodes":[],"id":231}},{"parentId":231,"nextId":null,"node":{"type":2,"tagName":"div","attributes":{"accessible":"true","accessibilityrole":"button","tabindex":"1","class":"animationComponent rn-view","style":"user-select: none; flex-shrink: 0; opacity: 1;"},"childNodes":[],"id":232}},{"parentId":232,"nextId":null,"node":{"type":2,"tagName":"div","attributes":{"source":"[object Object]","style":"position: relative; overflow: hidden; width: 0.18rem; height: 0.18rem; background-size: cover; background-repeat: no-repeat; background-position: 50% center; background-image: url(\"https://pic.c-ctrip.com/AssetCatalog/react-native/common/Checkbox-on.png\"); display: inline-flex;"},"childNodes":[],"id":233}},{"parentId":221,"nextId":222,"node":{"type":2,"tagName":"div","attributes":{"class":"rn-text","style":"font-family: crn_font_orderservice; font-size: 0.13rem; color: rgb(153, 153, 153); margin: 0.03rem 0.04rem; white-space: pre-wrap; overflow-wrap: break-word; word-break: break-word;"},"childNodes":[],"id":234}},{"parentId":221,"nextId":234,"node":{"type":2,"tagName":"div","attributes":{"class":"rn-text","style":"margin-right: 0.04rem; margin-left: 0.04rem; font-size: 0.15rem; line-height: 0.2rem; color: rgb(51, 51, 51); white-space: pre-wrap; overflow-wrap: break-word; word-break: break-word;"},"childNodes":[],"id":235}},{"parentId":221,"nextId":235,"node":{"type":2,"tagName":"div","attributes":{"class":"rn-text","style":"margin-right: 0.04rem; margin-left: 0.04rem; font-size: 0.15rem; line-height: 0.2rem; color: rgb(51, 51, 51); white-space: pre-wrap; overflow-wrap: break-word; word-break: break-word;"},"childNodes":[],"id":236}},{"parentId":221,"nextId":236,"node":{"type":2,"tagName":"div","attributes":{"class":"rn-text","style":"font-size: 0.15rem; line-height: 0.2rem; color: rgb(51, 51, 51); white-space: pre-wrap; overflow-wrap: break-word; word-break: break-word;"},"childNodes":[],"id":237}},{"parentId":237,"nextId":null,"node":{"type":3,"textContent":"2022-06-08","id":238}},{"parentId":236,"nextId":null,"node":{"type":3,"textContent":"13:15","id":239}},{"parentId":235,"nextId":null,"node":{"type":3,"textContent":"呼和浩特","id":240}},{"parentId":234,"nextId":null,"node":{"type":3,"textContent":"","id":241}},{"parentId":225,"nextId":226,"node":{"type":2,"tagName":"div","attributes":{"class":"rn-text","style":"font-size: 0.15rem; margin-right: 0.04rem; color: rgb(0, 134, 246); font-weight: 500; line-height: 0.2rem; white-space: pre-wrap; overflow-wrap: break-word; word-break: break-word;"},"childNodes":[],"id":242}},{"parentId":242,"nextId":null,"node":{"type":3,"textContent":"新航班日期","id":243}}]},"timestamp":1654638102022},{"type":3,"data":{"source":0,"texts":[],"attributes":[{"id":156,"attributes":{"style":{"width":"415px","height":"764px"}}},{"id":160,"attributes":{"style":{"width":"415px","height":"764px"}}}],"removes":[],"adds":[]},"timestamp":1654638102107},{"type":3,"data":{"source":3,"id":157,"x":414,"y":763},"timestamp":1654638102107},{"type":3,"data":{"source":3,"id":155,"x":1,"y":1},"timestamp":1654638102207}]
我是在循环中分别读取events_{idx}.json内容 并使用replayer来实现回放,并在回放结束时截图:
看起来像是 puppeteer evaluate 使用上的问题,evaluate 是另一个上下文(浏览器中的),可以看一下在 evaluate 内 events 是否正常。
Maybe you can try this?
const isFinish = await this.page.evaluate(
(events) =>
new Promise((resolve) => {
const replayer = new rrweb.Replayer(events, {
mouseTail: false,
});
replayer.play();
this.log('录制开始');
replayer.on('finish', () => {
this.log('录制结束');
resolve(true);
});
}),
events
);
this.log('isFinish', isFinish);
if (isFinish) {
const wrapperEl = await this.page.$('.replayer-wrapper');
baseScreen = await wrapperEl.screenshot({
// fullpage: true,
});
}
@Yuyz0112 嗯 我把events传进去 结果是一样的:
@Cosen95 可能需要检查events的个数是否>1, 播放器至少需要2个或以上的events