Merge pull request #1301 from hallieswan/AG-1407

AG-1407: default to sorting similar genes table by hgnc_symbol ascending

src/app/features/genes/components/gene-similar/gene-similar.component.html

@@ -32,6 +32,7 @@ <h1 class="h2">Similar Genes</h1>
           [genes]="genes"
           [columns]="tableColumns"
           sortField="hgnc_symbol"
+          [sortOrder]="1"
           heading="Similar Genes"
           [gctLink]="true"
           gctLinkTooltip="Use Agora's Gene Comparison Tool to compare similar genes in this list"

src/app/features/genes/components/gene-similar/gene-similar.component.spec.ts

@@ -11,13 +11,15 @@ import { HttpClientTestingModule } from '@angular/common/http/testing';
 import { GeneSimilarComponent } from './';
 import { GeneService } from '../../services';
 import { ApiService, HelperService } from '../../../../core/services';
+import { geneMock1, geneMock2, geneMock3 } from '../../../../testing';
 
 // -------------------------------------------------------------------------- //
 // Tests
 // -------------------------------------------------------------------------- //
 describe('Component: Gene Similar', () => {
   let fixture: ComponentFixture<GeneSimilarComponent>;
   let component: GeneSimilarComponent;
+  let element: HTMLElement;
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
@@ -31,9 +33,33 @@ describe('Component: Gene Similar', () => {
     fixture = TestBed.createComponent(GeneSimilarComponent);
     component = fixture.componentInstance;
     fixture.detectChanges();
+    element = fixture.nativeElement;
   });
 
   it('should create', () => {
     expect(component).toBeTruthy();
   });
+
+  it('should order by hgnc-symbol ascending', () => {
+    const expectedHgnc = [
+      geneMock1.hgnc_symbol,
+      geneMock2.hgnc_symbol,
+      geneMock3.hgnc_symbol,
+    ];
+    expectedHgnc.sort();
+
+    component.genes = [geneMock1, geneMock2, geneMock3];
+    fixture.detectChanges();
+
+    const table = element.querySelector('.similar-gene-table');
+    expect(table).not.toBeNull();
+
+    const rows = Array.from(
+      table?.querySelectorAll('tbody tr') || []
+    ) as HTMLTableRowElement[];
+    expect(rows.length).toBe(3);
+
+    const actualHgnc = rows.map(row => row.cells[0].textContent?.trim());
+    expect(actualHgnc).toEqual(expectedHgnc);
+  });
 });