Skip to content

Commit 04a3ca2

Browse files
phildarnowsky-broadphildarnowsky-broad
committed
Add sorting to short tandem repeats table
1 parent a6f4fe8 commit 04a3ca2

File tree

4 files changed

+1764
-32
lines changed

4 files changed

+1764
-32
lines changed

‎browser/src/ShortTandemRepeatsPage/ShortTandemRepeatsPage.spec.tsx‎

Lines changed: 357 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,357 @@
1+
import React from 'react'
2+
import { describe, expect, test } from '@jest/globals'
3+
import { render, screen } from '@testing-library/react'
4+
import { userEvent } from '@testing-library/user-event'
5+
import ShortTandemRepeatsPage from './ShortTandemRepeatsPage'
6+
import { mockQueries } from '../../../tests/__helpers__/queries'
7+
import Query, { BaseQuery } from '../Query'
8+
import { MemoryRouter } from 'react-router'
9+
10+
jest.mock('../Query', () => {
11+
const originalModule = jest.requireActual('../Query')
12+
13+
return {
14+
__esModule: true,
15+
...(originalModule as object),
16+
default: jest.fn(),
17+
BaseQuery: jest.fn(),
18+
}
19+
})
20+
21+
const { resetMockApiCalls, resetMockApiResponses, simulateApiResponse, setMockApiResponses } =
22+
mockQueries()
23+
24+
beforeEach(() => {
25+
Query.mockImplementation(
26+
jest.fn(({ children, operationName, variables, query }) =>
27+
simulateApiResponse('Query', query, children, operationName, variables)
28+
)
29+
)
30+
;(BaseQuery as any).mockImplementation(
31+
jest.fn(({ children, operationName, variables, query }) =>
32+
simulateApiResponse('BaseQuery', query, children, operationName, variables)
33+
)
34+
)
35+
})
36+
37+
afterEach(() => {
38+
resetMockApiCalls()
39+
resetMockApiResponses()
40+
})
41+
42+
const strApiResponse = {
43+
short_tandem_repeats: [
44+
{
45+
id: 'AR',
46+
gene: {
47+
ensembl_id: 'ENSG00000169083',
48+
symbol: 'AR',
49+
region: 'coding: polyglutamine',
50+
},
51+
reference_repeat_unit: 'GCA',
52+
associated_diseases: [
53+
{
54+
name: 'Spinal and bulbar muscular atrophy',
55+
symbol: 'SBMA',
56+
omim_id: '313200',
57+
inheritance_mode: 'X-linked recessive',
58+
},
59+
],
60+
},
61+
{
62+
id: 'ARX_1',
63+
gene: {
64+
ensembl_id: 'ENSG00000004848',
65+
symbol: 'ARX',
66+
region: 'coding: polyalanine',
67+
},
68+
reference_repeat_unit: 'NGC',
69+
associated_diseases: [
70+
{
71+
name: 'X-linked mental retardation with or without seizures',
72+
symbol: 'MRXARX',
73+
omim_id: '300419',
74+
inheritance_mode: 'X-linked recessive',
75+
},
76+
{
77+
name: 'Developmental and epileptic encephalopathy-1',
78+
symbol: 'DEE1',
79+
omim_id: '308350',
80+
inheritance_mode: 'Z-linked recessive',
81+
},
82+
],
83+
},
84+
{
85+
id: 'AFF2',
86+
gene: {
87+
ensembl_id: 'ENSG00000155966',
88+
symbol: 'AFF2',
89+
region: "5'-UTR",
90+
},
91+
reference_repeat_unit: 'GCC',
92+
associated_diseases: [
93+
{
94+
name: 'FRAXE mental retardation',
95+
symbol: 'FRAXE',
96+
omim_id: '309548',
97+
inheritance_mode: 'Imaginary inheritance mode',
98+
},
99+
],
100+
},
101+
{
102+
id: 'ATN1',
103+
gene: {
104+
ensembl_id: 'ENSG00000111676',
105+
symbol: 'ATN1',
106+
region: 'Made-up region',
107+
},
108+
reference_repeat_unit: 'CAG',
109+
associated_diseases: [
110+
{
111+
name: 'Dentatorubral-pallidoluysian atrophy',
112+
symbol: 'DRPLA',
113+
omim_id: '125370',
114+
inheritance_mode: 'Autosomal dominant',
115+
},
116+
],
117+
},
118+
{
119+
id: 'ATXN1',
120+
gene: {
121+
ensembl_id: 'ENSG00000124788',
122+
symbol: 'ATXN1',
123+
region: 'Ersatz region',
124+
},
125+
reference_repeat_unit: 'TGC',
126+
associated_diseases: [
127+
{
128+
name: 'Spinocerebellar ataxia 1',
129+
symbol: 'SCA1',
130+
omim_id: '164400',
131+
inheritance_mode: 'Autosomal miscellaneous',
132+
},
133+
],
134+
},
135+
{
136+
id: 'ATXN2',
137+
gene: {
138+
ensembl_id: 'ENSG00000204842',
139+
symbol: 'ATXN2',
140+
region: 'Fake region',
141+
},
142+
reference_repeat_unit: 'GCT',
143+
associated_diseases: [
144+
{
145+
name: 'Spinocerebellar ataxia 2',
146+
symbol: 'SCA2',
147+
omim_id: '183090',
148+
inheritance_mode: 'Autosomal dominant',
149+
},
150+
{
151+
name: 'Made-up disease 1',
152+
symbol: 'SCA2',
153+
omim_id: '183090',
154+
inheritance_mode: 'Autosomal recessive',
155+
},
156+
],
157+
},
158+
{
159+
id: 'ATXN10',
160+
gene: {
161+
ensembl_id: 'ENSG00000130638',
162+
symbol: 'ATXN10',
163+
region: 'intron',
164+
},
165+
reference_repeat_unit: 'ATTCT',
166+
associated_diseases: [
167+
{
168+
name: 'Spinocerebellar ataxia 10',
169+
symbol: 'SCA10',
170+
omim_id: '603516',
171+
inheritance_mode: 'Autosomal recessive',
172+
},
173+
],
174+
},
175+
],
176+
}
177+
178+
describe('ShortTandemRepeatsPage', () => {
179+
beforeEach(() =>
180+
setMockApiResponses({
181+
ShortTandemRepeats: () => strApiResponse,
182+
})
183+
)
184+
185+
test('has no unexpected changes', () => {
186+
const tree = render(
187+
<MemoryRouter>
188+
<ShortTandemRepeatsPage datasetId="gnomad_r4" />
189+
</MemoryRouter>
190+
)
191+
expect(tree).toMatchSnapshot()
192+
})
193+
194+
describe('sorting', () => {
195+
test('sorts by ID', async () => {
196+
const user = userEvent.setup()
197+
198+
render(
199+
<MemoryRouter>
200+
<ShortTandemRepeatsPage datasetId="gnomad_r4" />
201+
</MemoryRouter>
202+
)
203+
204+
const ascendingIds = screen.queryAllByRole('rowheader').map((cell) => cell.textContent)
205+
expect(ascendingIds).toEqual(['AFF2', 'AR', 'ARX_1', 'ATN1', 'ATXN1', 'ATXN10', 'ATXN2'])
206+
207+
const idButton = screen.getByText('ID')
208+
await user.click(idButton)
209+
const descendingIds = screen.queryAllByRole('rowheader').map((cell) => cell.textContent)
210+
expect(descendingIds).toEqual(['ATXN2', 'ATXN10', 'ATXN1', 'ATN1', 'ARX_1', 'AR', 'AFF2'])
211+
})
212+
213+
test('sorts by reference repeat unit', async () => {
214+
const user = userEvent.setup()
215+
216+
render(
217+
<MemoryRouter>
218+
<ShortTandemRepeatsPage datasetId="gnomad_r4" />
219+
</MemoryRouter>
220+
)
221+
222+
const referenceRepeatUnitButton = screen.getByText('Reference repeat unit')
223+
224+
await user.click(referenceRepeatUnitButton)
225+
const ascendingIds = screen.queryAllByRole('rowheader').map((cell) => cell.textContent)
226+
expect(ascendingIds).toEqual([
227+
'ATXN10', // ATTCT
228+
'ATN1', // CAG
229+
'AR', // GCA
230+
'AFF2', // GCC
231+
'ATXN2', // GCT
232+
'ARX_1', // NGC
233+
'ATXN1', // TGC
234+
])
235+
236+
await user.click(referenceRepeatUnitButton)
237+
const descendingIds = screen.queryAllByRole('rowheader').map((cell) => cell.textContent)
238+
expect(descendingIds).toEqual([
239+
'ATXN1', // TGC
240+
'ARX_1', // NGC
241+
'ATXN2', // GCT
242+
'AFF2', // GCC
243+
'AR', // GCA
244+
'ATN1', // CAG
245+
'ATXN10', // ATTCT
246+
])
247+
})
248+
249+
test('sorts by region', async () => {
250+
const user = userEvent.setup()
251+
252+
render(
253+
<MemoryRouter>
254+
<ShortTandemRepeatsPage datasetId="gnomad_r4" />
255+
</MemoryRouter>
256+
)
257+
258+
const regionButton = screen.getByText('Region')
259+
260+
await user.click(regionButton)
261+
const ascendingIds = screen.queryAllByRole('rowheader').map((cell) => cell.textContent)
262+
expect(ascendingIds).toEqual([
263+
'AFF2', // 5'-UTR
264+
'ARX_1', // coding: polyanine
265+
'AR', // coding: polyglutamine
266+
'ATXN1', // Ersatz region
267+
'ATXN2', // Fake region
268+
'ATXN10', // intron
269+
'ATN1', // Made-up region
270+
])
271+
272+
await user.click(regionButton)
273+
const descendingIds = screen.queryAllByRole('rowheader').map((cell) => cell.textContent)
274+
expect(descendingIds).toEqual([
275+
'ATN1', // Made-up region
276+
'ATXN10', // intron
277+
'ATXN2', // Fake region
278+
'ATXN1', // Ersatz region
279+
'AR', // coding: polyglutamine
280+
'ARX_1', // coding: polyanine
281+
'AFF2', // 5'-UTR
282+
])
283+
})
284+
285+
test('sorts by disease inheritance mode', async () => {
286+
const user = userEvent.setup()
287+
288+
render(
289+
<MemoryRouter>
290+
<ShortTandemRepeatsPage datasetId="gnomad_r4" />
291+
</MemoryRouter>
292+
)
293+
294+
const inheritanceModeButton = screen.getByText('Inheritance mode')
295+
296+
await user.click(inheritanceModeButton)
297+
const ascendingIds = screen.queryAllByRole('rowheader').map((cell) => cell.textContent)
298+
expect(ascendingIds).toEqual([
299+
'ATN1', // Autosomal dominant
300+
'ATXN2', // Autosomal dominant, Autosomal recessive
301+
'ATXN1', // Autosomal miscellaneous
302+
'ATXN10', // Autosomal recessive
303+
'AFF2', // Imaginary inheritance mode
304+
'AR', // X-linked recessive
305+
'ARX_1', // X-linked recessive, Z-linked recessive
306+
])
307+
308+
await user.click(inheritanceModeButton)
309+
const descendingIds = screen.queryAllByRole('rowheader').map((cell) => cell.textContent)
310+
expect(descendingIds).toEqual([
311+
'ARX_1', // X-linked recessive, Z-linked recessive
312+
'AR', // X-linked recessive
313+
'AFF2', // Imaginary inheritance mode
314+
'ATXN10', // Autosomal recessive
315+
'ATXN1', // Autosomal miscellaneous
316+
'ATXN2', // Autosomal dominant, Autosomal recessive
317+
'ATN1', // Autosomal dominant
318+
])
319+
})
320+
321+
test('sorts by associated disease name', async () => {
322+
const user = userEvent.setup()
323+
324+
render(
325+
<MemoryRouter>
326+
<ShortTandemRepeatsPage datasetId="gnomad_r4" />
327+
</MemoryRouter>
328+
)
329+
330+
const diseaseNameButton = screen.getByText('Associated disease(s)')
331+
332+
await user.click(diseaseNameButton)
333+
const ascendingIds = screen.queryAllByRole('rowheader').map((cell) => cell.textContent)
334+
expect(ascendingIds).toEqual([
335+
'ATN1', // Dentatorubral-pallidoluysian atrophy
336+
'ARX_1', // Developmental and epileptic encephalopathy-1, X-linked mental retardation with or without seizures
337+
'AFF2', // FRAXE mental retardation
338+
'ATXN2', // Made-up disease 1, Spinocerebellar ataxia 2
339+
'AR', // Spinal and bulbar muscular atrophy
340+
'ATXN1', // Spinocerebellar ataxia 1
341+
'ATXN10', // Spinocerebellar ataxia 10
342+
])
343+
344+
await user.click(diseaseNameButton)
345+
const descendingIds = screen.queryAllByRole('rowheader').map((cell) => cell.textContent)
346+
expect(descendingIds).toEqual([
347+
'ATXN10', // Spinocerebellar ataxia 10
348+
'ATXN1', // Spinocerebellar ataxia 1
349+
'AR', // Spinal and bulbar muscular atrophy
350+
'ATXN2', // Made-up disease 1, Spinocerebellar ataxia 2
351+
'AFF2', // FRAXE mental retardation
352+
'ARX_1', // Developmental and epileptic encephalopathy-1, X-linked mental retardation with or without seizures
353+
'ATN1', // Dentatorubral-pallidoluysian atrophy
354+
])
355+
})
356+
})
357+
})

0 commit comments

Comments
 (0)