Merge pull request #27 from mg3-codes/cypress

Add Cypress testing

.github/workflows/test.yml

@@ -0,0 +1,22 @@
+# @format
+
+name: Test
+
+on:
+    push:
+        branches: ["**", "!master"]
+
+jobs:
+    test:
+        runs-on: ubuntu-latest
+        container: cypress/browsers:node-18.14.1-chrome-110.0.5481.96-1-ff-109.0-edge-110.0.1587.41-1
+        steps:
+            - name: Checkout
+              uses: actions/checkout@v3
+
+            - name: Cypress run
+              uses: cypress-io/github-action@v5.3.0
+              with:
+                  build: yarn build
+                  start: yarn preview
+                  browser: chrome

CHANGELOG.md

@@ -2,6 +2,10 @@
 
 # Changelog
 
+## 0.1.8
+
+-   Fix a bug where some values would not render in cells
+
 ## 0.1.7
 
 -   Fix multiple issues with filtering data

cypress.config.ts

@@ -0,0 +1,11 @@
+/** @format */
+
+import { defineConfig } from "cypress";
+
+export default defineConfig({
+	e2e: {
+		setupNodeEvents(on, config) {
+			// implement node event listeners here
+		},
+	},
+});

cypress/e2e/filter.cy.ts

@@ -0,0 +1,190 @@
+/**
+ * @author Michael Gamlem III
+ * @copyright This file is subject to the terms and conditions defined in file 'LICENSE', which is part of the source code for this project.
+ * @format
+ */
+
+describe("filter tests", () => {
+	beforeEach(() => {
+		cy.visit("http://localhost:3000");
+	});
+
+	it("can filter names", () => {
+		cy.get(".ag-row").should("have.length.at.least", 10);
+		cy.get(".ag-header-cell").eq(1).type("{ctrl}{enter}");
+		cy.get(".ag-text-field-input").first().type("Chill");
+		cy.get(".ag-row").should("have.length.below", 10);
+	});
+
+	it("can filter levels", () => {
+		cy.get(".ag-row").children().eq(2).should("have.text", "0");
+		cy.get(".ag-header-cell").eq(2).type("{ctrl}{enter}");
+		cy.get(".level-filter")
+			.children()
+			.each((child) => {
+				cy.wrap(child).get("input").should("be.checked");
+			});
+		cy.get(".level-filter")
+			.children()
+			.first()
+			.within((child) => {
+				cy.wrap(child).get("input").click().should("not.be.checked");
+			});
+		cy.get(".ag-row").children().eq(2).should("not.have.text", "0");
+	});
+
+	it("can filter casting times", () => {
+		cy.get(".ag-header-cell").eq(3).type("{ctrl}{enter}");
+		cy.get(".casting-time-filter")
+			.children()
+			.each((child) => {
+				cy.wrap(child).get("input").should("be.checked");
+			});
+		cy.get(".casting-time-filter")
+			.children()
+			.first()
+			.within((child) => {
+				cy.wrap(child).get("input").click();
+			})
+			.wait(1000);
+		cy.get(".ag-row").each((row) => {
+			cy.wrap(row).children().eq(3).should("not.have.text", "Action");
+		});
+	});
+
+	it("can filter duration", () => {
+		cy.get(".ag-header-cell").eq(4).type("{ctrl}{enter}");
+		cy.get(".duration-filter")
+			.children()
+			.each((child) => {
+				cy.wrap(child).get("input").should("be.checked");
+			});
+		cy.get(".duration-filter")
+			.children()
+			.first()
+			.within((child) => {
+				cy.wrap(child).get("input").click();
+			})
+			.wait(1000);
+		cy.get(".ag-row").each((row) => {
+			cy.wrap(row)
+				.children()
+				.eq(4)
+				.should("not.have.text", "Instantaneous");
+		});
+	});
+
+	it("can filter range", () => {
+		cy.get(".ag-header-cell").eq(5).type("{ctrl}{enter}");
+		cy.get(".range-filter")
+			.children()
+			.each((child) => {
+				cy.wrap(child).get("input").should("be.checked");
+			});
+		cy.get(".range-filter")
+			.children()
+			.first()
+			.within((child) => {
+				cy.wrap(child).get("input").click();
+			})
+			.wait(1000);
+		cy.get(".ag-row").each((row) => {
+			cy.wrap(row).children().eq(5).should("not.have.text", "Self");
+		});
+	});
+
+	it("can filter area", () => {
+		cy.get(".ag-header-cell").eq(6).type("{ctrl}{enter}");
+		cy.get(".distances")
+			.children()
+			.each((child) => {
+				cy.wrap(child).get("input").should("be.checked");
+			});
+		cy.get(".distances")
+			.children()
+			.first()
+			.within((child) => {
+				cy.wrap(child).get("input").click();
+			})
+			.wait(1000);
+		cy.get(".ag-row").each((row) => {
+			cy.wrap(row).children().eq(6).should("not.be.empty");
+		});
+	});
+
+	it("can filter attack", () => {
+		cy.get(".ag-header-cell").eq(7).type("{ctrl}{enter}");
+		cy.get(".attack-filter")
+			.children()
+			.each((child) => {
+				cy.wrap(child).get("input").should("be.checked");
+			});
+		cy.get(".attack-filter")
+			.children()
+			.first()
+			.within((child) => {
+				cy.wrap(child).get("input").click();
+			})
+			.wait(1000);
+		cy.get(".ag-row").each((row) => {
+			cy.wrap(row).children().eq(7).should("not.be.empty");
+		});
+	});
+
+	it("can filter saving throw", () => {
+		cy.get(".ag-header-cell").eq(8).type("{ctrl}{enter}");
+		cy.get(".saving-throw-filter")
+			.children()
+			.each((child) => {
+				cy.wrap(child).get("input").should("be.checked");
+			});
+		cy.get(".saving-throw-filter")
+			.children()
+			.first()
+			.within((child) => {
+				cy.wrap(child).get("input").click();
+			})
+			.wait(1000);
+		cy.get(".ag-row").each((row) => {
+			cy.wrap(row).children().eq(8).should("not.be.empty");
+		});
+	});
+
+	it("can filter damage", () => {
+		cy.get(".ag-header-cell").eq(9).type("{ctrl}{enter}");
+		cy.get(".damage-type-filter")
+			.children()
+			.each((child) => {
+				cy.wrap(child).get("input").should("be.checked");
+			});
+		cy.get(".damage-type-filter")
+			.children()
+			.first()
+			.within((child) => {
+				cy.wrap(child).get("input").click();
+			})
+			.wait(1000);
+		cy.get(".ag-row").each((row) => {
+			cy.wrap(row).children().eq(9).should("not.be.empty");
+		});
+	});
+
+	it("can filter effects", () => {
+		cy.get(".ag-header-cell").eq(10).type("{ctrl}{enter}");
+		cy.get(".effect-filter")
+			.children()
+			.each((child) => {
+				cy.wrap(child).get("input").should("be.checked");
+			});
+		cy.get(".effect-filter")
+			.children()
+			.first()
+			.within((child) => {
+				cy.wrap(child).get("input").click();
+			})
+			.wait(1000);
+		cy.get(".ag-row").each((row) => {
+			cy.wrap(row).children().eq(10).should("not.be.empty");
+		});
+	});
+});

cypress/e2e/general.cy.ts

@@ -0,0 +1,30 @@
+/**
+ * @author Michael Gamlem III
+ * @copyright This file is subject to the terms and conditions defined in file 'LICENSE', which is part of the source code for this project.
+ * @format
+ */
+
+describe("general tests", () => {
+	beforeEach(() => {
+		cy.visit("http://localhost:3000");
+	});
+
+	it("changes dark and light mode", () => {
+		cy.get(".header-buttons").within(() => {
+			cy.get(".btn-link").click();
+		});
+		cy.get(".accordion-item")
+			.first()
+			.click()
+			.get(".btn-group")
+			.as("theme-button-group")
+			.within(() => {
+				cy.get(".btn.btn-primary").last().click();
+			});
+		cy.get("html").invoke("attr", "data-bs-theme").should("eq", "dark");
+		cy.get("@theme-button-group").within(() => {
+			cy.get(".btn.btn-primary").first().click();
+		});
+		cy.get("html").invoke("attr", "data-bs-theme").should("eq", "");
+	});
+});

cypress/e2e/table.cy.ts

@@ -0,0 +1,114 @@
+/**
+ * @author Michael Gamlem III
+ * @copyright This file is subject to the terms and conditions defined in file 'LICENSE', which is part of the source code for this project.
+ * @format
+ */
+
+const defaultColumns = [
+	"",
+	"Name",
+	"Level",
+	"Casting Time",
+	"Duration",
+	"Range",
+	"Area",
+	"Attack",
+	"Save",
+	"Damage",
+	"Effect",
+	"Material",
+	"Source",
+	"Details",
+];
+
+describe("table tests", () => {
+	beforeEach(() => {
+		cy.visit("http://localhost:3000");
+	});
+
+	it("renders", () => {
+		cy.get(".ag-root-wrapper");
+		cy.get(".ag-center-cols-container");
+		cy.get(".ag-cell");
+		cy.get(".ag-center-cols-container")
+			.children()
+			.should("have.length.at.least", 10);
+	});
+
+	it("has no checked rows", () => {
+		cy.get(".ag-checkbox-input").each((input) => {
+			cy.wrap(input).should("not.be.checked");
+		});
+	});
+
+	it("has default columns", () => {
+		cy.get(".ag-header-cell-text").each((cell) => {
+			expect(cell.text()).to.be.oneOf(defaultColumns);
+		});
+	});
+
+	it("has default columns checked", () => {
+		cy.get(".header-buttons")
+			.first()
+			.within(() => {
+				cy.get(".btn-link").click();
+			});
+		cy.get(".accordion-item").last().click();
+		cy.get(".check-column").each((column) => {
+			cy.wrap(column)
+				.children()
+				.each((checkDiv) => {
+					cy.wrap(checkDiv).within(() => {
+						cy.wrap(checkDiv)
+							.children()
+							.get("label")
+							.invoke("text")
+							.then((text) => {
+								const match = text.match(
+									new RegExp(
+										`${defaultColumns
+											.slice(1, defaultColumns.length)
+											.join("|")}`,
+										"g",
+									),
+								);
+								if (match) cy.get("input").should("be.checked");
+								else cy.get("input").should("not.be.checked");
+							});
+					});
+				});
+		});
+	});
+
+	it("can show and hide colum", () => {
+		cy.get(".ag-header-cell-text").should("not.contain.text", "School");
+		cy.get(".header-buttons")
+			.first()
+			.within(() => {
+				cy.get(".btn-link").click();
+			});
+		cy.get(".accordion-item").last().click();
+		cy.get(".check-column")
+			.first()
+			.within((column) => {
+				cy.wrap(column)
+					.get("label")
+					.contains("School")
+					.siblings("input")
+					.should("not.be.checked")
+					.click();
+			});
+		cy.get(".ag-header-cell-text").should("contain.text", "School");
+		cy.get(".check-column")
+			.first()
+			.within((column) => {
+				cy.wrap(column)
+					.get("label")
+					.contains("School")
+					.siblings("input")
+					.should("be.checked")
+					.click();
+			});
+		cy.get(".ag-header-cell-text").should("not.contain.text", "School");
+	});
+});

cypress/fixtures/example.json

@@ -0,0 +1,5 @@
+{
+	"name": "Using fixtures to represent data",
+	"email": "hello@cypress.io",
+	"body": "Fixtures are a great way to mock data for responses to routes"
+}