Top AI Repos — open-source AI, indexed and scored
Top AI Repos tracks AI repositories on GitHub and answers two different questions about each one: is it moving right now, and would you bet a product on it.
Top AI Repos tracks AI repositories on GitHub and answers two different questions about each one: is it moving right now, and would you bet a product on it.
Angular testing made easy with shallow rendering and easy mocking. https://getsaf.github.io/shallow-render
| Date | Stars |
|---|---|
| 2026-07-24 | 273 |
| 2026-07-25 | 273 |
| 2026-07-28 | 273 |
| 2026-07-30 | 273 |
| 2026-08-06 | 273 |
Today
— stars today
This week
— stars this week
This month
— stars this month
Momentum
0.0
growth rate 0.00%/day
# shallow-render
[](https://circleci.com/gh/getsaf/shallow-render)
[](https://www.npmjs.com/package/shallow-render)
Angular testing made easy with shallow rendering and easy mocking.
---
# Looking For Help Maintaining This Library!
Hey all, I do plan on continuing to update this library as Angular provides updates. This is not easy for me to do as I don't work with Angular in my current job.
Any additonal support would be very appreciated! Please reach out if you want to be a help!
## Docs
- [API Docs](https://getsaf.github.io/shallow-render)
- [Example Tests](https://github.com/getsaf/shallow-render/tree/master/lib/examples)
- [Release Notes](https://github.com/getsaf/shallow-render/releases)
## Schematics
- [Angular Schematics](https://github.com/mihalcan/shallow-render-shematics) (thanks @mihalcan!)
## Articles
- [Testing Angular Components With shallow-render](https://medium.com/@getsaf/testing-angular-components-with-shallow-render-9334d16dc2e3?source=friends_link&sk=5c72c2bf4ce91da656916dc680f8b1cf)
- [Advanced shallow-render Testing](https://medium.com/@getsaf/advanced-shallow-render-testing-for-angular-components-452ce74d5f88?source=friends_link&sk=91d48511b60871c7b34b1bbb231ce1a5)
- [Why Shallow Rendering is Important](https://medium.com/@getsaf/why-shallow-rendering-is-import-in-angular-unit-tests-84569d571b72?source=friends_link&sk=4576570c948a531036cc8fe9e2dc9a19)
## Angular Version Support
| Angular | shallow-render |
| ------- | -------------- |
| 20x | 20x |
| 19x | 19x |
| 18x | 18x |
| 17x | 17x |
| 16x | 16x |
| 15x | 15x |
| 14x | 14x |
| 13x | 13x |
| 12x | 12x |
| 11x | 11x |
| 10x | 10x |
| 9x | 9x |
| 6x-8x | 8x |
| 5x | <= 7.2.0 |
## Super Simple Tests
```typescript
describe('ColorLinkComponent', () => {
let shallow: Shallow<ColorLinkComponent>;
beforeEach(() => {
shallow = new Shallow(ColorLinkComponent, MyModule);
});
it('renders a link with the name of the color', async () => {
const { find } = await shallow.render({ bind: { color: 'Blue' } });
// or shallow.render(`<color-link color="Blue"></color-link>`);
expect(find('a').nativeElement.textContent).toBe('Blue');
});
it('emits color when clicked', async () => {
const { element, outputs } = await shallow.render({ bind: { color: 'Red' } });
element.click();
expect(outputs.handleClick.emit).toHaveBeenCalledWith('Red');
});
});
```
## The problem
Testing in Angular is **HARD**. TestBed is powerful but its use in component specs ends with lots of duplication.
Here's a standard TestBed spec for a component that uses a few other components, a directive and a pipe and handles click events:
```typescript
describe('MyComponent', () => {
beforeEach(async => {
return TestBed.configureTestModule({
imports: [SomeModuleWithDependencies],
declarations: [
TestHostComponent,
MyComponent, // <-- All I want to do is test this!!
// We either must list all our dependencies here
// -- OR --
// Use NO_ERRORS_SCHEMA which allows any HTML to be used
// even if it is invalid!
ButtonComponent,
LinkComponent,
FooDirective,
BarPipe,
],
providers: [MyService],
})
.compileComponents()
.then(() => {
let myService = TestBed.get(MyService); // Not type safe
spyOn(myService, 'foo').and.returnValue('mocked foo');
});
});
it('renders a link with the provided label text', () => {
const fixture = TestBed.createComponent(TestHostComponent);
fixture.componentInstance.labelText = 'my text';
fixture.detectChanges();
const link = Excerpt of 6,813 characters
Read on GitHubWould you bet a product on this? Bounded 0–100 and slow moving.
matched fp:d6d11192d6cff04f, topic:testing