https://github.com/fdiskas/devtalks-e2e
https://github.com/fdiskas/devtalks-e2e
Last synced: 11 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/fdiskas/devtalks-e2e
- Owner: FDiskas
- Created: 2020-12-01T19:24:35.000Z (over 5 years ago)
- Default Branch: testcafe
- Last Pushed: 2024-06-26T09:06:53.000Z (almost 2 years ago)
- Last Synced: 2025-02-28T10:16:58.284Z (over 1 year ago)
- Language: TypeScript
- Size: 1.06 MB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# e2e testing frameworks overview - testcafe & cypress
## Setup project steps
1. `yarn create next-app --example with-typescript .`
1. `git init`
### Setup testcafe framework
1. `git checkout -b testcafe`
1. `yarn add -D testcafe testcafe-react-selectors` more info on [testcafe-react-selectors](https://github.com/DevExpress/testcafe-react-selectors)
1. create new file `.vscode/launch.json`
```json
{
"type": "node",
"protocol": "inspector",
"request": "launch",
"name": "Launch test files with TestCafe",
"program": "${workspaceRoot}/node_modules/testcafe/bin/testcafe.js",
"args": ["chrome", "${relativeFile}"],
"console": "integratedTerminal",
"cwd": "${workspaceRoot}"
}
```
1. Create test file `tests/main.ts`
```ts
import { Selector } from "testcafe";
fixture`Getting Started`
.page`http://devexpress.github.io/testcafe/example`;
test("My first test", async t => {
await t
.typeText("#developer-name", "John Smith")
.click("#submit-button")
// Use the assertion to check if the actual header text is equal to the expected one
.expect(Selector("#article-header").innerText)
.eql("Thank you, John Smith!");
});
```
### Good to know
- Run mobile version `testcafe "chrome:emulation:device=iphone X" tests/sample-fixture.js`
- `-S`, `--screenshots-on-fails` take a screenshot whenever a test fails