diff --git a/frontend/src/app/sample/sample.component.spec.ts b/frontend/src/app/sample/sample.component.spec.ts
index 9c7e3ca..e2cadf1 100644
--- a/frontend/src/app/sample/sample.component.spec.ts
+++ b/frontend/src/app/sample/sample.component.spec.ts
@@ -1,25 +1,49 @@
 import { ComponentFixture, TestBed } from "@angular/core/testing";
 
 import { SampleComponent } from "./sample.component";
-import { RouterModule } from "@angular/router";
+import { ActivatedRoute, Router, RouterModule } from "@angular/router";
 import { routes } from "../routes";
-import { HttpClientTestingModule } from "@angular/common/http/testing";
+import {
+    HttpClientTestingModule,
+    HttpTestingController,
+} from "@angular/common/http/testing";
+import {
+    AethelDetail,
+    AethelDetailError,
+    LexicalPhrase,
+} from "../shared/types";
+import { By } from "@angular/platform-browser";
+import { ProofPipe } from "../shared/pipes/proof.pipe";
 
-
-describe("SampleComponent", () => {
+fdescribe("SampleComponent", () => {
     let component: SampleComponent;
     let fixture: ComponentFixture<SampleComponent>;
+    let router: Router;
+    let controller: HttpTestingController;
+
+    const table = () => fixture.debugElement.query(By.css(".table"));
 
     beforeEach(async () => {
         await TestBed.configureTestingModule({
-            imports: [
-                HttpClientTestingModule,
-                RouterModule.forRoot(routes)
+            imports: [HttpClientTestingModule, RouterModule.forRoot(routes)],
+            providers: [
+                {
+                    provide: ActivatedRoute,
+                    useValue: {
+                        snapshot: {
+                            params: {
+                                sampleName: "cheese-tosti",
+                            },
+                        },
+                    },
+                },
             ],
-            declarations: [SampleComponent]
+            declarations: [SampleComponent, ProofPipe],
         }).compileComponents();
 
         fixture = TestBed.createComponent(SampleComponent);
+        router = TestBed.inject(Router);
+        controller = TestBed.inject(HttpTestingController);
         component = fixture.componentInstance;
         fixture.detectChanges();
     });
@@ -28,5 +52,59 @@ describe("SampleComponent", () => {
         expect(component).toBeTruthy();
     });
 
-    it("should construct a valid route", () => { });
+    it("should construct a valid route", () => {
+        const spy = spyOn(router, "navigate");
+        const items: LexicalPhrase["items"] = [
+            {
+                lemma: "test",
+                pos: "2",
+                pt: "2",
+                word: "testQuery",
+            },
+        ];
+
+        component.routeToAethel(items);
+        expect(spy).toHaveBeenCalledOnceWith(["/æthel"], {
+            queryParams: { query: "testQuery" },
+        });
+    });
+
+    it("should handle a valid query param", () => {
+        const validResult: AethelDetail = {
+            error: null,
+            result: {
+                name: "name",
+                phrases: [],
+                sentence: "sentence",
+                subset: "testing",
+                term: "term",
+            },
+        };
+
+        const req = controller.expectOne(
+            "/api/aethel/sample?sample-name=cheese-tosti",
+        );
+
+        req.flush(validResult);
+        fixture.detectChanges();
+
+        expect(table()).toBeTruthy();
+        controller.verify();
+    });
+
+    it("should handle an invalid query param", () => {
+        const errorResult: AethelDetail = {
+            error: AethelDetailError.SAMPLE_NOT_FOUND,
+            result: null,
+        };
+
+        const req = controller.expectOne(
+            "/api/aethel/sample?sample-name=cheese-tosti",
+        );
+        req.flush(errorResult);
+        fixture.detectChanges();
+
+        expect(table()).toBeFalsy();
+        controller.verify();
+    });
 });
diff --git a/frontend/src/app/shared/types.ts b/frontend/src/app/shared/types.ts
index b72c3af..7301089 100644
--- a/frontend/src/app/shared/types.ts
+++ b/frontend/src/app/shared/types.ts
@@ -70,5 +70,5 @@ export interface AethelDetailResult {
 
 export interface AethelDetail {
     error: AethelDetailError | null;
-    result: AethelDetailResult;
+    result: AethelDetailResult | null;
 }