Skip to content

Commit 97c9f61

Browse files
committed
feat(upgrade): upgrade to Angular 9
BREAKING CHANGE: Uprgrade to Angular 9, upgrade deps, improve docs
1 parent 5ed8ed8 commit 97c9f61

File tree

10 files changed

+7894
-3156
lines changed

10 files changed

+7894
-3156
lines changed

README.md

Lines changed: 19 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
![logNgHTML](https://raw.githubusercontent.com/angular-extensions/pretty-html-log/master/images/logo.png)
44

55
This module allows you to pretty print the inner HTML
6-
of `ComponentFixtures`, `DebugElements`, `NativeElements` or even plain HTML `strings` to the console.
6+
of `ComponentFixture`, single or multiple `DebugElements`, single or multiple `NativeElements` or even plain HTML `strings` to the console.
77
**This is very useful for debugging Angular component tests in Jest**
88

99
![logNgHTML](https://raw.githubusercontent.com/angular-extensions/pretty-html-log/master/images/before-after.png)
@@ -18,7 +18,7 @@ npm i -D @angular-extensions/pretty-html-log
1818
```
1919

2020
This module is best used with Angular and Jest. Create a
21-
`setupJest.ts` file in your `src` directory and add the following line **after your jest-preset-angular import. The order can matter**:
21+
`setupJest.ts` file in your `src` directory and add the following line **after your jest-preset-angular import. ⚠️ The order can matter**:
2222

2323
```
2424
import '@angular-extensions/pretty-html-log'
@@ -62,15 +62,21 @@ Which will print the following string to your console
6262

6363
![logNgHTML](https://raw.githubusercontent.com/angular-extensions/pretty-html-log/master/images/output.png)
6464

65-
### Further examples
65+
### Examples
6666

67-
Instead of passing in a DebugElement you can also pass in a fixture:
67+
Log the content innerHTML of a fixture
6868

6969
```
7070
console.logNgHTML(fixture);
7171
```
7272

73-
or a nativeElement
73+
of a debugElement (or multiple debugElements)
74+
75+
```
76+
console.logNgHTML(fixture.debugElement);
77+
```
78+
79+
of a nativeElement (or multiple nativeElements)
7480

7581
```
7682
console.logNgHTML(fixture.debugElement.nativeElement);
@@ -84,12 +90,20 @@ console.logNgHTML('<h1>Foo</h1>');
8490

8591
### Print Angular comments
8692

93+
Angular adds some comments to our HTML file. Usually, when debugging our tests, we don't need them. Therefore they
94+
are not printed by default. However, there are cases where you want to print those comments. To do so, you
95+
can pass `true` as an additional flag tot he `logNgHTML` method.
96+
8797
```
8898
console.logNgHTML(fixture, true);
8999
```
90100

91101
### Change the theme
92102

103+
`@angular-extensions/pretty-html-log` allows you to print the html logs in different themes.
104+
Currently, we support (DRACULA, VSCODE and MATERIAL). The themes can be importet from `pretty-html-log`, the
105+
base library `@angular-extensions/pretty-html-log` depends on.
106+
93107
```
94108
import {THEMES} from 'pretty-html-log';
95109

angular.json

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,11 @@
1414
"options": {
1515
"tsConfig": "projects/pretty-html-log/tsconfig.lib.json",
1616
"project": "projects/pretty-html-log/ng-package.json"
17+
},
18+
"configurations": {
19+
"production": {
20+
"tsConfig": "projects/pretty-html-log/tsconfig.lib.prod.json"
21+
}
1722
}
1823
},
1924
"test": {
@@ -51,7 +56,7 @@
5156
"main": "projects/pretty-html-log-showcase/src/main.ts",
5257
"polyfills": "projects/pretty-html-log-showcase/src/polyfills.ts",
5358
"tsConfig": "projects/pretty-html-log-showcase/tsconfig.app.json",
54-
"aot": false,
59+
"aot": true,
5560
"assets": [
5661
"projects/pretty-html-log-showcase/src/favicon.ico",
5762
"projects/pretty-html-log-showcase/src/assets"
@@ -75,7 +80,6 @@
7580
"sourceMap": false,
7681
"extractCss": true,
7782
"namedChunks": false,
78-
"aot": true,
7983
"extractLicenses": true,
8084
"vendorChunk": false,
8185
"buildOptimizer": true,

0 commit comments

Comments
 (0)