Skip to content

Commit 5a80fa7

Browse files
update angular docs for v13 (#1193)
1 parent 8ecf58b commit 5a80fa7

File tree

1 file changed

+88
-17
lines changed
  • docs/angular-testing-library

1 file changed

+88
-17
lines changed

docs/angular-testing-library/api.mdx

+88-17
Original file line numberDiff line numberDiff line change
@@ -77,9 +77,44 @@ export async function render<WrapperType = WrapperComponent>(
7777

7878
## Component RenderOptions
7979

80+
### `componentInputs`
81+
82+
An object to set `@Input` properties of the component. Uses `setInput` to set
83+
the input property. Throws if the component property is not annotated with the
84+
`@Input` attribute.
85+
86+
**default** : `{}`
87+
88+
**example**:
89+
90+
```typescript
91+
await render(AppComponent, {
92+
componentInputs: {
93+
counterValue: 10,
94+
},
95+
})
96+
```
97+
98+
### `componentOutputs`
99+
100+
An object to set `@Output` properties of the component.
101+
102+
**default** : `{}`
103+
104+
**example**:
105+
106+
```typescript
107+
await render(AppComponent, {
108+
componentOutputs: {
109+
clicked: (value) => { ... }
110+
}
111+
})
112+
```
113+
80114
### `componentProperties`
81115

82-
An object to set `@Input` and `@Output` properties of the component.
116+
An object to set `@Input` and `@Output` properties of the component. Doesn't
117+
have a fine-grained control as `componentInputs` and `componentOutputs`.
83118

84119
**default** : `{}`
85120

@@ -88,12 +123,34 @@ An object to set `@Input` and `@Output` properties of the component.
88123
```typescript
89124
await render(AppComponent, {
90125
componentProperties: {
126+
// an input
91127
counterValue: 10,
128+
// an output
92129
send: (value) => { ... }
130+
// a public property
131+
name: 'Tim'
93132
}
94133
})
95134
```
96135

136+
### `declarations`
137+
138+
A collection of components, directives and pipes needed to render the component.
139+
For example, nested components of the component.
140+
141+
For more info see the
142+
[Angular docs](https://angular.io/api/core/NgModule#declarations).
143+
144+
**default** : `[]`
145+
146+
**example**:
147+
148+
```typescript
149+
await render(AppComponent, {
150+
declarations: [CustomerDetailComponent, ButtonComponent],
151+
})
152+
```
153+
97154
### `componentProviders`
98155

99156
A collection of providers needed to render the component via Dependency
@@ -115,50 +172,64 @@ await render(AppComponent, {
115172
})
116173
```
117174

118-
### `declarations`
175+
### `componentImports`
119176

120-
A collection of components, directives and pipes needed to render the component.
121-
For example, nested components of the component.
122-
123-
For more info see the
124-
[Angular docs](https://angular.io/api/core/NgModule#declarations).
177+
A collection of imports to override a standalone component's imports with.
125178

126-
**default** : `[]`
179+
**default** : `undefined`
127180

128181
**example**:
129182

130183
```typescript
131184
await render(AppComponent, {
132-
declarations: [CustomerDetailComponent, ButtonComponent],
185+
componentImports: [MockChildComponent],
133186
})
134187
```
135188

136-
### `ɵcomponentImports`
189+
### `childComponentOverrides`
137190

138-
A collection of imports to override a standalone component's imports with.
191+
Collection of child component specified providers to override with.
139192

140193
**default** : `undefined`
141194

142195
**example**:
143196

144197
```typescript
145198
await render(AppComponent, {
146-
ɵcomponentImports: [
147-
MockChildComponent
148-
]
199+
childComponentOverrides: [
200+
{
201+
component: ChildOfAppComponent,
202+
providers: [{provide: ChildService, useValue: {hello: 'world'}}],
203+
},
204+
],
149205
})
150206
```
151207

152-
### `detectChanges`
208+
### `detectChangesOnRender`
153209

154-
Will call `detectChanges` when the component is compiled
210+
Invokes `detectChanges` after the component is rendered.
155211

156212
**default** : `true`
157213

158214
**example**:
159215

160216
```typescript
161-
await render(AppComponent, {detectChanges: false})
217+
await render(AppComponent, {detectChangesOnRender: false})
218+
```
219+
220+
### `autoDetectChanges`
221+
222+
Automatically detect changes as a "real" running component would do. For
223+
example, runs a change detection cycle when an event has occured.
224+
225+
**default** : `true`
226+
227+
**example**:
228+
229+
```typescript
230+
await render(AppComponent, {
231+
autoDetectChanges: false,
232+
})
162233
```
163234

164235
### `excludeComponentDeclaration`

0 commit comments

Comments
 (0)