import GenomeBrowser from "../src/scripts/component/genome-browser";
import genomeBrowserDataLayout from "../src/scripts/layout/genome-browser";
import { GenomeBrowserData, GeneData, GenomeBrowserState } from "../src/scripts/types";
import { select } from "d3-selection";
describe("Test Genome Browser", () => {
const result = 'chromosome ruler title (300 bp)0.0020.040.060.080.010012014016018020022024026028030025.0120Chromosome [25.0, 120]30.040.050.060.070.080.090.0100110120';
const genomeBrowserComponent = GenomeBrowser();
const width = 1500;
const window: [number, number] = [25, 120];
const chromosomeSize = 300;
const genes: GeneData[] = [
{
name: "gene 1",
strand: "-",
begin: 10,
end: 50,
gene: "insA",
},
{
name: "gene 2",
strand: "+",
begin: 60,
end: 100,
gene: "yaaY",
},
{
name: "gene 3",
strand: "+",
begin: 150,
end: 280,
gene: "foo",
}
];
const genomeBrowserState = {
width,
chromosomeSize,
window,
genes,
chromosome: {
title: "chromosome ruler title"
},
selectedChromosome: {
title: "Chromosome"
}
}
const genomeBrowserData = genomeBrowserDataLayout(
genomeBrowserState,
(scale, state: GenomeBrowserState) => [scale, state],
(geneLocation, state: GenomeBrowserState) => console.log(geneLocation)
);
const data: GenomeBrowserData[] = [genomeBrowserData];
document.body.innerHTML =
'';
const container = select("svg")
.select("g");
container
.datum(data)
.call(genomeBrowserComponent);
//
test("Test all dom element", () => {
// This is test is too much. Should find a smarter one that won't break
// for small changement.
expect(container.html()).toBe(result);
})
//
test("Test transform data", () => {
expect(genomeBrowserData.selectedChromosome.genes.length).toBe(2);
});
//
test("test window data", () => {
expect(genomeBrowserData.selectedChromosome.window).toBe(genomeBrowserState.window);
expect(genomeBrowserData.selectedChromosome.window).toBe(genomeBrowserData.chromosome.ruler.window);
expect(genomeBrowserData.selectedChromosome.window).toBe(genomeBrowserData.selectedChromosome.ruler.interval)
});
})