You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
[](https://github.com/serenity-js/serenity-js)
5
-
[](https://stackoverflow.com/questions/tagged/serenity-js)
6
-
[](https://gitpod.io/from-referrer/)
7
4
8
-
[](https://www.linkedin.com/company/serenity-js)
9
-
[](https://www.youtube.com/@serenity-js)
10
-
[](https://matrix.to/#/#serenity-js:gitter.im)
11
-
[](https://github.com/sponsors/serenity-js)
12
-
13
-
Use this [template repository](https://help.github.com/en/articles/creating-a-repository-from-a-template)
14
-
to get started with testing your [React](https://react.dev/) components using [Serenity/JS](https://serenity-js.org),
15
-
[Playwright](https://playwright.dev/) and [Playwright Component Test](https://playwright.dev/docs/test-components).
5
+
This [template](https://help.github.com/en/articles/creating-a-repository-from-a-template) helps you test
6
+
[React](https://react.dev/) components using [Serenity/JS](https://serenity-js.org) and the [Playwright Test](https://playwright.dev/) runner in [Component-Test mode](https://playwright.dev/docs/test-components), with a fully configured TypeScript setup.
16
7
17
-
Learn more:
18
-
-[Serenity BDD reports for this project](https://serenity-js.github.io/serenity-js-playwright-ct-react-template/serenity/)
19
-
-[Playwright Test reports for this project](https://serenity-js.github.io/serenity-js-playwright-ct-react-template/playwright/)
20
-
-[Serenity/JS website, tutorials, and API docs](https://serenity-js.org/)
- Example React components and corresponding tests
12
+
- Linting and CI-friendly scripts
13
+
- Ready-to-use GitHub Codespaces environment using the official [Serenity/JS Docker image](https://serenity-js.org/handbook/integration/docker/) for quick exploration
14
+
- Integrated reporting via Serenity BDD and Playwright, with live examples:
-[Playwright Test report](https://serenity-js.github.io/serenity-js-playwright-ct-react-template/playwright/)
23
17
24
-
This repository is a GitHub template. You can use it to [create a new GitHub repository](https://help.github.com/en/articles/creating-a-repository-from-a-template), [clone it to your computer](https://docs.github.com/en/free-pro-team@latest/github/creating-cloning-and-archiving-repositories/cloning-a-repository).
18
+
## Quick Start
25
19
26
-
You can also launch it in a virtual Gitpod workspace without having to install anything on your machine:
20
+
### Explore instantly in GitHub Codespaces
27
21
28
-
[](https://gitpod.io/from-referrer/)
22
+
Launch this project in an online development environment:
29
23
30
-
### Installation
24
+
[](https://github.com/codespaces/new?ref=main&repo=serenity-js/serenity-js-playwright-ct-react-template)
31
25
32
-
To use this project on your machine, you'll need:
33
-
- Node.js, a Long-Term Support (LTS) release version 16 or later - [download](https://nodejs.org/en/)
34
-
- Java Runtime Environment (JRE) or a Java Development Kit (JDK) version 11 or later - [download](https://adoptopenjdk.net/)
26
+
### Run locally
35
27
36
-
Follow the [installation instructions](https://serenity-js.org/handbook/about/installation/) to help you verify your setup.
37
-
38
-
Once you have the code on your computer, use your computer terminal to run the following command in the directory where you've cloned the project:
28
+
- Follow the [Serenity/JS installation guide](https://serenity-js.org/handbook/about/installation/)
29
+
-[Create a new repository](https://help.github.com/en/articles/creating-a-repository-from-a-template) from this template
30
+
-[Clone](https://help.github.com/en/github/creating-cloning-and-archiving-repositories/cloning-a-repository) it to your machine
31
+
- Install dependencies:
39
32
```
40
33
npm ci
41
34
```
42
-
43
-
Running [`npm ci`](https://docs.npmjs.com/cli/v6/commands/npm-ci) downloads the [Node modules](https://docs.npmjs.com/about-packages-and-modules) this project depends on, as well as the [Serenity BDD CLI](https://github.com/serenity-bdd/serenity-cli) reporter jar.
Then open [http://localhost:8080](http://localhost:8080) in your browser.
44
47
45
48
### Corporate networks
46
49
47
-
If your network administrators require you to use proxy servers or an internal artifact registry (Artifactory, Nexus, etc.), your development environment might require some additional configuration.
48
-
49
-
The easiest way to do it is to create an [`.npmrc` file](https://docs.npmjs.com/cli/v6/configuring-npm/npmrc) in your home directory:
50
+
If your environment requires proxy configuration or an internal registry like Artifactory or Nexus, add an [`.npmrc` file](https://docs.npmjs.com/cli/v6/configuring-npm/npmrc) file
51
+
with the appropriate configuration to your home directory:
If you encounter issues downloading the Serenity BDD CLI jar, please follow the [detailed instructions in the Serenity/JS Handbook](https://serenity-js.org/api/serenity-bdd/#downloading-the-serenity-bdd-reporting-cli).
59
-
60
-
### Execution
60
+
## Execution
61
61
62
62
The project provides several [NPM scripts](https://docs.npmjs.com/cli/v6/using-npm/scripts) defined in [`package.json`](package.json):
63
63
@@ -71,25 +71,57 @@ npm start # starts a mini HTTP server and serves the test reports
71
71
# at http://localhost:8080
72
72
```
73
73
74
-
## Your feedback matters!
74
+
## Next steps
75
+
76
+
- Replace the sample components with your own UI elements
77
+
- Add new tasks, interactions, and assertions using Serenity/JS
78
+
- Extend the test suite or integrate it into CI/CD pipelines
79
+
- Use the sample reports to understand expected testing and reporting workflows
75
80
76
-
Do you find Serenity/JS useful? Give it a ⭐ star on GitHub!
-[More examples and reference implementations](https://github.com/serenity-js/serenity-js/tree/main/examples)
87
+
-[Tutorial: First Web Scenario](https://serenity-js.org/handbook/tutorials/your-first-web-scenario/)
88
+
-[Tutorial: First API Scenario](https://serenity-js.org/handbook/tutorials/your-first-api-scenario/)
79
89
80
-
Found a bug? Need a feature? Raise [an issue](https://github.com/serenity-js/serenity-js/issues?state=open)
81
-
or submit a pull request.
90
+
## Contributing
82
91
83
-
Have feedback? Let me know on [LinkedIn](https://www.linkedin.com/in/janmolak/) or leave a comment in [Serenity/JS discussions on GitHub](/serenity-js/serenity-js/discussions/categories/comments).
92
+
Contributions of all kinds are welcome! Get started with the [Contributing Guide](https://serenity-js.org/community/contributing/).
84
93
85
-
And if you have any questions about the framework, or simply want to say hello to other Serenity/JS developers, join us on [Serenity/JS Community Chat](https://matrix.to/#/#serenity-js:gitter.im).
94
+
## Community
86
95
87
-
## Support Serenity/JS
96
+
Connect with other developers using Serenity/JS:
88
97
89
-
Serenity/JS is a free open-source framework, so we rely on our [wonderful GitHub sponsors](https://github.com/sponsors/serenity-js) to keep the lights on.
- Explore the [💡How to... ?](https://github.com/orgs/serenity-js/discussions/categories/how-to) answers to common questions
90
101
91
-
If you appreciate all the effort that goes into making sophisticated tools easy to work with, please support our work and [become a Serenity/JS GitHub Sponsor](https://github.com/sponsors/serenity-js) today!
102
+
Follow Serenity/JS to learn about new features, tutorials, and releases!
103
+
104
+
[](https://www.linkedin.com/company/serenity-js)
105
+
[](https://www.youtube.com/@serenity-js)
106
+
[](https://matrix.to/#/#serenity-js:gitter.im)
107
+
108
+
⭐ Star the main [Serenity/JS repository](https://github.com/serenity-js/serenity-js) to help others discover the framework!
The Serenity/JS code base is licensed under the [Apache-2.0](https://opensource.org/license/apache-2-0) license,
115
+
while its documentation and the [Serenity/JS Handbook](https://serenity-js.org/handbook/) are licensed under the [Creative Commons BY-NC-SA 4.0 International](https://creativecommons.org/licenses/by-nc-sa/4.0/).
116
+
117
+
See the [Serenity/JS License](https://serenity-js.org/legal/license/).
118
+
119
+
## Support
120
+
121
+
Support ongoing development through [GitHub Sponsors](https://github.com/sponsors/serenity-js). Sponsors gain access to [Serenity/JS Playbooks](https://github.com/serenity-js/playbooks)
122
+
and priority help in the [Discussions Forum](https://github.com/orgs/serenity-js/discussions).
123
+
124
+
For commercial support or corporate sponsorship, please contact [Jan Molak](https://www.linkedin.com/in/janmolak/).
0 commit comments