Skip to content

Commit 50ee1d9

Browse files
BenjaminCharmesBenjaminCharmes
committed
Update datatable component tests
1 parent 9da79e6 commit 50ee1d9

File tree

2 files changed

+258
-0
lines changed

2 files changed

+258
-0
lines changed

‎webapp/cypress/component/EquipmentTableTest.cy.jsx

Lines changed: 133 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,133 @@
1+
import EquipmentTable from "@/components/EquipmentTable.vue";
2+
import PrimeVue from "primevue/config";
3+
import { createStore } from "vuex";
4+
5+
const IsoDatetimeToDate = (value) => {
6+
if (!value) return "";
7+
const date = new Date(value);
8+
return date.toLocaleDateString();
9+
};
10+
11+
describe("EquipmentTable Component Tests", () => {
12+
let store;
13+
14+
beforeEach(() => {
15+
store = createStore({
16+
state() {
17+
return {
18+
equipment_list: [
19+
{
20+
item_id: "equipment1",
21+
type: "equipment",
22+
name: "Equipment One",
23+
date: "2023-09-01T12:34:56Z",
24+
location: "Warehouse A",
25+
creators: [{ display_name: "Maintainer A" }],
26+
},
27+
{
28+
item_id: "equipment2",
29+
type: "equipment",
30+
name: "Equipment Two",
31+
date: "2023-08-15T08:45:30Z",
32+
location: "Warehouse B",
33+
creators: [{ display_name: "Maintainer B" }, { display_name: "Maintainer C" }],
34+
},
35+
],
36+
};
37+
},
38+
});
39+
40+
cy.mount(EquipmentTable, {
41+
global: {
42+
plugins: [store, PrimeVue],
43+
config: {
44+
globalProperties: {
45+
$filters: {
46+
IsoDatetimeToDate,
47+
},
48+
},
49+
},
50+
},
51+
});
52+
});
53+
54+
it("renders the correct buttons", () => {
55+
cy.get('[data-testid="add-item-button"]').should("not.exist");
56+
cy.get('[data-testid="batch-item-button"]').should("not.exist");
57+
cy.get('[data-testid="scan-qr-button"]').should("not.exist");
58+
cy.get('[data-testid="add-collection-button"]').should("not.exist");
59+
cy.get('[data-testid="add-starting-material-button"]').should("not.exist");
60+
cy.get('[data-testid="add-equipment-button"]').should("exist");
61+
cy.get('[data-testid="add-to-collection-button"]').should("not.exist");
62+
cy.get('[data-testid="delete-selected-button"]').should("not.exist");
63+
cy.get('[data-testid="search-input"]').should("exist");
64+
});
65+
66+
it("renders the correct columns in the table", () => {
67+
const headers = [
68+
"", // checkbox
69+
"ID",
70+
"Name",
71+
"Date",
72+
"Location",
73+
"Maintainers",
74+
];
75+
76+
cy.get(".p-datatable-column-header-content").should("have.length", headers.length);
77+
cy.get(".p-datatable-column-header-content").each((header, index) => {
78+
cy.wrap(header).should("contain.text", headers[index]);
79+
});
80+
});
81+
82+
it("displays data from the Vuex store", () => {
83+
cy.get(".p-datatable-tbody")
84+
.find("tr")
85+
.eq(0)
86+
.within(() => {
87+
cy.get("td").eq(0).should("contain.text", "");
88+
cy.get("td").eq(1).should("contain.text", "equipment1");
89+
cy.get("td").eq(2).should("contain.text", "Equipment One");
90+
cy.get("td").eq(3).should("contain.text", "01/09/2023");
91+
cy.get("td").eq(4).should("contain.text", "Warehouse A");
92+
cy.get("td").eq(5).find(".avatar").should("have.length", 1);
93+
});
94+
95+
cy.get(".p-datatable-tbody")
96+
.find("tr")
97+
.eq(1)
98+
.within(() => {
99+
cy.get("td").eq(0).should("contain.text", "");
100+
cy.get("td").eq(1).should("contain.text", "equipment2");
101+
cy.get("td").eq(2).should("contain.text", "Equipment Two");
102+
cy.get("td").eq(3).should("contain.text", "15/08/2023");
103+
cy.get("td").eq(4).should("contain.text", "Warehouse B");
104+
cy.get("td").eq(5).find(".avatar").should("have.length", 2);
105+
});
106+
});
107+
108+
it("renders the component FormattedItemName", () => {
109+
cy.get(".p-datatable-tbody tr")
110+
.eq(0)
111+
.within(() => {
112+
cy.get("td").eq(1).find(".formatted-item-name").should("exist");
113+
});
114+
cy.get(".p-datatable-tbody tr")
115+
.eq(1)
116+
.within(() => {
117+
cy.get("td").eq(1).find(".formatted-item-name").should("exist");
118+
});
119+
});
120+
121+
it("renders the component Creators", () => {
122+
cy.get(".p-datatable-tbody tr")
123+
.eq(0)
124+
.within(() => {
125+
cy.get("td").eq(5).find(".avatar").should("exist");
126+
});
127+
cy.get(".p-datatable-tbody tr")
128+
.eq(1)
129+
.within(() => {
130+
cy.get("td").eq(5).find(".avatar").should("exist");
131+
});
132+
});
133+
});

‎webapp/cypress/component/StartingMaterialTableTest.cy.jsx

Lines changed: 125 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,125 @@
1+
import StartingMaterialTable from "@/components/StartingMaterialTable.vue";
2+
import PrimeVue from "primevue/config";
3+
import { createStore } from "vuex";
4+
5+
const IsoDatetimeToDate = (value) => {
6+
if (!value) return "";
7+
const date = new Date(value);
8+
return date.toLocaleDateString();
9+
};
10+
11+
describe("StartingMaterialTable Component Tests", () => {
12+
let store;
13+
14+
beforeEach(() => {
15+
store = createStore({
16+
state() {
17+
return {
18+
starting_material_list: [
19+
{
20+
item_id: "material1",
21+
type: "starting_materials",
22+
name: "Material One",
23+
chemform: "H2O",
24+
date: "2023-09-01",
25+
chemical_purity: "99%",
26+
nblocks: 1,
27+
},
28+
{
29+
item_id: "material2",
30+
type: "starting_materials",
31+
name: "Material Two",
32+
chemform: "CH4",
33+
date: "2023-08-15",
34+
chemical_purity: "95%",
35+
nblocks: 2,
36+
},
37+
],
38+
};
39+
},
40+
});
41+
42+
cy.mount(StartingMaterialTable, {
43+
global: {
44+
plugins: [store, PrimeVue],
45+
config: {
46+
globalProperties: {
47+
$filters: {
48+
IsoDatetimeToDate,
49+
},
50+
},
51+
},
52+
},
53+
});
54+
});
55+
56+
it("renders the correct buttons", () => {
57+
cy.get('[data-testid="add-item-button"]').should("not.exist");
58+
cy.get('[data-testid="batch-item-button"]').should("not.exist");
59+
cy.get('[data-testid="scan-qr-button"]').should("not.exist");
60+
cy.get('[data-testid="add-collection-button"]').should("not.exist");
61+
cy.get('[data-testid="add-starting-material-button"]').should("exist");
62+
cy.get('[data-testid="add-equipment-button"]').should("not.exist");
63+
cy.get('[data-testid="add-to-collection-button"]').should("not.exist");
64+
cy.get('[data-testid="delete-selected-button"]').should("not.exist");
65+
cy.get('[data-testid="search-input"]').should("exist");
66+
});
67+
68+
it("renders the correct columns in the table", () => {
69+
const headers = [
70+
"", // checkbox
71+
"ID",
72+
"Name",
73+
"Formula",
74+
"Date",
75+
"Purity",
76+
"# of blocks",
77+
];
78+
79+
cy.get(".p-datatable-column-header-content").should("have.length", headers.length);
80+
cy.get(".p-datatable-column-header-content").each((header, index) => {
81+
cy.wrap(header).should("contain.text", headers[index]);
82+
});
83+
});
84+
85+
it("displays data from the Vuex store", () => {
86+
cy.get(".p-datatable-tbody")
87+
.find("tr")
88+
.eq(0)
89+
.within(() => {
90+
cy.get("td").eq(0).should("contain.text", "");
91+
cy.get("td").eq(1).should("contain.text", "material1");
92+
cy.get("td").eq(2).should("contain.text", "Material One");
93+
cy.get("td").eq(3).should("contain.text", "H2O");
94+
cy.get("td").eq(4).should("contain.text", "01/09/2023");
95+
cy.get("td").eq(5).should("contain.text", "99%");
96+
cy.get("td").eq(6).should("contain.text", "1");
97+
});
98+
99+
cy.get(".p-datatable-tbody")
100+
.find("tr")
101+
.eq(1)
102+
.within(() => {
103+
cy.get("td").eq(0).should("contain.text", "");
104+
cy.get("td").eq(1).should("contain.text", "material2");
105+
cy.get("td").eq(2).should("contain.text", "Material Two");
106+
cy.get("td").eq(3).should("contain.text", "CH4");
107+
cy.get("td").eq(4).should("contain.text", "15/08/2023");
108+
cy.get("td").eq(5).should("contain.text", "95%");
109+
cy.get("td").eq(6).should("contain.text", "2");
110+
});
111+
});
112+
113+
it("renders the component FormattedItemName", () => {
114+
cy.get(".p-datatable-tbody tr")
115+
.eq(0)
116+
.within(() => {
117+
cy.get("td").eq(1).find(".formatted-item-name").should("exist");
118+
});
119+
cy.get(".p-datatable-tbody tr")
120+
.eq(1)
121+
.within(() => {
122+
cy.get("td").eq(1).find(".formatted-item-name").should("exist");
123+
});
124+
});
125+
});

0 commit comments

Comments
 (0)