diff --git a/packages/driver/src/util/serialization/log.ts b/packages/driver/src/util/serialization/log.ts index 9ea660de69ca..5e20d728a181 100644 --- a/packages/driver/src/util/serialization/log.ts +++ b/packages/driver/src/util/serialization/log.ts @@ -282,10 +282,10 @@ export const postprocessLogLikeFromSerialization = (props) => { } /** - * Preprocess snapshots to a serializable form before piping them over through postMessage(). + * Preprocess a snapshot to a serializable form before piping them over through postMessage(). * This method is also used by a spec bridge on request if a 'final state' snapshot is requested outside that of the primary domain * - * @param snapshot a snapshot matching the same structure that is returned from cy.createSnapshot. + * @param {any} snapshot - a snapshot matching the same structure that is returned from cy.createSnapshot. * @returns a serializable form of a snapshot, including a serializable with styles */ export const preprocessSnapshotForSerialization = (snapshot) => { @@ -303,6 +303,18 @@ export const preprocessSnapshotForSerialization = (snapshot) => { return preprocessedSnapshot } +/** + * Postprocess a snapshot from the serializable from to an actual HTML body snapshot that exists in the primary document. + * @param {any} snapshot - a snapshot that has been preprocessed and sent through post message and needs to be reified in the primary. + * @returns the reified snapshot that exists in the primary document + */ +export const postprocessSnapshotFromSerialization = (snapshot) => { + snapshot.body = postprocessLogLikeFromSerialization(snapshot.body) + + // @ts-ignore + return cy.createSnapshot(snapshot.name, null, snapshot) +} + /** * Sanitizes the log messages going to the primary domain before piping them to postMessage(). * This is designed to function as an extension of preprocessForSerialization, but also attempts to serialize DOM elements, @@ -360,12 +372,7 @@ export const postprocessLogFromSerialization = (logAttrs) => { if (snapshots) { // @ts-ignore - snapshots = snapshots.filter((snapshot) => !!snapshot).map((snapshot) => { - snapshot.body = postprocessLogLikeFromSerialization(snapshot.body) - - // @ts-ignore - return cy.createSnapshot(snapshot.name, null, snapshot) - }) + snapshots = snapshots.filter((snapshot) => !!snapshot).map((snapshot) => postprocessSnapshotFromSerialization(snapshot)) } const reified = postprocessLogLikeFromSerialization(logAttrsRest) diff --git a/packages/runner-shared/src/iframe/iframe-model.js b/packages/runner-shared/src/iframe/iframe-model.js index df5018cc46ad..d7432b300868 100644 --- a/packages/runner-shared/src/iframe/iframe-model.js +++ b/packages/runner-shared/src/iframe/iframe-model.js @@ -4,7 +4,7 @@ import { action } from 'mobx' import { selectorPlaygroundModel } from '../selector-playground' import { studioRecorder } from '../studio' import { eventManager } from '../event-manager' -import { postprocessLogLikeFromSerialization } from '@packages/driver/src/util/serialization/log' +import { postprocessSnapshotFromSerialization } from '@packages/driver/src/util/serialization/log' export class IframeModel { constructor ({ state, detachDom, restoreDom, highlightEl, snapshotControls, isAUTSameOrigin, removeSrc }) { @@ -223,16 +223,10 @@ export class IframeModel { if (!this.isAUTSameOrigin()) { const Cypress = eventManager.getCypress() - if (!Cypress) { - throw 'do something here. maybe save an empty snapshot?' - } - // go get the final cross origin snapshot. Do this optimistically while we render the selected snapshot Cypress.primaryOriginCommunicator.toAllSpecBridges('generate:final:snapshot', snapshotUrl) Cypress.primaryOriginCommunicator.once('final:snapshot:generated', (finalSnapshot) => { - // TODO: should be an opportunity to refactor based on whats in serialization postprocess for snapshots - finalSnapshot.body = postprocessLogLikeFromSerialization(finalSnapshot.body) - const reifiedSnapshot = Cypress.cy.createSnapshot(finalSnapshot.name, null, finalSnapshot) + const reifiedSnapshot = postprocessSnapshotFromSerialization(finalSnapshot) this.originalState = { body: reifiedSnapshot.body,