Get trace and video
Anoerak opened this issue · comments
Hi,
I tried without success to get the trace and video but only got the component and even the component is always the same page.
I have no idea of what I am doing wrong :(
package.json
"safetest": "cross-env OPT_URL=${OPT_URL:-http://localhost:10088/} react-scripts --inspect test --runInBand --testMatch '**/*.safetest.{j,t}s{,x}' --setupFilesAfterEnv ./setup-safetest.tsx --testTimeout=30000",
"safetest:ci:test": "OPT_URL=http://localhost:10088/ OPT_ARTIFACTS=artifacts.json OPT_DOCKER=1 OPT_CI=1 npm run safetest -- --watchAll=false --json --outputFile=results.json --bail=5 --ci=1",
"safetest:ci": "(npm run safetest:ci:test || true)",
"safetest:regenerate-screenshots": "npm run safetest -- --watchAll=false --docker=1 --update-snapshot",
"process:ci": "npx safetest add-artifact-info artifacts.json results.json && cp results.json ../../../JAWS_Project/jaws/public/js/fleet.json"
test
import { describe, it, expect } from "safetest/jest";
import { chromium } from "playwright";
describe("FleetConfig", () => {
it("should have a fleet config page", async () => {
const browser = await chromium.launch();
const context = await browser.newContext();
const page = await context.newPage();
await page.goto("http://localhost:10088/intranet/login/index");
await page
.locator('input[name="username"]')
.fill(process.env.JAWS_USERNAME);
await page
.locator('input[name="password"]')
.fill(process.env.JAWS_PASSWORD);
await page.locator('input[type="submit"]').click();
await page.goto("http://localhost:10088/fleet/config/");
expect(await page.locator("h5").count()).toBe(1);
expect(await page.locator("h5").innerText()).toBe("Fleet configuration");
await browser.close();
});
});
main
import { bootstrap } from "safetest/react";
import { Report } from "safetest/report";
const MyReport = () => {
return (
<Report
getTestUrl={(filename, test) => {
const relativeFile = `./${filename}`.replace(/\.[jt]sx?$/g, "");
const testName = test.trim().replace(/ /g, "+");
return `${process.env.DEPLOYED_URL}?test_path=${relativeFile}&test_name=${testName}`;
}}
renderArtifact={(type, path) => {
if (type === "video")
return (
<video
src={`${process.env.DEPLOYED_URL}${path}`}
controls
/>
);
// etc
}}
/>
);
};
You should be letting SafeTest open the browser since it tracks screenshots and videos internally, that's probably why you're not getting them. You page initialization should look like: const page = await render(/* .... */)
I'm not sure it's gonna work since my project is a small react app compile with webpack and running as a component of a bigger project using PHP and JS. So the react app can't render by itself.
As I wrote in an separate ticket, I've been working on something else for the past week but I about to jump back into this project since I really want to sort out how to set up safetest.
I'll keep you updated.
Thanks for your help :)