Skip to content

Commit 56587f9

Browse files
timdeschryvertimdeschryver
committed
add README, COC, CONTRIBUTING, LICENSE
1 parent 1688830 commit 56587f9

File tree

4 files changed

+275
-9
lines changed

4 files changed

+275
-9
lines changed

‎CODE_OF_CONDUCT

+73
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,73 @@
1+
# Contributor Covenant Code of Conduct
2+
3+
## Our Pledge
4+
5+
In the interest of fostering an open and welcoming environment, we as
6+
contributors and maintainers pledge to making participation in our project and
7+
our community a harassment-free experience for everyone, regardless of age, body
8+
size, disability, ethnicity, gender identity and expression, level of experience,
9+
education, socio-economic status, nationality, personal appearance, race,
10+
religion, or sexual identity and orientation.
11+
12+
## Our Standards
13+
14+
Examples of behavior that contributes to creating a positive environment
15+
include:
16+
17+
* Using welcoming and inclusive language
18+
* Being respectful of differing viewpoints and experiences
19+
* Gracefully accepting constructive criticism
20+
* Focusing on what is best for the community
21+
* Showing empathy towards other community members
22+
23+
Examples of unacceptable behavior by participants include:
24+
25+
* The use of sexualized language or imagery and unwelcome sexual attention or
26+
advances
27+
* Trolling, insulting/derogatory comments, and personal or political attacks
28+
* Public or private harassment
29+
* Publishing others' private information, such as a physical or electronic
30+
address, without explicit permission
31+
* Other conduct which could reasonably be considered inappropriate in a
32+
professional setting
33+
34+
## Our Responsibilities
35+
36+
Project maintainers are responsible for clarifying the standards of acceptable
37+
behavior and are expected to take appropriate and fair corrective action in
38+
response to any instances of unacceptable behavior.
39+
40+
Project maintainers have the right and responsibility to remove, edit, or
41+
reject comments, commits, code, wiki edits, issues, and other contributions
42+
that are not aligned to this Code of Conduct, or to ban temporarily or
43+
permanently any contributor for other behaviors that they deem inappropriate,
44+
threatening, offensive, or harmful.
45+
46+
## Scope
47+
48+
This Code of Conduct applies both within project spaces and in public spaces
49+
when an individual is representing the project or its community. Examples of
50+
representing a project or community include using an official project e-mail
51+
address, posting via an official social media account, or acting as an appointed
52+
representative at an online or offline event. Representation of a project may be
53+
further defined and clarified by project maintainers.
54+
55+
## Enforcement
56+
57+
Instances of abusive, harassing, or otherwise unacceptable behavior may be
58+
reported by contacting the project team. All
59+
complaints will be reviewed and investigated and will result in a response that
60+
is deemed necessary and appropriate to the circumstances. The project team is
61+
obligated to maintain confidentiality with regard to the reporter of an incident.
62+
Further details of specific enforcement policies may be posted separately.
63+
64+
Project maintainers who do not follow or enforce the Code of Conduct in good
65+
faith may face temporary or permanent repercussions as determined by other
66+
members of the project's leadership.
67+
68+
## Attribution
69+
70+
This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4,
71+
available at https://www.contributor-covenant.org/version/1/4/code-of-conduct.html
72+
73+
[homepage]: https://www.contributor-covenant.org

‎CONTRIBUTING.me

+27
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
# Contributing
2+
3+
Hi there, thanks for being willing to contribute!
4+
5+
## Setup
6+
7+
* Fork and clone the repository
8+
* Install dependencies via via `npm install`
9+
* Create a new feature branch via `git checkout -b feature-branch-name`
10+
11+
## Testing
12+
13+
* Run `npm run test:lib` to test the library
14+
* Run `npm run test:app` to test the application
15+
* Run `npm run build` to build the library
16+
17+
## Push changes
18+
19+
* Add the files you want to push via `git add filename`, or add everything via `git add .`
20+
* Commit these changes locally and give it a proper description via `git commit -m "my changes here"`
21+
* Push these changes to your fork via `git push`
22+
* Create a new pull request
23+
24+
## Need some guidance?
25+
26+
* [GitHub help](https://help.github.com/)
27+
* [How to Contribute to an Open Source Project on GitHub - by Kent C. Dodds](https://egghead.io/courses/how-to-contribute-to-an-open-source-project-on-github)

‎LICENSE

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
MIT License
2+
3+
Copyright (c) 2018 Tim Deschryver
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in all
13+
copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21+
SOFTWARE.

‎README.md

+154-9
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,134 @@
1-
# NgxTestingLibraryApp
1+
# ngx-testing-library
22

3-
Test your Angular components with the [dom-testing-library](https://github.com/kentcdodds/dom-testing-library).
3+
> Lightweight ulitity functions to test Angular components.
44
5-
Go from
5+
[![Styled with prettier][prettier-badge]][prettier]
6+
[![npm][npm-badge]][npm]
7+
[![MIT License][license-badge]][license]
8+
[![Code of Conduct][coc-badge]][coc]
9+
10+
## Table of Contents
11+
12+
- [Installation](#installation)
13+
- [Why](#why)
14+
- [What](#what)
15+
- [How](#how)
16+
- [Usage](#usage)
17+
- [Licence](#license)
18+
19+
## Installation
20+
21+
Install `ngx-testing-library` from [npm] and add it your `devDependencies`:
22+
23+
`npm install ngx-testing-library --save-dev`
24+
25+
## Why
26+
27+
- test your UI components the way your users are using it
28+
- making your tests resilient to implementation changes
29+
30+
## What
31+
32+
ngx-testing-library is an Angular adapter around [dom-testing-library][dom-testing-library],
33+
which provides lightweight ulitity functions to test UI components. Your tests will work with actual DOM nodes.
34+
35+
## How
36+
37+
### `createComponent`
38+
39+
This library only consists of one function, `createComponent` which is used to setup the Angular `TestBed` and creates the component fixture.
40+
41+
This method can be used in two ways:
42+
43+
Based on a template:
44+
45+
```ts
46+
import { createComponent } from 'ngx-testing-library';
47+
48+
createComponent('<my-component [prop]="1"></my-component>', options);
49+
```
50+
51+
Based on a component type:
52+
53+
```ts
54+
import { createComponent } from 'ngx-testing-library';
55+
56+
createComponent(
57+
{
58+
component: MyComponent,
59+
parameters: {
60+
prop: 1,
61+
},
62+
},
63+
options,
64+
);
65+
```
66+
67+
The second parameter in `createComponent` is the `options` parameter, which looks like this:
68+
69+
```ts
70+
{
71+
detectChanges?: boolean = true;
72+
declarations: any[] = [];
73+
providers?: any[] = [];
74+
imports?: any[] = [];
75+
schemas?: any[] = [];
76+
}
77+
```
78+
79+
`detectChanges`: runs `detectChanges` on the fixture<br/>
80+
`declarations`: passed to the `TestBed`<br/>
81+
`providers`: passed to the `TestBed`<br/>
82+
`imports`: passed to the `TestBed`<br/>
83+
`schemas`: passed to the `TestBed`<br/>
84+
85+
The `createComponent` function returns an object consisting all of the query functions from [dom-testing-library][dom-testing-library] and adds the following properties:
86+
87+
#### `container: HTMLElement`
88+
89+
The DOM node containing the Angular component.
90+
91+
All of the [dom-testing-library][dom-testing-library] query functions are binded to this container.
92+
93+
#### `debug() => void`
94+
95+
Prints out the container.
96+
97+
#### `detectChanges(checkNoChanges?: boolean) => void`
98+
99+
Runs `detectChanges` on the fixture.
100+
101+
#### `fixture: any`
102+
103+
The Angular fixture.
104+
105+
#### `get(token: any, notFoundValue?: any) => any`
106+
107+
Is the Angular `TestBed.get` function.
108+
109+
#### `getComponentInstance(selector?: string) => T`
110+
111+
Gets the Angular component instance.
112+
113+
The `selector` is required when the template syntax is being used, in order to get the component.
114+
115+
### `fireEvent`
116+
117+
Exposes the `fireEvent` from [dom-testing-library](dom-testing-library).
118+
119+
```ts
120+
import { fireEvent } from 'ngx-testing-library';
121+
122+
fireEvent.click(buttonNode);
123+
```
124+
125+
## Usage
126+
127+
You can find some examples in the [tests folder](https://github.com/tdeschryver/ngx-testing-library/tree/master/projects/ngx-testing-library/tests).
128+
129+
Here is how "default" specifications are written with `ngx-testing-library`.
130+
131+
Before:
6132

7133
```ts
8134
import { TestBed, async } from '@angular/core/testing';
@@ -30,23 +156,42 @@ describe('AppComponent', () => {
30156
});
31157
```
32158

33-
to
159+
After:
34160

35161
```ts
36162
import { AppComponent } from './app.component';
37163
import { createComponent } from 'ngx-testing-library';
38164

39-
test(`should have as title 'my-awesome-app'`, async () => {
165+
it(`should have as title 'my-awesome-app'`, async () => {
40166
const { detectChanges, getByText } = await createComponent('<app-root></app-root>', {
41167
declarations: [AppComponent],
42168
});
43169
expect(getByText('Welcome to my-awesome-app!')).toBeDefined();
44170
});
45171

46-
test(`should render title in a h1 tag`, async () => {
47-
const { container } = await createComponent('<app-root></app-root>', {
48-
declarations: [AppComponent],
49-
});
172+
it(`should render title in a h1 tag`, async () => {
173+
const { container } = await createComponent(
174+
{
175+
component: AppComponent,
176+
},
177+
{
178+
declarations: [AppComponent],
179+
},
180+
);
50181
expect(container.querySelector('h1').textContent).toContain('Welcome to my-awesome-app!');
51182
});
52183
```
184+
185+
## LICENSE
186+
187+
MIT
188+
189+
[prettier-badge]: https://img.shields.io/badge/styled_with-prettier-ff69b4.svg
190+
[prettier]: https://github.com/prettier/prettier
191+
[npm-badge]: https://img.shields.io/npm/v/ngx-testing-library.svg
192+
[npm]: https://www.npmjs.com/package/ngx-testing-library
193+
[license-badge]: https://img.shields.io/npm/l/ngx-testing-library.svg?style=flat-square
194+
[license]: https://github.com/tdeschryver/ngx-testing-library/blob/master/LICENSE
195+
[coc-badge]: https://img.shields.io/badge/code%20of-conduct-ff69b4.svg?style=flat-square
196+
[coc]: https://github.com/tdeschryver/ngx-testing-library/blob/master/CODE_OF_CONDUCT.md
197+
[dom-testing-library]: https://github.com/kentcdodds/dom-testing-library

0 commit comments

Comments
 (0)