fork/cellxgene
1
0
Fork 0
mirror of https://github.com/chanzuckerberg/cellxgene.git synced 2026-09-29 08:48:11 +08:00
Code Issues Packages Projects Releases Wiki Activity

run prettier(2.0.5) (#1438)

Browse Source
This commit is contained in:
Severiano Badajoz
2020-05-04 10:26:42 -07:00
committed by GitHub
parent b255e32548
commit 6cccc41c0f
118 changed files with 1979 additions and 1584 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/__tests__/e2e/cellxgeneActions.js
+53 -26
View File
@@ -1,7 +1,6 @@
import { strict as assert } from "assert";
export const cellxgeneActions = (page, utils) => ({
async drag(testId, start, end, lasso = false) {
const layout = await utils.waitByID(testId);
const elBox = await layout.boxModel();
@@ -31,22 +30,29 @@ export const cellxgeneActions = (page, utils) => ({
},
async getAllHistograms(testclass, testIds) {
const histTestIds = testIds.map(tid => `histogram-${tid}`);
const histTestIds = testIds.map((tid) => `histogram-${tid}`);
// these load asynchronously, so we need to wait for each histogram individually
await utils.waitForAllByIds(histTestIds);
const allHistograms = await utils.getAllByClass(testclass);
return allHistograms.map(hist => hist.replace(/^histogram-/, ""));
return allHistograms.map((hist) => hist.replace(/^histogram-/, ""));
},
async getAllCategoriesAndCounts(category) {
await utils.waitByClass("categorical-row");
return page.$$eval(
`[data-testid="category-${category}"] [data-testclass='categorical-row']`,
rows => Object.fromEntries(rows.map(row => {
const cat = row.querySelector("[data-testclass='categorical-value']").innerText;
const count = row.querySelector("[data-testclass='categorical-value-count']").innerText;
return [cat, count];
}))
(rows) =>
Object.fromEntries(
rows.map((row) => {
const cat = row.querySelector(
"[data-testclass='categorical-value']"
).innerText;
const count = row.querySelector(
"[data-testclass='categorical-value-count']"
).innerText;
return [cat, count];
})
)
);
},
@@ -60,12 +66,14 @@ export const cellxgeneActions = (page, utils) => ({
await utils.waitByID(checkboxId);
const checkedPseudoclass = await page.$eval(
`[data-testid='${checkboxId}']`,
el => el.matches(":checked")
(el) => el.matches(":checked")
);
if (!checkedPseudoclass) await utils.clickOn(checkboxId);
try {
const categoryRow = await utils.waitByID(`${category}:category-expand`);
const isExpanded = await categoryRow.$("[data-testclass='category-expand-is-expanded']");
const isExpanded = await categoryRow.$(
"[data-testclass='category-expand-is-expanded']"
);
if (isExpanded) await utils.clickOn(`${category}:category-expand`);
} catch {}
},
@@ -75,14 +83,22 @@ export const cellxgeneActions = (page, utils) => ({
const size = await el.boxModel();
return {
x: Math.floor(size.width * xAsPercent),
y: Math.floor(size.height * yAsPercent)
}
y: Math.floor(size.height * yAsPercent),
};
},
async calcDragCoordinates(testId, coordinateAsPercent) {
return {
start: await this.calcCoordinate(testId, coordinateAsPercent.x1, coordinateAsPercent.y1),
end: await this.calcCoordinate(testId, coordinateAsPercent.x2, coordinateAsPercent.y2)
start: await this.calcCoordinate(
testId,
coordinateAsPercent.x1,
coordinateAsPercent.y1
),
end: await this.calcCoordinate(
testId,
coordinateAsPercent.x2,
coordinateAsPercent.y2
),
};
},
@@ -97,7 +113,9 @@ export const cellxgeneActions = (page, utils) => ({
async expandCategory(category) {
const expand = await utils.waitByID(`${category}:category-expand`);
const notExpanded = await expand.$("[data-testclass='category-expand-is-not-expanded']");
const notExpanded = await expand.$(
"[data-testclass='category-expand-is-not-expanded']"
);
if (notExpanded) await utils.clickOn(`${category}:category-expand`);
},
@@ -117,7 +135,10 @@ export const cellxgeneActions = (page, utils) => ({
async renameCategory(oldCatgoryName, newCategoryName) {
await utils.clickOn(`${oldCatgoryName}:see-actions`);
await utils.clickOn(`${oldCatgoryName}:edit-category-mode`);
await utils.clearInputAndTypeInto(`${oldCatgoryName}:edit-category-name-text`, newCategoryName);
await utils.clearInputAndTypeInto(
`${oldCatgoryName}:edit-category-name-text`,
newCategoryName
);
await utils.clickOn(`${oldCatgoryName}:submit-category-edit`);
},
@@ -136,7 +157,7 @@ export const cellxgeneActions = (page, utils) => ({
async deleteLabel(categoryName, labelName) {
await this.expandCategory(categoryName);
await utils.clickOn(`${categoryName}:${labelName}:see-actions`);
await utils.clickOn( `${categoryName}:${labelName}:delete-label`);
await utils.clickOn(`${categoryName}:${labelName}:delete-label`);
},
async renameLabel(categoryName, oldLabelName, newLabelName) {
@@ -153,17 +174,23 @@ export const cellxgeneActions = (page, utils) => ({
async addGeneToSearch(geneName) {
await utils.typeInto("gene-search", geneName);
await page.keyboard.press("Enter");
await page.waitForSelector(
`[data-testid='histogram-${geneName}']`
);
await page.waitForSelector(`[data-testid='histogram-${geneName}']`);
},
async subset(coordinatesAsPercent) {
// In order to deselect the selection after the subset, make sure we have some clear part
// of the scatterplot we can click on
assert(coordinatesAsPercent.x2 < 0.99 || coordinatesAsPercent.y2 < 0.99);
const lassoSelection = await this.calcDragCoordinates( "layout-graph", coordinatesAsPercent);
await this.drag("layout-graph", lassoSelection.start, lassoSelection.end, true );
const lassoSelection = await this.calcDragCoordinates(
"layout-graph",
coordinatesAsPercent
);
await this.drag(
"layout-graph",
lassoSelection.start,
lassoSelection.end,
true
);
await utils.clickOn("subset-button");
const clearCoordinate = await this.calcCoordinate(
"layout-graph",
@@ -174,7 +201,9 @@ export const cellxgeneActions = (page, utils) => ({
},
async setSellSet(cellSet, cellSetNum) {
for (const selection of cellSet.filter(sel => sel.kind === "categorical")) {
for (const selection of cellSet.filter(
(sel) => sel.kind === "categorical"
)) {
await this.selectCategory(selection.metadata, selection.values, true);
}
await this.cellSet(cellSetNum);
@@ -190,7 +219,5 @@ export const cellxgeneActions = (page, utils) => ({
await utils.clickOn("section-bulk-add");
await utils.typeInto("input-bulk-add", geneNames.join(","));
await page.keyboard.press("Enter");
}
},
});
client/__tests__/e2e/config.js
+2 -1
View File
@@ -1,6 +1,7 @@
export const jest_env = process.env.JEST_ENV;
export const appPort = process.env.CXG_SERVER_PORT;
export const appUrlBase = process.env.CXG_URL_BASE || `http://localhost:${appPort}`;
export const appUrlBase =
process.env.CXG_URL_BASE || `http://localhost:${appPort}`;
export const DEV = jest_env === "dev";
export const DEBUG = jest_env === "debug";
export const DATASET = "pbmc3k";
client/__tests__/e2e/data.js
+37 -37
View File
@@ -4,7 +4,7 @@ export const datasets = {
dataframe: {
nObs: "2638",
nVar: "1838",
type: "float32"
type: "float32",
},
categorical: {
louvain: {
@@ -15,47 +15,47 @@ export const datasets = {
"Dendritic cells": "37",
"FCGR3A+ Monocytes": "150",
Megakaryocytes: "15",
"NK cells": "154"
}
"NK cells": "154",
},
},
continuous: {
n_genes: "int32",
percent_mito: "float32",
n_counts: "float32"
n_counts: "float32",
},
cellsets: {
lasso: [
{
"coordinates-as-percent": { x1: 0.1, y1: 0.25, x2: 0.7, y2: 0.75 },
count: "1181"
}
count: "1181",
},
],
categorical: [
{
metadata: "louvain",
values: ["B cells", "Megakaryocytes"],
count: "357"
}
count: "357",
},
],
continuous: [
{
metadata: "n_genes",
"coordinates-as-percent": { x1: 0.25, y1: 0.5, x2: 0.55, y2: 0.5 },
count: "1537"
}
]
count: "1537",
},
],
},
diffexp: {
cellset1: [
{ kind: "categorical", metadata: "louvain", values: ["B cells"] }
{ kind: "categorical", metadata: "louvain", values: ["B cells"] },
],
cellset2: [
{
kind: "categorical",
metadata: "louvain",
values: ["CD4 T cells", "NK cells"]
}
values: ["CD4 T cells", "NK cells"],
},
],
"gene-results": [
"HLA-DRB1",
@@ -67,21 +67,21 @@ export const datasets = {
"HLA-DQB1",
"MS4A1",
"IL32",
"CD37"
]
"CD37",
],
},
genes: {
bulkadd: ["S100A8", "FCGR3A", "LGALS2", "GSTP1"],
search: "ACD"
search: "ACD",
},
subset: {
cellset1: [
{
kind: "categorical",
metadata: "louvain",
values: ["B cells", "Megakaryocytes"]
}
values: ["B cells", "Megakaryocytes"],
},
],
count: "357",
categorical: {
@@ -93,27 +93,27 @@ export const datasets = {
"Dendritic cells": "0",
"FCGR3A+ Monocytes": "0",
Megakaryocytes: "15",
"NK cells": "0"
}
"NK cells": "0",
},
},
lasso: {
"coordinates-as-percent": { x1: 0.25, y1: 0.05, x2: 0.75, y2: 0.55 },
count: "329"
}
count: "329",
},
},
scatter: {
genes: { x: "S100A8", y: "FCGR3A" }
genes: { x: "S100A8", y: "FCGR3A" },
},
pan: {
"coordinates-as-percent": { x1: 0.75, y1: 0.75, x2: 0.35, y2: 0.35 }
"coordinates-as-percent": { x1: 0.75, y1: 0.75, x2: 0.35, y2: 0.35 },
},
features: {
panzoom: {
lasso: {
"coordinates-as-percent": { x1: 0.3, y1: 0.3, x2: 0.5, y2: 0.5 },
count: "24"
}
}
count: "24",
},
},
},
categoryLabel: {
lasso: {
@@ -122,17 +122,17 @@ export const datasets = {
newCount: {
bySubsetConfig: {
false: "600",
true: "591"
}
}
true: "591",
},
},
},
annotationsFromFile: {
count: {
bySubsetConfig: {
false: "1161",
true: "856"
}
}
true: "856",
},
},
},
clip: {
min: "30",
@@ -141,7 +141,7 @@ export const datasets = {
gene: "S100A8",
"coordinates-as-percent": { x1: 0.25, y1: 0.5, x2: 0.55, y2: 0.5 },
count: "386",
"gene-cell-count": "416"
}
}
"gene-cell-count": "416",
},
},
};
client/__tests__/e2e/e2e.test.js
+46 -17
View File
@@ -24,7 +24,9 @@ afterAll(() => {
describe("did launch", () => {
test("page launched", async () => {
const element = await utils.getOneElementInnerHTML("[data-testid='header']");
const element = await utils.getOneElementInnerHTML(
"[data-testid='header']"
);
expect(element).toBe(data.title);
});
});
@@ -32,7 +34,9 @@ describe("did launch", () => {
describe("metadata loads", () => {
test("categories and values from dataset appear", async () => {
for (const label in data.categorical) {
const categoryName = await utils.getOneElementInnerText(`[data-testid="category-${label}"]`);
const categoryName = await utils.getOneElementInnerText(
`[data-testid="category-${label}"]`
);
expect(categoryName).toMatch(label);
await utils.clickOn(`${label}:category-expand`);
const categories = await cxgActions.getAllCategoriesAndCounts(label);
@@ -50,7 +54,6 @@ describe("metadata loads", () => {
await utils.waitByID(`histogram-${label}`);
}
});
});
describe("cell selection", () => {
@@ -81,7 +84,9 @@ describe("cell selection", () => {
await utils.clickOn(`${cellset.metadata}:category-expand`);
await utils.clickOn(`${cellset.metadata}:category-select`);
for (const val of cellset.values) {
await utils.clickOn(`categorical-value-select-${cellset.metadata}-${val}`);
await utils.clickOn(
`categorical-value-select-${cellset.metadata}-${val}`
);
}
const cellCount = await cxgActions.cellSet(1);
expect(cellCount).toBe(cellset.count);
@@ -103,12 +108,16 @@ describe("cell selection", () => {
});
describe("gene entry", () => {
test("search for single gene", async () => cxgActions.addGeneToSearch(data.genes.search));
test("search for single gene", async () =>
cxgActions.addGeneToSearch(data.genes.search));
test("bulk add genes", async () => {
const testGenes = data.genes.bulkadd;
await cxgActions.bulkAddGenes(testGenes);
const allHistograms = await cxgActions.getAllHistograms("histogram-user-gene", testGenes);
const allHistograms = await cxgActions.getAllHistograms(
"histogram-user-gene",
testGenes
);
expect(allHistograms).toEqual(expect.arrayContaining(testGenes));
expect(allHistograms.length).toEqual(testGenes.length);
});
@@ -172,11 +181,19 @@ describe("subset", () => {
const userDefinedGenes = data.genes.bulkadd;
const diffExpGenes = data.diffexp["gene-results"];
await cxgActions.bulkAddGenes(userDefinedGenes);
const userDefinedHistograms = await cxgActions.getAllHistograms("histogram-user-gene", userDefinedGenes);
expect(userDefinedHistograms).toEqual(expect.arrayContaining(userDefinedGenes));
await cxgActions.subset({x1: 0.15, y1: 0.10, x2: 0.98, y2: 0.98});
const userDefinedHistograms = await cxgActions.getAllHistograms(
"histogram-user-gene",
userDefinedGenes
);
expect(userDefinedHistograms).toEqual(
expect.arrayContaining(userDefinedGenes)
);
await cxgActions.subset({ x1: 0.15, y1: 0.1, x2: 0.98, y2: 0.98 });
await cxgActions.runDiffExp(data.diffexp.cellset1, data.diffexp.cellset2);
const diffExpHistograms = await cxgActions.getAllHistograms("histogram-diffexp", diffExpGenes);
const diffExpHistograms = await cxgActions.getAllHistograms(
"histogram-diffexp",
diffExpGenes
);
expect(diffExpHistograms).toEqual(expect.arrayContaining(diffExpGenes));
await utils.clickOn("reset-subset-button");
const expected = [].concat(userDefinedGenes, diffExpGenes);
@@ -184,26 +201,38 @@ describe("subset", () => {
"histogram-user-gene",
expected
);
expect(userDefinedHistogramsAfterSubset).toEqual(expect.arrayContaining(expected));
expect(userDefinedHistogramsAfterSubset).toEqual(
expect.arrayContaining(expected)
);
});
test("subset selection appends the top diff exp genes to user defined genes", async () => {
const userDefinedGenes = data.genes.bulkadd;
const diffExpGenes = data.diffexp["gene-results"];
await cxgActions.bulkAddGenes(userDefinedGenes);
const userDefinedHistograms = await cxgActions.getAllHistograms("histogram-user-gene", userDefinedGenes);
expect(userDefinedHistograms).toEqual(expect.arrayContaining(userDefinedGenes));
await cxgActions.subset({x1: 0.15, y1: 0.10, x2: 0.98, y2: 0.98});
const userDefinedHistograms = await cxgActions.getAllHistograms(
"histogram-user-gene",
userDefinedGenes
);
expect(userDefinedHistograms).toEqual(
expect.arrayContaining(userDefinedGenes)
);
await cxgActions.subset({ x1: 0.15, y1: 0.1, x2: 0.98, y2: 0.98 });
await cxgActions.runDiffExp(data.diffexp.cellset1, data.diffexp.cellset2);
const diffExpHistograms = await cxgActions.getAllHistograms("histogram-diffexp", diffExpGenes);
const diffExpHistograms = await cxgActions.getAllHistograms(
"histogram-diffexp",
diffExpGenes
);
expect(diffExpHistograms).toEqual(expect.arrayContaining(diffExpGenes));
await cxgActions.subset({x1: 0.16, y1: 0.11, x2: 0.97, y2: 0.97});
await cxgActions.subset({ x1: 0.16, y1: 0.11, x2: 0.97, y2: 0.97 });
const expected = [].concat(userDefinedGenes, diffExpGenes);
const userDefinedHistogramsAfterSubset = await cxgActions.getAllHistograms(
"histogram-user-gene",
expected
);
expect(userDefinedHistogramsAfterSubset).toEqual(expect.arrayContaining(expected));
expect(userDefinedHistogramsAfterSubset).toEqual(
expect.arrayContaining(expected)
);
});
});
client/__tests__/e2e/e2eAnnotations.test.js
+43 -21
View File
@@ -13,14 +13,13 @@ beforeAll(async () => {
});
afterAll(() => {
if (browser !== undefined) browser.close()
if (browser !== undefined) browser.close();
});
describe.each([
{withSubset: true, tag: "subset"},
{withSubset: false, tag: "whole"}
{ withSubset: true, tag: "subset" },
{ withSubset: false, tag: "whole" },
])("annotations", (config) => {
const perTestCategoryName = "per-test-category";
const perTestLabelName = "per-test-label";
@@ -31,7 +30,8 @@ describe.each([
// setup the test fixtures
await actions.createCategory(perTestCategoryName);
await actions.createLabel(perTestCategoryName, perTestLabelName);
if (config.withSubset) await actions.subset({x1: 0.10, y1: 0.10, x2: 0.80, y2: 0.80});
if (config.withSubset)
await actions.subset({ x1: 0.1, y1: 0.1, x2: 0.8, y2: 0.8 });
await utils.waitByClass("autosave-complete");
});
@@ -74,7 +74,11 @@ describe.each([
test("rename a label", async () => {
const newLabelName = "my-cool-new-label";
await assertLabelDoesNotExist(perTestCategoryName, newLabelName);
await actions.renameLabel(perTestCategoryName, perTestLabelName, newLabelName);
await actions.renameLabel(
perTestCategoryName,
perTestLabelName,
newLabelName
);
await assertLabelDoesNotExist(perTestCategoryName, perTestLabelName);
await assertLabelExists(perTestCategoryName, newLabelName);
});
@@ -83,8 +87,10 @@ describe.each([
const categoryName = "cluster-test";
const labelName = "four";
await actions.expandCategory(categoryName);
const result = await utils.waitByID(`categorical-value-count-${categoryName}-${labelName}`);
expect(await result.evaluate(node => node.innerText)).toBe(
const result = await utils.waitByID(
`categorical-value-count-${categoryName}-${labelName}`
);
expect(await result.evaluate((node) => node.innerText)).toBe(
data.annotationsFromFile.count.bySubsetConfig[config.withSubset]
);
});
@@ -101,11 +107,17 @@ describe.each([
lassoSelection.end,
true
);
await utils.waitByID("lasso-element", {visible: true});
await utils.clickOn(`${perTestCategoryName}:${perTestLabelName}:see-actions`);
await utils.clickOn(`${perTestCategoryName}:${perTestLabelName}:add-current-selection-to-this-label`);
const result = await utils.waitByID(`categorical-value-count-${perTestCategoryName}-${perTestLabelName}`);
expect(await result.evaluate(node => node.innerText)).toBe(
await utils.waitByID("lasso-element", { visible: true });
await utils.clickOn(
`${perTestCategoryName}:${perTestLabelName}:see-actions`
);
await utils.clickOn(
`${perTestCategoryName}:${perTestLabelName}:add-current-selection-to-this-label`
);
const result = await utils.waitByID(
`categorical-value-count-${perTestCategoryName}-${perTestLabelName}`
);
expect(await result.evaluate((node) => node.innerText)).toBe(
data.categoryLabel.newCount.bySubsetConfig[config.withSubset]
);
});
@@ -170,7 +182,11 @@ describe.each([
test("undo/redo label rename", async () => {
const newLabelName = `label-renamed-undo-${config.tag}`;
await assertLabelDoesNotExist(perTestCategoryName, newLabelName);
await actions.renameLabel(perTestCategoryName, perTestLabelName, newLabelName);
await actions.renameLabel(
perTestCategoryName,
perTestLabelName,
newLabelName
);
await assertLabelExists(perTestCategoryName, newLabelName);
await assertLabelDoesNotExist(perTestCategoryName, perTestLabelName);
await utils.clickOn("undo");
@@ -183,14 +199,16 @@ describe.each([
async function assertCategoryExists(categoryName) {
const handle = await utils.waitByID(`${categoryName}:category-expand`);
const result = await handle.evaluate(node => node.innerText);
const result = await handle.evaluate((node) => node.innerText);
// slice beginning and end of category name result to account for truncation of long names
expect(result.slice(0, 10)).toBe(categoryName.slice(0, 10));
expect(result.slice(-10)).toBe(categoryName.slice(-10));
}
async function assertCategoryDoesNotExist(categoryName) {
const result = await page.$(`[data-testid='${categoryName}:category-expand']`);
const result = await page.$(
`[data-testid='${categoryName}:category-expand']`
);
expect(result).toBeNull();
}
@@ -198,13 +216,17 @@ describe.each([
const category = await utils.waitByID(`${categoryName}:category-expand`);
expect(category).not.toBeNull();
await actions.expandCategory(categoryName);
const previous = await utils.waitByID(`categorical-value-${categoryName}-${labelName}`);
expect(await previous.evaluate(node => node.innerText)).toBe(labelName);
const previous = await utils.waitByID(
`categorical-value-${categoryName}-${labelName}`
);
expect(await previous.evaluate((node) => node.innerText)).toBe(labelName);
}
async function assertLabelDoesNotExist(categoryName, labelName) {
await actions.expandCategory(categoryName);
const result = await page.$(`[data-testid='categorical-value-${categoryName}-${labelName}']`);
const result = await page.$(
`[data-testid='categorical-value-${categoryName}-${labelName}']`
);
expect(result).toBeNull();
}
@@ -212,10 +234,10 @@ describe.each([
try {
const category = await page.waitForSelector(
`[data-testid='${categoryName}:category-expand']`,
{timeout: 200}
{ timeout: 200 }
);
if (category !== null) return await actions.deleteCategory(categoryName);
} catch {}
return null
return null;
}
});
client/__tests__/e2e/e2eJestConfig.json
+2 -6
View File
@@ -1,9 +1,5 @@
{
"preset": "jest-puppeteer",
"testMatch": [
"**/__tests__/**/?(*.)(spec|test).js?(x)"
],
"setupFiles": [
"../setupMissingGlobals.js"
]
"testMatch": ["**/__tests__/**/?(*.)(spec|test).js?(x)"],
"setupFiles": ["../setupMissingGlobals.js"]
}
client/__tests__/e2e/feature.test.js
+2 -2
View File
@@ -29,9 +29,9 @@ beforeAll(async () => {
page = await browser.newPage();
await page.setViewport(browserViewport);
if (DEV || DEBUG) {
page.on("console", msg => console.log(`PAGE LOG: ${msg.text()}`));
page.on("console", (msg) => console.log(`PAGE LOG: ${msg.text()}`));
}
page.on("pageerror", err => {
page.on("pageerror", (err) => {
throw new Error(`Console error: ${err}`);
});
utils = puppeteerUtils(page);
client/__tests__/e2e/puppeteerUtils.js
+8 -8
View File
@@ -1,4 +1,4 @@
export const puppeteerUtils = page => ({
export const puppeteerUtils = (page) => ({
async waitByID(testId, props = {}) {
return page.waitForSelector(`[data-testid='${testId}']`, props);
},
@@ -9,13 +9,13 @@ export const puppeteerUtils = page => ({
async waitForAllByIds(testIds) {
await Promise.all(
testIds.map(testId => page.waitForSelector(`[data-testid='${testId}']`))
testIds.map((testId) => page.waitForSelector(`[data-testid='${testId}']`))
);
},
async getAllByClass(testClass) {
return page.$$eval(`[data-testclass=${testClass}]`, eles =>
eles.map(ele => ele.dataset.testid)
return page.$$eval(`[data-testclass=${testClass}]`, (eles) =>
eles.map((ele) => ele.dataset.testid)
);
},
@@ -52,18 +52,18 @@ export const puppeteerUtils = page => ({
async getOneElementInnerHTML(selector) {
await page.waitForSelector(selector);
return page.$eval(selector, el => el.innerHTML);
return page.$eval(selector, (el) => el.innerHTML);
},
async getOneElementInnerText(selector) {
await page.waitForSelector(selector);
return page.$eval(selector, el => el.innerText);
return page.$eval(selector, (el) => el.innerText);
},
async getElementCoordinates(testid) {
return page.$eval(`[data-testid='${testid}']`, elem => {
return page.$eval(`[data-testid='${testid}']`, (elem) => {
const { left, top } = elem.getBoundingClientRect();
return [left, top];
});
}
},
});
client/__tests__/e2e/testBrowser.js
+20 -13
View File
@@ -7,41 +7,48 @@ export async function setupTestBrowser() {
const browserViewport = { width: 1280, height: 960 };
const browserParams = DEV
? {
headless: false,
slowMo: 5,
args: [ `--window-size=${browserViewport.width},${browserViewport.height}`]
}
headless: false,
slowMo: 5,
args: [
`--window-size=${browserViewport.width},${browserViewport.height}`,
],
}
: DEBUG
? {
? {
headless: false,
slowMo: 100,
devtools: true,
args: [ `--window-size=${browserViewport.width + 560},${browserViewport.height}`]
args: [
`--window-size=${browserViewport.width + 560},${
browserViewport.height
}`,
],
}
: {
args: [ `--window-size=${browserViewport.width},${browserViewport.height}`]
: {
args: [
`--window-size=${browserViewport.width},${browserViewport.height}`,
],
};
const browser = await puppeteer.launch(browserParams);
const page = await browser.pages().then(pages => pages[0]);
const page = await browser.pages().then((pages) => pages[0]);
await page.setViewport(browserViewport);
if (DEV || DEBUG) {
page.on("console", async msg => {
page.on("console", async (msg) => {
// If there is a console.error but an error is not thrown, this will ensure the test fails
if (msg.type() === "error") {
const errorMsgText = await Promise.all(
// TODO can we do this without internal properties?
msg.args().map(arg => arg._remoteObject.description)
msg.args().map((arg) => arg._remoteObject.description)
);
throw new Error(`Console error: ${errorMsgText}`);
}
console.log(`PAGE LOG: ${msg.text()}`);
});
}
page.on("pageerror", err => {
page.on("pageerror", (err) => {
throw new Error(`Console error: ${err}`);
});
const utils = puppeteerUtils(page);
const cxgActions = cellxgeneActions(page, utils);
return [browser, page, utils, cxgActions];
}