From 2a1e0d9606710e402505e72fa1f25fb58b2094f9 Mon Sep 17 00:00:00 2001 From: Jeremy Thomas Date: Sun, 8 May 2022 09:21:02 +0100 Subject: [PATCH] Add generic specs --- docs/cyp/base/generic.html | 33 +++++ docs/cypress.json | 5 + docs/cypress/integration/base/generic.spec.js | 139 ++++++++++++++++++ 3 files changed, 177 insertions(+) create mode 100644 docs/cyp/base/generic.html create mode 100644 docs/cypress/integration/base/generic.spec.js diff --git a/docs/cyp/base/generic.html b/docs/cyp/base/generic.html new file mode 100644 index 00000000..7205c74a --- /dev/null +++ b/docs/cyp/base/generic.html @@ -0,0 +1,33 @@ +--- +layout: cypress +title: Base/Generic +--- + +
article
+ +
figure
+ +
header
+
hgroup
+
section
+body + +input +optgroup + + +code +
precode
+Bulma: a modern CSS framework based on Flexbox +Link strong> +
hr +img +small +span +strong +
fieldset
+
thtd
+
+ + +
diff --git a/docs/cypress.json b/docs/cypress.json index 7058c351..bc3fa955 100644 --- a/docs/cypress.json +++ b/docs/cypress.json @@ -68,6 +68,8 @@ "text-light": "rgb(122, 122, 122)", "text-invert": "rgb(255, 255, 255)", + "code": "rgb(218, 16, 57)", + "control-radius": "4px", "control-radius-small": "2px", "control-border-width": "1px", @@ -89,6 +91,9 @@ "weight-semibold": "600", "weight-bold": "700", + "family-primary": "\"system-ui\", -apple-system, \"Segoe UI\", Roboto, Oxygen, Ubuntu, Cantarell, \"Fira Sans\", \"Droid Sans\", \"Helvetica Neue\", Helvetica, Arial, sans-serif", + "family-code": "monospace", + "viewports": { "mobile": [320, 480], "tablet": [769, 640], diff --git a/docs/cypress/integration/base/generic.spec.js b/docs/cypress/integration/base/generic.spec.js new file mode 100644 index 00000000..f7c84859 --- /dev/null +++ b/docs/cypress/integration/base/generic.spec.js @@ -0,0 +1,139 @@ +describe("Base/Generic", () => { + beforeEach(() => { + cy.visit("http://127.0.0.1:4000/cyp/base/generic/"); + }); + + it("has a correct html", () => { + cy.get("html").then(($) => { + const cs = window.getComputedStyle($[0]); + expect(cs.backgroundColor).to.equal(Cypress.env("scheme-main")); + expect(cs.fontSize).to.equal("16px"); + expect(cs.minWidth).to.equal("300px"); + expect(cs.overflowX).to.equal("hidden"); + expect(cs.overflowY).to.equal("scroll"); + expect(cs.textRendering).to.equal("optimizelegibility"); + expect(cs.textSizeAdjust).to.equal("100%"); + expect(cs.webkitFontSmoothing).to.equal("antialiased"); + }); + }); + + it("has correct HTML5 elements", () => { + cy.get("article, aside, figure, footer, header, hgroup, section").then( + ($) => { + const cs = window.getComputedStyle($[0]); + expect(cs.display).to.equal("block"); + } + ); + }); + + it("has correct form elements", () => { + cy.get("body, button, input, optgroup, select, textarea").then(($) => { + const cs = window.getComputedStyle($[0]); + expect(cs.fontFamily).to.equal(Cypress.env("family-primary")); + }); + }); + + it("has correct monospace elements", () => { + cy.get("pre, code").then(($) => { + const cs = window.getComputedStyle($[0]); + expect(cs.fontFamily).to.equal(Cypress.env("family-code")); + expect(cs.webkitFontSmoothing).to.equal("auto"); + }); + }); + + it("has a correct body", () => { + cy.get("body").then(($) => { + const cs = window.getComputedStyle($[0]); + expect(cs.color).to.equal(Cypress.env("text")); + expect(cs.fontFamily).to.equal(Cypress.env("family-primary")); + expect(cs.fontSize).to.equal("16px"); + expect(cs.fontWeight).to.equal("400"); + expect(cs.lineHeight).to.equal("24px"); + }); + }); + + it("has a correct a", () => { + cy.get("a").then(($) => { + const cs = window.getComputedStyle($[0]); + expect(cs.color).to.equal(Cypress.env("link")); + expect(cs.cursor).to.equal("pointer"); + expect(cs.textDecorationLine).to.equal("none"); + }); + }); + + it("has a correct code", () => { + cy.get("code").then(($) => { + const cs = window.getComputedStyle($[0]); + expect(cs.backgroundColor).to.equal(Cypress.env("white-ter")); + expect(cs.color).to.equal(Cypress.env("code")); + }); + }); + + it("has a correct hr", () => { + cy.get("hr").then(($) => { + const cs = window.getComputedStyle($[0]); + expect(cs.backgroundColor).to.equal(Cypress.env("white-ter")); + expect(cs.borderStyle).to.equal("none"); + expect(cs.display).to.equal("block"); + expect(cs.height).to.equal("2px"); + expect(cs.margin).to.equal("24px 0px"); + }); + }); + + it("has a correct img", () => { + cy.get("img").then(($) => { + const cs = window.getComputedStyle($[0]); + expect(cs.height).to.equal("28px"); + expect(cs.width).to.equal("112px"); + }); + }); + + it("has a correct checkbox", () => { + cy.get("input[type='checkbox']").then(($) => { + const cs = window.getComputedStyle($[0]); + expect(cs.verticalAlign).to.equal("baseline"); + }); + }); + + it("has a correct radio", () => { + cy.get("input[type='radio']").then(($) => { + const cs = window.getComputedStyle($[0]); + expect(cs.verticalAlign).to.equal("baseline"); + }); + }); + + it("has a correct small", () => { + cy.get("small").then(($) => { + const cs = window.getComputedStyle($[0]); + expect(cs.fontSize).to.equal("14px"); + }); + }); + + it("has a correct fieldset", () => { + cy.get("fieldset").then(($) => { + const cs = window.getComputedStyle($[0]); + expect(cs.borderStyle).to.equal("none"); + }); + }); + + it("has a correct pre", () => { + cy.get("pre").then(($) => { + const cs = window.getComputedStyle($[0]); + expect(cs.backgroundColor).to.equal(Cypress.env("white-ter")); + expect(cs.color).to.equal(Cypress.env("text")); + expect(cs.fontSize).to.equal("14px"); + expect(cs.overflowX).to.equal("auto"); + expect(cs.padding).to.equal("20px 24px"); + expect(cs.whiteSpace).to.equal("pre"); + expect(cs.wordWrap).to.equal("normal"); + }); + + cy.get("pre code").then(($) => { + const cs = window.getComputedStyle($[0]); + expect(cs.backgroundColor).to.equal(Cypress.env("transparent")); + expect(cs.color).to.equal(Cypress.env("text")); + expect(cs.fontSize).to.equal("14px"); + expect(cs.padding).to.equal("0px"); + }); + }); +});