diff --git a/src/services/agent-service.ts b/src/services/agent-service.ts index ce1f4472..722eb612 100644 --- a/src/services/agent-service.ts +++ b/src/services/agent-service.ts @@ -77,6 +77,7 @@ export class AgentService { profile('agentService.handleSnapshot') // truncate domSnapshot for the logs if it's very large + const rootURL = request.body.url let domSnapshotLog = request.body.domSnapshot if (domSnapshotLog.length > Constants.MAX_LOG_LENGTH) { domSnapshotLog = domSnapshotLog.substring(0, Constants.MAX_LOG_LENGTH) @@ -116,7 +117,7 @@ export class AgentService { } let resources = await this.snapshotService.buildResources( - request.body.url, + rootURL, domSnapshot, snapshotOptions, snapshotLogger, @@ -133,9 +134,9 @@ export class AgentService { } resources = resources.concat( - this.snapshotService.buildRootResource(request.body.url, domSnapshot), + this.snapshotService.buildRootResource(rootURL, domSnapshot), // @ts-ignore we won't write anything if css is not is passed - this.snapshotService.buildPercyCSSResource(percyCSSFileName, snapshotOptions.percyCSS, snapshotLogger), + this.snapshotService.buildPercyCSSResource(rootURL, percyCSSFileName, snapshotOptions.percyCSS, snapshotLogger), this.snapshotService.buildLogResource(snapshotLog), ) diff --git a/src/services/snapshot-service.ts b/src/services/snapshot-service.ts index d849c8bf..d40231c6 100644 --- a/src/services/snapshot-service.ts +++ b/src/services/snapshot-service.ts @@ -2,6 +2,7 @@ import * as crypto from 'crypto' import * as fs from 'fs' import * as os from 'os' import * as path from 'path' +import { URL } from 'url' import { AssetDiscoveryConfiguration } from '../configuration/asset-discovery-configuration' import { SnapshotOptions } from '../percy-agent-client/snapshot-options' import { logError, profile } from '../utils/logger' @@ -65,9 +66,13 @@ export default class SnapshotService extends PercyClientService { }) } - buildPercyCSSResource(fileName: string, css: string, logger: any) { + buildPercyCSSResource(url: string, fileName: string, css: string, logger: any) { if (!css) { return [] } - logger.debug(`Creating Percy Specific file: ${fileName}. CSS string: ${css}`) + + const parsedRootResourceUrl = new URL(url) + const rootURL = `${parsedRootResourceUrl.protocol}//${parsedRootResourceUrl.host}` + + logger.debug(`Creating Percy Specific file: ${fileName}. Root URL: ${rootURL}. CSS string: ${css}`) const buffer = Buffer.from(css, 'utf8') const sha = crypto.createHash('sha256').update(buffer).digest('hex') @@ -81,7 +86,7 @@ export default class SnapshotService extends PercyClientService { } return this.percyClient.makeResource({ - resourceUrl: `/${fileName}`, + resourceUrl: `${rootURL}/${fileName}`, mimetype: 'text/css', localPath, sha,