Skip to content

Commit 43e41a2

Browse files
javierlopezdeancosjavierlopezdeancos
authored
Update playwright image version (#7)
* chore: update testcontainers-node to 10.9.0 * chore: update playwright default image to 1.43.1 * 0.2.0 * chore: update playwright container image version * fix: fix runnin g test * docs: add blob report section new documentation
1 parent 12c6898 commit 43e41a2

File tree

3 files changed

+67
-45
lines changed

3 files changed

+67
-45
lines changed

‎README.md‎

Lines changed: 26 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,8 @@
44
![NPM Version](https://img.shields.io/npm/v/testcontainers-node-playwright)
55
![GitHub License](https://img.shields.io/github/license/javierlopezdeancos/testcontainers-node-playwright)
66

7-
![Testcontainers logo](https://avatars.githubusercontent.com/u/13393021?s=48&v=4)
8-
<img src="https://em-content.zobj.net/source/apple/391/performing-arts_1f3ad.png" alt="playwright logo" width="50"/>
7+
![Testcontainers logo](https://avatars.githubusercontent.com/u/13393021?s=48&v=4)
8+
<img src="https://playwright.dev/img/playwright-logo.svg" alt="playwright logo" width="50"/>
99

1010
Playwright module for [Testcontainers](https://testcontainers.com/)
1111

@@ -54,6 +54,7 @@ Playwright documentation in the [Playwright official site](https://playwright.de
5454
- [ ] Debugging Playwright tests with the Playwright inspector in a Playwright container.
5555

5656
## Installation
57+
5758
```bash
5859
npm install testcontainers-node-playwright --save-dev
5960
```
@@ -69,7 +70,7 @@ that you can review to choose a tag.
6970
import path from "path";
7071
import { PlaywrightContainer } from "@testcontainers/playwright";
7172

72-
const PLAYWRIGHT_IMAGE = "mcr.microsoft.com/playwright:v1.42.1-jammy";
73+
const PLAYWRIGHT_IMAGE = "mcr.microsoft.com/playwright:v1.44.0-jammy";
7374
const PLAYWRIGHT_PROJECT_TESTS_TO_RUN_INTO_THE_CONTAINER = path.resolve(__dirname, "..", "example-project");
7475

7576
const startedPlaywrightContainer = await new PlaywrightContainer(
@@ -82,10 +83,10 @@ const startedPlaywrightContainer = await new PlaywrightContainer(
8283

8384
```typescript
8485
const { output, exitCode } = await startedPlaywrightBuildInReporterContainer.exec([
85-
"npx",
86-
"playwright",
87-
"test",
88-
]);
86+
"npx",
87+
"playwright",
88+
"test",
89+
]);
8990
```
9091

9192
### Reporter
@@ -104,7 +105,7 @@ class passing the type of reporter to extract and where do you want to extract i
104105
import path from "path";
105106
import { PlaywrightContainer } from "@testcontainers/playwright";
106107

107-
const PLAYWRIGHT_IMAGE = "mcr.microsoft.com/playwright:v1.42.1-jammy";
108+
const PLAYWRIGHT_IMAGE = "mcr.microsoft.com/playwright:v1.44.0-jammy";
108109
const PLAYWRIGHT_PROJECT_TESTS_TO_RUN_INTO_THE_CONTAINER = path.resolve(__dirname, "..", "example-project");
109110

110111
const startedPlaywrightContainer = await new PlaywrightContainer(
@@ -126,7 +127,7 @@ const { output, exitCode } = await startedPlaywrightBuildInReporterContainer.exe
126127
import path from "path";
127128
import { PlaywrightContainer } from "@testcontainers/playwright";
128129

129-
const PLAYWRIGHT_IMAGE = "mcr.microsoft.com/playwright:v1.42.1-jammy";
130+
const PLAYWRIGHT_IMAGE = "mcr.microsoft.com/playwright:v1.44.0-jammy";
130131
const PLAYWRIGHT_PROJECT_TESTS_TO_RUN_INTO_THE_CONTAINER = path.resolve(__dirname, "..", "example-project");
131132

132133
const startedPlaywrightContainer = await new PlaywrightContainer(
@@ -148,7 +149,7 @@ const { output, exitCode } = await startedPlaywrightBuildInReporterContainer.exe
148149
import path from "path";
149150
import { PlaywrightContainer } from "@testcontainers/playwright";
150151

151-
const PLAYWRIGHT_IMAGE = "mcr.microsoft.com/playwright:v1.42.1-jammy";
152+
const PLAYWRIGHT_IMAGE = "mcr.microsoft.com/playwright:v1.44.0-jammy";
152153
const PLAYWRIGHT_PROJECT_TESTS_TO_RUN_INTO_THE_CONTAINER = path.resolve(__dirname, "..", "example-project");
153154
const PLAYWRIGHT_SAVE_REPORTS_DIRECTORY = path.resolve(__dirname, "..", "example-reports");
154155

@@ -176,7 +177,7 @@ await startedPlaywrightContainer.saveReporter("html", externalDestinationReporte
176177
import path from "path";
177178
import { PlaywrightContainer } from "@testcontainers/playwright";
178179

179-
const PLAYWRIGHT_IMAGE = "mcr.microsoft.com/playwright:v1.42.1-jammy";
180+
const PLAYWRIGHT_IMAGE = "mcr.microsoft.com/playwright:v1.44.0-jammy";
180181
const PLAYWRIGHT_PROJECT_TESTS_TO_RUN_INTO_THE_CONTAINER = path.resolve(__dirname, "..", "example-project");
181182
const PLAYWRIGHT_SAVE_REPORTS_DIRECTORY = path.resolve(__dirname, "..", "example-reports");
182183

@@ -200,11 +201,20 @@ await startedPlaywrightContainer.saveReporter("json", externalDestinationReporte
200201

201202
#### Execute tests in a Playwright container with default configuration and extract a blob reporter with results
202203

204+
This functionality get some changes from [v1.44.0](https://github.com/javierlopezdeancos/testcontainers-node-playwright/pull/7#:~:text=at%20the%20changelog-,v1.44.0,-to%20the%20new) version or Playwright that introduce the blob report filename generation automatically adding a hash.
205+
206+
You can read more about in the official [blob-reporter](https://playwright.dev/docs/test-reporters#blob-reporter) playwright documentation section.
207+
208+
Those changes are reflected in the [PR #7](https://github.com/javierlopezdeancos/testcontainers-node-playwright/pull/7), taking a a workaround to get the blob reporter output filename for now, but that obviously will be removed in the future.
209+
210+
> [!CAUTION]
211+
> This approach implies that you need to set the `PLAYWRIGHT_BLOB_OUTPUT_NAME` environment variable in the container with the name of the blob output file that you want to generate to be fixed and recoverable without need to read any `report-{hash}.zip` filename.
212+
203213
```typescript
204214
import path from "path";
205215
import { PlaywrightContainer } from "@testcontainers/playwright";
206216

207-
const PLAYWRIGHT_IMAGE = "mcr.microsoft.com/playwright:v1.42.1-jammy";
217+
const PLAYWRIGHT_IMAGE = "mcr.microsoft.com/playwright:v1.44.0-jammy";
208218
const PLAYWRIGHT_PROJECT_TESTS_TO_RUN_INTO_THE_CONTAINER = path.resolve(__dirname, "..", "example-project");
209219
const PLAYWRIGHT_SAVE_REPORTS_DIRECTORY = path.resolve(__dirname, "..", "example-reports");
210220

@@ -214,6 +224,7 @@ const startedPlaywrightContainer = await new PlaywrightContainer(
214224
PLAYWRIGHT_IMAGE,
215225
PLAYWRIGHT_PROJECT_TESTS_TO_RUN_INTO_THE_CONTAINER
216226
)
227+
.withEnvironment({ PLAYWRIGHT_BLOB_OUTPUT_NAME: "report.zip" })
217228
.start();
218229

219230
const { output, exitCode } = await startedPlaywrightContainer.exec([
@@ -225,13 +236,14 @@ const { output, exitCode } = await startedPlaywrightContainer.exec([
225236

226237
await startedPlaywrightContainer.saveReporter("blob", externalDestinationReporterPath);
227238
```
239+
228240
#### Execute tests in a Playwright container with default configuration and extract a junit reporter with results
229241

230242
```typescript
231243
import path from "path";
232244
import { PlaywrightContainer } from "@testcontainers/playwright";
233245

234-
const PLAYWRIGHT_IMAGE = "mcr.microsoft.com/playwright:v1.42.1-jammy";
246+
const PLAYWRIGHT_IMAGE = "mcr.microsoft.com/playwright:v1.44.0-jammy";
235247
const PLAYWRIGHT_PROJECT_TESTS_TO_RUN_INTO_THE_CONTAINER = path.resolve(__dirname, "..", "example-project");
236248
const PLAYWRIGHT_SAVE_REPORTS_DIRECTORY = path.resolve(__dirname, "..", "example-reports");
237249

@@ -255,8 +267,7 @@ await startedPlaywrightContainer.saveReporter("junit", externalDestinationReport
255267

256268
### Trace viewer
257269

258-
Review the [Playwright trace viewer documentation](https://playwright.dev/docs/trace-viewer-intro) in order to know the available reporters and how you can notify
259-
playwright which should be run and how.
270+
Review the [Playwright trace viewer documentation](https://playwright.dev/docs/trace-viewer-intro) in order to know the available reporters and how you can notify playwright which should be run and how.
260271

261272
#### Execute tests in a playwright container with default configuration that should fail and extract the trace viewer zip file
262273

@@ -289,4 +300,3 @@ await startedPlaywrightContainer.saveTraceViewer(
289300

290301
await startedPlaywrightContainer.stop();
291302
```
292-

‎src/playwright-container.test.ts‎

Lines changed: 22 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,18 @@
11
import path from "node:path";
22
import { existsSync } from "node:fs";
3-
import { PlaywrightContainer, BROWSER } from "./playwright-container";
3+
import {
4+
PlaywrightContainer,
5+
BROWSER,
6+
DEFAULT_PLAYWRIGHT_CONTAINER_IMAGE,
7+
DEFAULT_HTML_REPORTER_OUTPUT_DIRECTORY,
8+
DEFAULT_JSON_REPORTER_FILE,
9+
DEFAULT_BLOB_REPORTER_FILE,
10+
DEFAULT_JUNIT_REPORTER_FILE,
11+
} from "./playwright-container";
412

513
describe("PlaywrightContainer", () => {
614
jest.setTimeout(180_000);
715

8-
const PLAYWRIGHT_IMAGE = "mcr.microsoft.com/playwright:v1.43.1-jammy";
916
const EXTERNAL_PLAYWRIGHT_SAVE_REPORTS_DIRECTORY = path.resolve(__dirname, "..", "example-reports");
1017
const EXTERNAL_PLAYWRIGHT_SAVE_TRACES_DIRECTORY = path.resolve(__dirname, "..", "example-results");
1118
const EXTERNAL_PLAYWRIGHT_PROJECT_DIRECTORY = path.resolve(__dirname, "example-project");
@@ -17,7 +24,7 @@ describe("PlaywrightContainer", () => {
1724

1825
it(`should pass example tests with a dot build in reporter`, async () => {
1926
const startedPlaywrightBuildInReporterContainer = await new PlaywrightContainer(
20-
PLAYWRIGHT_IMAGE,
27+
DEFAULT_PLAYWRIGHT_CONTAINER_IMAGE,
2128
EXTERNAL_PLAYWRIGHT_PROJECT_DIRECTORY,
2229
).start();
2330

@@ -38,7 +45,7 @@ describe("PlaywrightContainer", () => {
3845

3946
it(`should pass example tests with a line build in reporter`, async () => {
4047
const startedPlaywrightBuildInReporterContainer = await new PlaywrightContainer(
41-
PLAYWRIGHT_IMAGE,
48+
DEFAULT_PLAYWRIGHT_CONTAINER_IMAGE,
4249
EXTERNAL_PLAYWRIGHT_PROJECT_DIRECTORY,
4350
).start();
4451

@@ -61,10 +68,10 @@ describe("PlaywrightContainer", () => {
6168
const externalDestinationReporterPath = path.resolve(EXTERNAL_PLAYWRIGHT_SAVE_REPORTS_DIRECTORY, "index.html");
6269

6370
const startedPlaywrightContainer = await new PlaywrightContainer(
64-
PLAYWRIGHT_IMAGE,
71+
DEFAULT_PLAYWRIGHT_CONTAINER_IMAGE,
6572
EXTERNAL_PLAYWRIGHT_PROJECT_DIRECTORY,
6673
)
67-
.withEnvironment({ PLAYWRIGHT_HTML_REPORT: "test-reports" })
74+
.withEnvironment({ PLAYWRIGHT_HTML_REPORT: DEFAULT_HTML_REPORTER_OUTPUT_DIRECTORY })
6875
.start();
6976

7077
const { output, exitCode } = await startedPlaywrightContainer.exec([
@@ -91,10 +98,10 @@ describe("PlaywrightContainer", () => {
9198
const externalDestinationReporterPath = path.resolve(EXTERNAL_PLAYWRIGHT_SAVE_REPORTS_DIRECTORY, "results.json");
9299

93100
const startedPlaywrightContainer = await new PlaywrightContainer(
94-
PLAYWRIGHT_IMAGE,
101+
DEFAULT_PLAYWRIGHT_CONTAINER_IMAGE,
95102
EXTERNAL_PLAYWRIGHT_PROJECT_DIRECTORY,
96103
)
97-
.withEnvironment({ PLAYWRIGHT_JSON_OUTPUT_NAME: "results.json" })
104+
.withEnvironment({ PLAYWRIGHT_JSON_OUTPUT_NAME: DEFAULT_JSON_REPORTER_FILE })
98105
.start();
99106

100107
const { output, exitCode } = await startedPlaywrightContainer.exec([
@@ -121,9 +128,11 @@ describe("PlaywrightContainer", () => {
121128
);
122129

123130
const startedPlaywrightContainer = await new PlaywrightContainer(
124-
PLAYWRIGHT_IMAGE,
131+
DEFAULT_PLAYWRIGHT_CONTAINER_IMAGE,
125132
EXTERNAL_PLAYWRIGHT_PROJECT_DIRECTORY,
126-
).start();
133+
)
134+
.withEnvironment({ PLAYWRIGHT_BLOB_OUTPUT_NAME: DEFAULT_BLOB_REPORTER_FILE })
135+
.start();
127136

128137
const { output, exitCode } = await startedPlaywrightContainer.exec([
129138
"npx",
@@ -146,10 +155,10 @@ describe("PlaywrightContainer", () => {
146155
const externalDestinationReporterPath = path.resolve(EXTERNAL_PLAYWRIGHT_SAVE_REPORTS_DIRECTORY, `results.xml`);
147156

148157
const startedPlaywrightContainer = await new PlaywrightContainer(
149-
PLAYWRIGHT_IMAGE,
158+
DEFAULT_PLAYWRIGHT_CONTAINER_IMAGE,
150159
EXTERNAL_PLAYWRIGHT_PROJECT_DIRECTORY,
151160
)
152-
.withEnvironment({ PLAYWRIGHT_JUNIT_OUTPUT_NAME: "results.xml" })
161+
.withEnvironment({ PLAYWRIGHT_JUNIT_OUTPUT_NAME: DEFAULT_JUNIT_REPORTER_FILE })
153162
.start();
154163

155164
const { output, exitCode } = await startedPlaywrightContainer.exec([
@@ -171,7 +180,7 @@ describe("PlaywrightContainer", () => {
171180

172181
it("should fail example test creating a trace viewer by browser on first retry", async () => {
173182
const startedPlaywrightContainer = await new PlaywrightContainer(
174-
PLAYWRIGHT_IMAGE,
183+
DEFAULT_PLAYWRIGHT_CONTAINER_IMAGE,
175184
EXTERNAL_PLAYWRIGHT_PROJECT_DIRECTORY,
176185
).start();
177186

‎src/playwright-container.ts‎

Lines changed: 19 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -14,15 +14,18 @@ import {
1414
log,
1515
} from "testcontainers";
1616

17-
const CONTAINER_WORKING_DIRECTORY = "/playwright";
18-
const DEFAULT_JSON_REPORTER_FILE = "results.json";
19-
const DEFAULT_HTML_REPORTER_OUTPUT_DIRECTORY = "test-reports";
20-
const DEFAULT_HTML_REPORTER_FILE = "index.html";
21-
const DEFAULT_BLOB_REPORTER_FILE = "report.zip";
22-
const DEFAULT_BLOB_REPORTER_OUTPUT_DIRECTORY = "blob-report";
23-
const DEFAULT_JUNIT_REPORTER_FILE = "results.xml";
24-
const DEFAULT_TRACE_VIEWER_OUTPUT_DIRECTORY = "test-results";
25-
const DEFAULT_TRACE_VIEWER_FILE = "trace.zip";
17+
export const DEFAULT_PLAYWRIGHT_CONTAINER_IMAGE = "mcr.microsoft.com/playwright:v1.44.0-jammy";
18+
19+
export const CONTAINER_WORKING_DIRECTORY = "/playwright";
20+
21+
export const DEFAULT_JSON_REPORTER_FILE = "results.json";
22+
export const DEFAULT_HTML_REPORTER_OUTPUT_DIRECTORY = "test-reports";
23+
export const DEFAULT_HTML_REPORTER_FILE = "index.html";
24+
export const DEFAULT_BLOB_REPORTER_FILE = "report.zip";
25+
export const DEFAULT_BLOB_REPORTER_OUTPUT_DIRECTORY = "blob-report";
26+
export const DEFAULT_JUNIT_REPORTER_FILE = "results.xml";
27+
export const DEFAULT_TRACE_VIEWER_OUTPUT_DIRECTORY = "test-results";
28+
export const DEFAULT_TRACE_VIEWER_FILE = "trace.zip";
2629

2730
export const BROWSER = {
2831
CHROMIUM: "chromium",
@@ -43,7 +46,7 @@ type ExportableReporterType = (typeof EXPORTABLE_REPORTER_TYPE)[keyof typeof EXP
4346

4447
export class PlaywrightContainer extends GenericContainer {
4548
constructor(
46-
image = "mcr.microsoft.com/playwright:v1.43.1-jammy",
49+
image = DEFAULT_PLAYWRIGHT_CONTAINER_IMAGE,
4750
externalPlaywrightTestsDirectoryToCopyIntoContainerWorkingDirectory: string,
4851
) {
4952
super(image);
@@ -129,32 +132,32 @@ export class StartedPlaywrightContainer extends AbstractStartedContainer {
129132
return "";
130133
}
131134

132-
private getReporterPath(exportableReporterType: ExportableReporterType): string {
135+
private getContainerReporterPath(exportableReporterType: ExportableReporterType): string {
133136
if (exportableReporterType === EXPORTABLE_REPORTER_TYPE.HTML) {
134137
return path.format({
135138
root: "/ignored",
136139
dir: `${CONTAINER_WORKING_DIRECTORY}/${DEFAULT_HTML_REPORTER_OUTPUT_DIRECTORY}`,
137-
base: DEFAULT_HTML_REPORTER_FILE,
140+
base: this.getContainerReporterFile(EXPORTABLE_REPORTER_TYPE.HTML),
138141
});
139142
}
140143

141144
if (exportableReporterType === EXPORTABLE_REPORTER_TYPE.JSON) {
142-
return path.join(CONTAINER_WORKING_DIRECTORY, DEFAULT_JSON_REPORTER_FILE);
145+
return path.join(CONTAINER_WORKING_DIRECTORY, this.getContainerReporterFile(EXPORTABLE_REPORTER_TYPE.JSON));
143146
}
144147

145148
if (exportableReporterType === EXPORTABLE_REPORTER_TYPE.BLOB) {
146149
return path.format({
147150
root: "/ignored",
148151
dir: `${CONTAINER_WORKING_DIRECTORY}/${DEFAULT_BLOB_REPORTER_OUTPUT_DIRECTORY}`,
149-
base: DEFAULT_BLOB_REPORTER_FILE,
152+
base: this.getContainerReporterFile(EXPORTABLE_REPORTER_TYPE.BLOB),
150153
});
151154
}
152155

153156
// if exportable reporter type is junit
154157
return path.format({
155158
root: "/ignored",
156159
dir: `${CONTAINER_WORKING_DIRECTORY}`,
157-
base: DEFAULT_JUNIT_REPORTER_FILE,
160+
base: this.getContainerReporterFile(EXPORTABLE_REPORTER_TYPE.JUNIT),
158161
});
159162
}
160163

@@ -180,7 +183,7 @@ export class StartedPlaywrightContainer extends AbstractStartedContainer {
180183
): Promise<void> {
181184
try {
182185
const containerId = this.getId();
183-
const reporterPath = this.getReporterPath(exportableReporterType);
186+
const reporterPath = this.getContainerReporterPath(exportableReporterType);
184187

185188
log.debug("Extracting archive from container...", { containerId });
186189
const archiveStream = await this.copyArchiveFromContainer(reporterPath);

0 commit comments

Comments
 (0)