diff --git a/__playwright-tests__/archiving-assets.spec.ts b/__playwright-tests__/archiving-assets.spec.ts
index 09e05c12..7d308fae 100644
--- a/__playwright-tests__/archiving-assets.spec.ts
+++ b/__playwright-tests__/archiving-assets.spec.ts
@@ -1,5 +1,5 @@
import { test, expect } from '../src';
test('asset paths', async ({ page }) => {
- await page.goto('/asset-paths');
+ await page.goto('/asset-paths/');
});
diff --git a/__playwright-tests__/fixtures/asset-paths.html b/__playwright-tests__/fixtures/asset-paths.html
index 2a5b6980..6aa3c008 100644
--- a/__playwright-tests__/fixtures/asset-paths.html
+++ b/__playwright-tests__/fixtures/asset-paths.html
@@ -18,6 +18,7 @@
+
diff --git a/__playwright-tests__/server.js b/__playwright-tests__/server.js
index ffee332e..cf3e1606 100644
--- a/__playwright-tests__/server.js
+++ b/__playwright-tests__/server.js
@@ -59,6 +59,10 @@ app.get('/img/another', (req, res) => {
res.sendFile(path.join(__dirname, 'fixtures/pink.png'));
});
+app.get('/asset-paths/relative/purple.png', (req, res) => {
+ res.sendFile(path.join(__dirname, 'fixtures/purple.png'));
+});
+
app.get('/background-img.png', (req, res) => {
res.sendFile(path.join(__dirname, 'fixtures/purple.png'));
});
diff --git a/package.json b/package.json
index 49743e64..02d1fe31 100644
--- a/package.json
+++ b/package.json
@@ -48,7 +48,6 @@
"@babel/preset-react": "^7.18.6",
"@babel/preset-typescript": "^7.21.4",
"@chromaui/archive-storybook": "^0.0.15",
- "@chromaui/test-archiver": "^0.0.32",
"@jest/types": "^27.0.6",
"@playwright/test": "^1.39.0",
"@storybook/addon-essentials": "^7.5.2",
@@ -97,10 +96,10 @@
"access": "public"
},
"dependencies": {
- "@chromaui/rrweb-snapshot": "2.0.0-alpha.7-noAbsolute.2",
"@segment/analytics-node": "^1.1.0",
"fs-extra": "^11.1.1",
"mime": "^3.0.0",
+ "rrweb-snapshot": "^2.0.0-alpha.4",
"ts-dedent": "^2.2.0"
},
"peerDependencies": {
diff --git a/src/cypress-api/commands.ts b/src/cypress-api/commands.ts
index 70f7a8f7..dc3ae887 100644
--- a/src/cypress-api/commands.ts
+++ b/src/cypress-api/commands.ts
@@ -1,10 +1,10 @@
-import { snapshot } from '@chromaui/rrweb-snapshot';
-import type { elementNode } from '@chromaui/rrweb-snapshot';
+import { snapshot } from 'rrweb-snapshot';
+import type { elementNode } from 'rrweb-snapshot';
// @ts-expect-error will fix when Cypress has its own package
Cypress.Commands.add('takeChromaticArchive', () => {
cy.document().then((doc) => {
// here, handle the source map
- const manualSnapshot = snapshot(doc, { noAbsolute: true });
+ const manualSnapshot = snapshot(doc);
// reassign manualSnapshots so it includes this new snapshot
cy.get('@manualSnapshots')
// @ts-expect-error will fix when Cypress has its own package
diff --git a/src/cypress-api/index.ts b/src/cypress-api/index.ts
index 152d6002..194d21d2 100644
--- a/src/cypress-api/index.ts
+++ b/src/cypress-api/index.ts
@@ -1,4 +1,4 @@
-import type { elementNode } from '@chromaui/rrweb-snapshot';
+import type { elementNode } from 'rrweb-snapshot';
import { writeTestResult } from '../write-archive';
import type { ChromaticStorybookParameters } from '../types';
import type { ResourceArchive } from '../resource-archive';
diff --git a/src/cypress-api/support.ts b/src/cypress-api/support.ts
index 373ac9b7..a615fed6 100644
--- a/src/cypress-api/support.ts
+++ b/src/cypress-api/support.ts
@@ -1,4 +1,4 @@
-import { snapshot } from '@chromaui/rrweb-snapshot';
+import { snapshot } from 'rrweb-snapshot';
import type { ResourceArchive } from '../resource-archive';
import './commands';
@@ -55,7 +55,7 @@ const completeArchive = () => {
cy.get('@archive').then((archive) => {
// can we be sure this always fires after all the requests are back?
cy.document().then((doc) => {
- const snap = snapshot(doc, { noAbsolute: true });
+ const snap = snapshot(doc);
// @ts-expect-error will fix when Cypress has its own package
cy.get('@manualSnapshots').then((manualSnapshots = []) => {
// pass the snapshot to the server to write to disk
diff --git a/src/playwright-api/takeArchive.ts b/src/playwright-api/takeArchive.ts
index 8f1c6d3e..6ab3abda 100644
--- a/src/playwright-api/takeArchive.ts
+++ b/src/playwright-api/takeArchive.ts
@@ -1,15 +1,12 @@
import type { Page, TestInfo } from '@playwright/test';
import { readFileSync } from 'fs';
-import type { elementNode } from '@chromaui/rrweb-snapshot';
+import type { elementNode } from 'rrweb-snapshot';
import dedent from 'ts-dedent';
import { logger } from '../utils/logger';
-const rrweb = readFileSync(
- require.resolve('@chromaui/rrweb-snapshot/dist/rrweb-snapshot.js'),
- 'utf8'
-);
+const rrweb = readFileSync(require.resolve('rrweb-snapshot/dist/rrweb-snapshot.js'), 'utf8');
export const contentType = 'application/rrweb.snapshot+json';
@@ -39,7 +36,7 @@ async function takeArchive(
// Serialize and capture the DOM
const domSnapshot: elementNode = await page.evaluate(dedent`
${rrweb};
- rrwebSnapshot.snapshot(document, { noAbsolute: true });
+ rrwebSnapshot.snapshot(document);
`);
testInfo.attach(name, { contentType, body: JSON.stringify(domSnapshot) });
diff --git a/src/write-archive/archive-file.test.ts b/src/write-archive/archive-file.test.ts
index c43aa000..bee034a1 100644
--- a/src/write-archive/archive-file.test.ts
+++ b/src/write-archive/archive-file.test.ts
@@ -78,7 +78,7 @@ describe('ArchiveFile', () => {
archiveFile.toFileSystemPath();
const originalSrc = archiveFile.originalSrc();
- expect(originalSrc).toEqual('/some/directory/ok?src=some-other-url');
+ expect(originalSrc).toEqual('http://localhost:333/some/directory/ok?src=some-other-url');
});
});
});
diff --git a/src/write-archive/archive-file.ts b/src/write-archive/archive-file.ts
index 6cf422fc..a69276d4 100644
--- a/src/write-archive/archive-file.ts
+++ b/src/write-archive/archive-file.ts
@@ -30,8 +30,7 @@ export class ArchiveFile {
}
originalSrc() {
- // Assets that we capture will be stripped of the domain in the source
- return `${this.url.pathname}${this.url.search}`;
+ return this.url.toString();
}
toFileSystemPath() {
diff --git a/src/write-archive/dom-snapshot.ts b/src/write-archive/dom-snapshot.ts
index c9b1927b..5251386d 100644
--- a/src/write-archive/dom-snapshot.ts
+++ b/src/write-archive/dom-snapshot.ts
@@ -1,7 +1,7 @@
/* eslint-disable no-underscore-dangle */
/* eslint-disable no-param-reassign */
-import type { serializedNodeWithId } from '@chromaui/rrweb-snapshot';
-import { NodeType } from '@chromaui/rrweb-snapshot';
+import type { serializedNodeWithId } from 'rrweb-snapshot';
+import { NodeType } from 'rrweb-snapshot';
// Matches `url(...)` function in CSS text, excluding data URLs
const CSS_URL_REGEX = /url\((?!['"]?(?:data):)['"]?([^'")]*)['"]?\)/gi;
diff --git a/src/write-archive/index.test.ts b/src/write-archive/index.test.ts
index 34dee891..aadfcb3b 100644
--- a/src/write-archive/index.test.ts
+++ b/src/write-archive/index.test.ts
@@ -1,7 +1,7 @@
import fs from 'fs-extra';
import { resolve } from 'path';
import type { TestInfo } from '@playwright/test';
-import { NodeType } from '@chromaui/rrweb-snapshot';
+import { NodeType } from 'rrweb-snapshot';
import { writeTestResult } from '.';
jest.mock('fs-extra');
@@ -11,13 +11,13 @@ const snapshotJson = {
{
type: NodeType.Element,
attributes: {
- src: '/home/',
+ src: 'http://localhost:3000/home/',
},
},
{
type: NodeType.Element,
attributes: {
- src: '/img?src=some-path',
+ src: 'http://localhost:3000/img?src=some-path',
},
},
],
diff --git a/yarn.lock b/yarn.lock
index f2a5b144..7888ae01 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2052,17 +2052,6 @@
resolved "https://registry.npmjs.org/@chromaui/rrweb-snapshot/-/rrweb-snapshot-2.0.0-alpha.7-noAbsolute.2.tgz"
integrity sha512-vOVSOgfNyxomxm6ENMqm1C4rLkLLOlyEyhR5J2SKBALuFfuJHjhIqNLSOgqVRO9J3++AUOCktknyJ/F+mSvEfA==
-"@chromaui/test-archiver@^0.0.32":
- version "0.0.32"
- resolved "https://registry.yarnpkg.com/@chromaui/test-archiver/-/test-archiver-0.0.32.tgz#6e0560b39108581b9d3d55d3f5e462350b3cda9c"
- integrity sha512-O6le42KqoliioAQG2RY+XhrwSttwnYHV2lIk3TNKJ1l9sTjQT5AUAZJ6N4CkUAsU8TVtX8wEDUY0mrNL00M/DQ==
- dependencies:
- "@chromaui/rrweb-snapshot" "2.0.0-alpha.7-noAbsolute.2"
- "@segment/analytics-node" "^1.1.0"
- fs-extra "^11.1.1"
- mime "^3.0.0"
- ts-dedent "^2.2.0"
-
"@colors/colors@1.5.0":
version "1.5.0"
resolved "https://registry.yarnpkg.com/@colors/colors/-/colors-1.5.0.tgz#bb504579c1cae923e6576a4f5da43d25f97bdbd9"
@@ -11571,6 +11560,11 @@ rollup@^3.2.5:
optionalDependencies:
fsevents "~2.3.2"
+rrweb-snapshot@^2.0.0-alpha.4:
+ version "2.0.0-alpha.4"
+ resolved "https://registry.yarnpkg.com/rrweb-snapshot/-/rrweb-snapshot-2.0.0-alpha.4.tgz#2801bf5946177b9d685a01661a62d9d2e958f174"
+ integrity sha512-KQ2OtPpXO5jLYqg1OnXS/Hf+EzqnZyP5A+XPqBCjYpj3XIje/Od4gdUwjbFo3cVuWq5Cw5Y1d3/xwgIS7/XpQQ==
+
run-parallel@^1.1.9:
version "1.2.0"
resolved "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz"
