diff --git a/src/app/core/shared/math.directive.spec.ts b/src/app/core/shared/math.directive.spec.ts
deleted file mode 100644
index a8517c87b2..0000000000
--- a/src/app/core/shared/math.directive.spec.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-// import { MathDirective } from './math.directive';
-
-describe('MathDirective', () => {
-  it('should create an instance', () => {
-    // const directive = new MathDirective();
-    // expect(directive).toBeTruthy();
-  });
-});
diff --git a/src/app/core/shared/math.service.spec.ts b/src/app/core/shared/math.service.spec.ts
index aa71ca226b..cc0b2814f2 100644
--- a/src/app/core/shared/math.service.spec.ts
+++ b/src/app/core/shared/math.service.spec.ts
@@ -1,16 +1,54 @@
 import { TestBed } from '@angular/core/testing';
+import {
+  Observable,
+  of,
+} from 'rxjs';
 
-import { MathService } from './math.service';
+import {
+  MathJaxConfig,
+  MathService,
+} from './math.service';
+
+export class MockMathService extends MathService {
+  protected mathJaxOptions: any = {};
+  protected mathJax: MathJaxConfig = { source: '', id: '' };
+  protected mathJaxFallback: MathJaxConfig = { source: '', id: '' };
+
+  protected registerMathJaxAsync(config: MathJaxConfig): Promise<any> {
+    return Promise.resolve();
+  }
+
+  ready(): Observable<boolean> {
+    return of(true);
+  }
+
+  render(element: HTMLElement): void {
+    return;
+  }
+}
 
 describe('MathService', () => {
-  let service: MathService;
+  let service: MockMathService;
 
   beforeEach(() => {
     TestBed.configureTestingModule({});
-    service = TestBed.inject(MathService);
+    service = new MockMathService();
+    spyOn(service, 'render');
   });
 
   it('should be created', () => {
     expect(service).toBeTruthy();
   });
+
+  it('should be ready', (done) => {
+    service.ready().subscribe(isReady => {
+      expect(isReady).toBe(true);
+      done();
+    });
+  });
+
+  it('should render', () => {
+    service.render(document.createElement('div'));
+    expect(service.render).toHaveBeenCalled();
+  });
 });
diff --git a/src/app/item-page/simple/field-components/specific-field/item-page-field.component.spec.ts b/src/app/item-page/simple/field-components/specific-field/item-page-field.component.spec.ts
index 41dac600b2..5815f18180 100644
--- a/src/app/item-page/simple/field-components/specific-field/item-page-field.component.spec.ts
+++ b/src/app/item-page/simple/field-components/specific-field/item-page-field.component.spec.ts
@@ -18,6 +18,7 @@ import { APP_CONFIG } from '../../../../../config/app-config.interface';
 import { environment } from '../../../../../environments/environment';
 import { BrowseDefinitionDataService } from '../../../../core/browse/browse-definition-data.service';
 import { Item } from '../../../../core/shared/item.model';
+import { MathService } from '../../../../core/shared/math.service';
 import {
   MetadataMap,
   MetadataValue,
@@ -26,7 +27,7 @@ import { TranslateLoaderMock } from '../../../../shared/mocks/translate-loader.m
 import { createSuccessfulRemoteDataObject$ } from '../../../../shared/remote-data.utils';
 import { BrowseDefinitionDataServiceStub } from '../../../../shared/testing/browse-definition-data-service.stub';
 import { createPaginatedList } from '../../../../shared/testing/utils.test';
-import { MarkdownPipe } from '../../../../shared/utils/markdown.pipe';
+import { MarkdownDirective } from '../../../../shared/utils/markdown.directive';
 import { MetadataValuesComponent } from '../../../field-components/metadata-values/metadata-values.component';
 import { ItemPageFieldComponent } from './item-page-field.component';
 
@@ -65,12 +66,13 @@ describe('ItemPageFieldComponent', () => {
       providers: [
         { provide: APP_CONFIG, useValue: appConfig },
         { provide: BrowseDefinitionDataService, useValue: BrowseDefinitionDataServiceStub },
+        { provide: MathService, useValue: {} },
       ],
       schemas: [NO_ERRORS_SCHEMA],
     }).overrideComponent(ItemPageFieldComponent, {
       set: { changeDetection: ChangeDetectionStrategy.Default },
     }).compileComponents();
-    markdownSpy = spyOn(MarkdownPipe.prototype, 'transform');
+    markdownSpy = spyOn(MarkdownDirective.prototype, 'render');
     fixture = TestBed.createComponent(ItemPageFieldComponent);
     comp = fixture.componentInstance;
     comp.item = mockItemWithMetadataFieldsAndValue(mockFields, mockValue);
diff --git a/src/app/shared/utils/markdown.directive.spec.ts b/src/app/shared/utils/markdown.directive.spec.ts
index 621fdd45b6..682fa50d87 100644
--- a/src/app/shared/utils/markdown.directive.spec.ts
+++ b/src/app/shared/utils/markdown.directive.spec.ts
@@ -1,8 +1,42 @@
+import {
+  Component,
+  DebugElement,
+} from '@angular/core';
+import {
+  ComponentFixture,
+  TestBed,
+} from '@angular/core/testing';
+import { By } from '@angular/platform-browser';
+
+import { MathService } from '../../core/shared/math.service';
+import { MockMathService } from '../../core/shared/math.service.spec';
 import { MarkdownDirective } from './markdown.directive';
 
+@Component({
+  template: `<div dsMarkdown="test"></div>`,
+})
+class TestComponent {}
+
 describe('MarkdownDirective', () => {
-  it('should create an instance', () => {
-    const directive = new MarkdownDirective();
-    expect(directive).toBeTruthy();
+  let component: TestComponent;
+  let fixture: ComponentFixture<TestComponent>;
+  let divEl: DebugElement;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ TestComponent, MarkdownDirective ],
+      providers: [
+        { provide: MathService, useClass: MockMathService },
+      ],
+    }).compileComponents();
+    spyOn(MarkdownDirective.prototype, 'render');
+    fixture = TestBed.createComponent(TestComponent);
+    component = fixture.componentInstance;
+    divEl = fixture.debugElement.query(By.css('div'));
+  });
+
+  it('should call render method', () => {
+    fixture.detectChanges();
+    expect(MarkdownDirective.prototype.render).toHaveBeenCalled();
   });
 });