add testing and changeDirectionStrategy

libs/ui/elements/src/lib/markdown-parser/markdown-parser.component.spec.ts

@@ -12,10 +12,30 @@ describe('MarkdownParserComponent', () => {
 
     fixture = TestBed.createComponent(MarkdownParserComponent)
     component = fixture.componentInstance
-    fixture.detectChanges()
   })
 
   it('should create', () => {
     expect(component).toBeTruthy()
   })
+
+  it('should render markdown as HTML', () => {
+    component.textContent = '**bold markdown**'
+    fixture.detectChanges()
+    const markdown = fixture.nativeElement.innerHTML
+    expect(markdown).toContain('<p><strong>bold markdown</strong></p>')
+  })
+
+  it('should render HTML as HTML', () => {
+    component.textContent = '<p><strong>simple html</strong></p>'
+    fixture.detectChanges()
+    const html = fixture.nativeElement.innerHTML
+    expect(html).toContain('<p><strong>simple html</strong></p>')
+  })
+
+  it('should render text as HTML', () => {
+    component.textContent = 'simple text'
+    fixture.detectChanges()
+    const text = fixture.nativeElement.innerHTML
+    expect(text).toContain('<p>simple text</p>')
+  })
 })

libs/ui/elements/src/lib/markdown-parser/markdown-parser.component.ts

@@ -1,10 +1,11 @@
-import { Component, Input } from '@angular/core'
+import { Component, Input, ChangeDetectionStrategy } from '@angular/core'
 import { marked } from 'marked'
 
 @Component({
   selector: 'gn-ui-markdown-parser',
   templateUrl: './markdown-parser.component.html',
   styleUrls: ['./markdown-parser.component.css'],
+  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class MarkdownParserComponent {
   @Input() textContent: string